ローカル画面ストリームでの0.5秒周期的な引っかかりはmacOSのAWDLが原因だった

モバイルQAチームのためのセルフホスト型Appetize/BrowserStack代替ツール iOSシミュレーターとAndroidエミュレーターをあらゆるブラウザで実行できます — ツールチェーンのセットアップ、デバイスプール、クラウドアップロードは不要です。ビルド、ストリーム、録画は、あなたが管理するインフラ上に保持されます。 📖 ドキュメント · 🚀 クイックスタート · 🎥 デモ · 🎬 新しいデモのセットアップ.mp4 v0.x: tapflowは現在活発に開発中です。v1.0.0までマイナーバージョンで破壊的変更が発生する可能性があります。完全な計画についてはROADMAPをご覧ください。 なぜtapflowなのか？ モバイルQAは通常、シミュレーター、エミュレーター、または物理デバイスへのアクセスに依存しており、そのアクセスはチーム全体で不均一です。モバイル開発者にとっては、MacでXcodeまたはAndroid Studioを開くことを意味します。他の全員にとって、それは多くの場合、毎回モバイル開発者に尋ねることを意味します： バックエンド開発者 — 「デプロイされたものを確認するためにサンドボックスビルドをインストールするにはどうすればいいですか？」 プロダクトマネージャー — 「動作を比較するためだけに、何度もバージョンをインストールしたり削除したりしています。」 デザイナー — 「画面サイズごとのレイアウトを確認する必要がありますが、適切なデバイスがありません。」 物理デバイスは、OSバージョン対応、可用性、充電、ストレージ、引き渡しといった独自のオーバーヘッドを追加します。クラウドシミュレーターサービスはアクセス問題を解決しますが、社内ビルドをサードパーティサービスにアップロードし、リモートデバイスの費用を支払う必要があります。その間、あなたのMacはすでに同じシミュレーターを実行できるのです。 私たちはこの問題に直面したため、tapflowを構築しました。 解決策 欠点 Appetize / BrowserStack 定期的な費用 — そしてアプリビルドはサードパーティのクラウドにアップロードされます 物理デバイス コスト、可用性、OS対応、管理オーバーヘッド Xcode / Android Studio 各チームメイトはMacと完全なモバイルツールチェーンが必要です tapflow あなたのMacを再利用 — データはあなたが管理するインフラ上に残り、チーム全体がブラウザからQAを行います tapflowがすること tapflowは3つの部分を接続します： セルフホスト型リレーサーバー (LinuxまたはMac) iOSシミュレーターとAndroidエミュレーターを駆動するmacOSエージェント 残りのチームのためのブラウザダッシュボード エージェントはリレーにアウトバウンド接続します。チームメイトはダッシュボードを開き、利用可能なデバイスを選択し、リモートで操作します — シミュレーターとエミュレーターはあなたのMac上で実行され続けます。 tapflowがしないこと tapflowはネイティブモバイル開発ツールを置き換えません。モバイル開発者は引き続きXcode、Android Studio、およびそのビルドツールを使用します。tapflowは、実行中のシミュレーターとエミュレーターをブラウザを介してチームの他のメンバーがアクセスできるようにします — 自動化フレームワークやデバイスファームではありません。 仕組み ブラウザ (あなたのチーム) ←─ WebSocket ─→ リレーサーバー ←─ WebSocket (アウトバウンド) ─→ Macエージェント (Linux / Mac) (iOS · Android) Macエージェントはリレーにアウトバウンド接続します — インバウンドファイアウォールルールは不要です。チームの誰でもブラウザでダッシュボードを開き、利用可能なすべてのデバイスを見ることができます。タッチイベントはリアルタイムで転送され、画面はブラウザにストリームされます。リレーは同じポートでダッシュボードSPAも提供します — 別途ウェブサーバーは不要です。 クイックスタート 1. インストール npm install -g tapflow # または: yarn global add tapflow | pnpm add -g tapflow 2. 環境設定 エージェントを実行するMacで、シミュレーター/エミュレーターの前提条件を1ステップでインストールします： tapflow setup リレー専用サーバー (Linux) ではこれをスキップしてください。詳細は環境設定を参照してください。 3. リレー + エージェントを起動 tapflow start # ✓ Relay started on http://localhost:4000 # ✓ iOS Agent connected (3 simulators available) これは同じMacでリレーとエージェントの両方を起動します (ローカルモード)。 4. 最初の管理者アカウントを作成 ブラウザで http://localhost:4000 を開きます。tapflowは管理者アカウントを作成するために /setup にリダイレクトします。ヘッドレスサーバーですか？代わりにCLI経由で管理者アカウントを作成するには tapflow admin init を使用してください。 5. ダッシュボードを開く http://localhost:4000 にアクセスし、先ほど作成したアカウントでサインインします。 問題がありますか？いつでも tapflow doctor を実行して前提条件を再確認してください。 要件 コンポーネント | 要件 ---|--- リレーサーバー | Node.js ≥ 20, 任意のOS (Linux/macOS), 約512 MB RAM iOSエージェント | macOS, Xcode + iOSシミュレーターランタイム (または `tapflow setup ios` を実行), Node.js ≥ 20 Androidエージェント | macOS, Java + Android SDKとAVD (または `tapflow setup android` を実行), Node.js ≥ 20 ブラウザ (QA) | 最新のブラウザ — Chrome, Firefox, Safari, Edge エージェントはmacOSでのみ動作します (Mac上でiOSシミュレーターとAndroidエミュレーターを駆動するため)。リレーはどこでも動作します。 機能 QAユーザーにモバイルツールチェーンは不要 — チームメイトはXcode、Android Studio、ローカルシミュレーターツールをインストールすることなくブラウザからテストできます。 デフォルトでセルフホスト型 — アプリビルド、デバイスストリーム、録画、アカウントデータはあなたが管理するインフラ上に残り、サードパーティサービスには送信されません。 既存のMac設定を利用 — iOSシミュレーターまたはAndroidエミュレーターが既に利用可能なMac上でエージェントを実行します。 APIファースト — RESTエンドポイントとパーソナルアクセストークンはCI/CDおよびAIエージェントワークフローをサポートします。 含まれるもの： ブラウザストリーミング — iOSとAndroidで約30 fps、デバイスに追加アプリは不要。両方ともH.264を2層デコーダー (セキュアコンテキストではWebCodecs、プレーンHTTPではWASM/tinyh264) を介してストリームし、デコードパスからメディアエレメントバッファを削除します。解像度は接続に合わせて適応します — セキュアコンテキストではネイティブ、プレーンHTTP LANではダウンスケール。1 コーデックフォールバック — ストリームはクライアントごとにコーデックをネゴシエートし、ハードウェアまたはWASMデコーダーが利用できない場合はJPEGにフォールバックするため、古いブラウザでも動作します。 タッチ、スワイプ、ピンチ — シミュレーターまたはエミュレーターにリアルタイムで入力が転送されます。 ディープリンクツールバー — サポートされているディープリンクをQAツールバーから直接開けます。 キーボードショートカット — キーボードからシミュレーターツールバーアクションをトリガーします。 App Center — .app.zip / .apk をアップロードし、ステータス (バックログ / 進行中 / 完了 / 却下) でビルドを追跡します。 セッション録画 — QAセッションを録画して共有できます。リレーに約72時間保持され、その後自動的にパージされます。 スクリーンショットRESTエンドポイント — CIおよびAIエージェント向けの GET /api/v1/sessions/:sessionId/screenshot。 Macリソース監視 — エージェントごとのCPUとRAMを監視し、セッション割り当て前に過負荷のホストを特定します。 チーム管理 — 招待リンク、ロール (管理者 / 開発者 / QA / ビューアー)、パーソナルアクセストークン。 MCPサーバー (実験的) — @tapflowio/mcp-serverは、Claude CodeなどのLLMエージェントがシミュレーターをネイティブツールとして制御できるようにします。 1 実際のLANでは、デコードから表示までの時間は数ミリ秒台 (WASMソフトウェアデコーダーでp50約11～17 ms、HTTPS上のWebCodecsではさらに高速) で測定されます。エンドツーエンドの「ガラスからガラス」までのレイテンシは、ネットワークのラウンドトリップが追加されます。完全な測定、条件、既知の制限については、パフォーマンスとレイテンシの参照を参照してください。 セキュリティとプライバシー tapflowは設計上セルフホスト型です — ビルドファイル、デバイスストリーム、セッション録画はあなたが管理するインフラ上に保持され、サードパーティサービスには決して送信されません。 データ | 保持場所 ---|--- アプリバイナリ (.app.zip / .apk) | リレーのストレージ デバイスストリーム (ビデオ · タッチ) | あなたがホストするリレー ↔ ブラウザのパス セッション録画 | リレーのストレージ; 72時間後に期限切れとなり、その後パージされます アカウントとチームデータ | リレーのSQLite DB サードパーティのシミュレータークラウド | 不要 LANファースト — エージェント ↔ リレー間の通信は内部トラフィックです。デバイスストリームはサードパーティを経由しません。 オフホストではデフォルトで認証済み — リレーは自身のマシン (localhost) からの非認証接続のみを受け入れます。他の場所からアクセスするブラウザはサインインし、別のマシンのエージェントはエージェントスコープトークンを提示します。 PAT + ロール — パーソナルアクセストークンはスコープ (CIアップロード用のbuilds:write、リモートエージェント用のagent) を持ち、チームロール (管理者 / 開発者 / QA / ビューアー) はダッシュボードアクセスを管理します。 脆弱性を発見しましたか？SECURITY.md を参照してください。完全なモデルについては、セキュリティとプライバシーをお読みください。 セルフホスティング ローカル (単一Mac) リレーとエージェントが同じマシン上にある — 単一の開発者または小規模チームに最適です。 tapflow start チーム (独立したリレーサーバー) Linuxサーバーまたは専用Macでリレーを実行します。シミュレーターを持つ各Macがエージェントを実行します。 リレーサーバー: # 推奨: 自動再起動のためのPM2 npm install -g pm2 tapflow JWT_SECRET=$(openssl rand -hex 32) pm start tapflow --name relay -- relay start pm save && pm2 startup 各Macエージェント: tapflow agent start --relay wss://your-relay-url --token <agen