MediaPipeの画像サイズと初回・再実行の時間を測る

1. ZIPをすべて展開します。
2. index.html と app.js があるフォルダーでターミナルを開きます。
3. node --version と npm.cmd --version を確認します。Node.js未導入なら https://nodejs.org/ja/ のLTS版をインストールしてターミナルを開き直します。
4. Windows PowerShellでは npx.cmd --yes http-server . -p 8080 を実行します。macOS/Linuxでは npx --yes http-server . -p 8080 です。
5. http://localhost:8080/ をブラウザで開き、実行ボタンを押します。
6. 終了はターミナルで Ctrl+C。

HTMLを直接ダブルクリックする file:// の起動は使いません。初回はHTTPサーバー・SDK・WASM・モデルのダウンロードにインターネットが必要です。ポートが使用中なら -p 8081 と http://localhost:8081/ に揃えて変更します。
person.jpgはプロジェクト内のAI生成人物画像、cat.jpgは運営者の愛猫写真です。
コード解説は https://nekonote-tools.com/notes/mediapipe-mobile-performance/ です。入力データをアップロードする処理はありません。

使用SDK・モデルと通信について
SDK: @mediapipe/tasks-vision 0.10.34
JavaScript: https://cdn.jsdelivr.net/npm/@mediapipe/tasks-vision@0.10.34/vision_bundle.mjs
WASM: https://cdn.jsdelivr.net/npm/@mediapipe/tasks-vision@0.10.34/wasm（SDKと同じ版）
モデル（公式配布・版1）: https://storage.googleapis.com/mediapipe-models/face_detector/blaze_face_full_range/float16/1/blaze_face_full_range.tflite
公式Webガイド: https://developers.google.com/edge/mediapipe/solutions/setup_web?hl=ja
入力の推論はブラウザ内で行います。このサンプルに入力データを外部へ送信するコードはありません。SDK・WASM・モデルの取得にはCDNとGoogleへの通信が発生します。公式案内にはAPIの性能・利用状況メトリクスの送信も記載されています。
公式プライバシー案内: https://developers.google.com/edge/mediapipe/solutions/tasks?hl=ja#mediapipe_tasks_privacy_notice
画像サイズごとの推論時間を測ります。メモリ使用量の計測サンプルではありません。
版・資料の確認日: 2026年10月12日。ZIPにはSDK・WASM・モデル本体は含めず、初回に固定URLから取得します。