스크립트
00:00:00Googleが、ブラウザ上で機械学習やAIモデルを実行できる
00:00:05ネイティブに近い速度で動作する新しいランタイムライブラリ「LiteRT.js」をリリースしました。非常に素晴らしいものです。
00:00:12今回の動画では、LiteRT.jsの仕組みを確認し、実際にテストとして
00:00:18完全にブラウザ内で動作するリアルタイム3Dモーションキャプチャアプリを構築してみます。
00:00:24とても楽しみですね。それでは詳しく見ていきましょう。では、LiteRT.jsとは一体何なのでしょうか？これはJavaScriptバインディングです。
00:00:36AndroidやiOS、組み込みハードウェアで長年モデルを実行してきた
00:00:42デバイス上推論ランタイム「LiteRT」が、WebAssemblyを通じてブラウザ上で動くようになったものです。
00:00:50LiteRT.jsの中核となるnpmパッケージにより実現しました。TensorFlow.jsとは何が違うのかというと、
00:00:58Googleには以前からブラウザ向け機械学習ライブラリ「TensorFlow.js」がありましたが、
00:01:04TensorFlow.jsはJavaScriptベースのカーネルで実行されており、これが大きなボトルネックとなっていました。
00:01:11JavaScriptカーネルは、ネイティブランタイムのようにCPUやGPUをフル活用できません。そのためTensorFlow.jsは
00:01:19ネイティブアプリの性能に遅れをとっていました。しかしLiteRT.jsはWebAssemblyを使用し、最適化された独自のカーネルを搭載しています。
00:01:27AndroidやiOSでの推論を支えるネイティブランタイムがそのままWASMにコンパイルされ、
00:01:34LiteRT.jsに公開されています。つまりWeb向けの抽象化層ではなく、
00:01:40真に最適化されたランタイムエンジンが得られるのです。バックエンドアーキテクチャも優れています。LiteRT.jsは
00:01:47CPU、GPU、さらにはNPUでも高いパフォーマンスを発揮できるよう3つの階層を持っています。CPU側では、
00:01:55Googleの最適化CPUカーネルライブラリ「XNNPack」を使用しており、マルチスレッドやSIMDサポートに対応しています。
00:02:04これはGPUなしでも動作するユニバーサルなフォールバックとなります。GPUに関しては、
00:02:11WebGPU上の「ML Drift」を利用します。ここが真の性能を発揮する場所です。ネイティブGPU
00:02:18カーネルを活用するため、シェーダーなどがJavaScriptによる処理に依存しません。また
00:02:24NPU向けには、ChromeやEdgeで実験段階の「WebNN」があり、電力効率に優れた推論向けハードウェアを
00:02:31標的としています。Google自身のベンチマークによると、
00:02:37M4チップ搭載の2024年型MacBook Proにおいて、他のWebランタイムよりCPUおよびGPUで推論が3倍高速であり、
00:02:45ビジョンやオーディオモデルでその効果が見られます。物体追跡や音声文字起こし、
00:02:53画像操作といったワークロードをCPUではなくGPUやNPUで実行すると、
00:03:00タスクによっては5倍から最大60倍ものパフォーマンス向上が見られました。
00:03:07もちろんこれはベストケースのシナリオです。Googleも
00:03:13認めているように、使用するGPUや
00:03:18サーマルスロットリング、ドライバの質によって結果は異なります。このランタイムで重要な点がもう一つあります。
00:03:24PyTorchやTensorFlowで既にモデルを利用している場合、既存の
00:03:30TF Liteファイルがあれば、LiteRT.jsはそれを直接実行できます。PyTorchユーザーに対しても「LiteRT Torch」という
00:03:38モデルを直接.TF Liteに変換する経路が用意されています。さらに、AI Edge
00:03:44量子化ツールもあり、フル書き直しなしでモデルサイズを縮小できます。これまでTensorFlow.jsで使っていたレガシーなワークフローも、
00:03:50新しいLiteRT.jsに簡単に移行できるのは素晴らしいですね。では何が
00:03:58実際にできるのか？Googleは様々な素晴らしいデモを公開しており、
00:04:03可能性を実感できます。リアルタイムのYOLO物体検出、単眼深度推定などが可能です。
00:04:09「Depth Anything」ライブラリを使えば、Webカメラ映像をリアルタイム3D点群に変換できます。さらに画像
00:04:16アップスケーリングも「Real-ESRGAN」ライブラリで可能です。これらすべてのデモが完全にクライアントサイドで動作しており、
00:04:23バックエンドやAPIを必要とせず、ブラウザ内で直接実行されます。そして次の展開も発表されました。
00:04:29「LiteRT.LM.js」です。これにより、ブラウザ上で大規模言語モデルがローカル動作するようになります。
00:04:36つまりコンピュータビジョンだけでなく、ローカルでのLLM推論も可能になるのです。
00:04:42さて、素晴らしいことばかりですが、実際にどれほどパワフルなのか自分で試してみたくなりました。
00:04:48そこで今回は、Webカメラを使ったリアルタイムのポーズ推定を行う
00:04:55モーションキャプチャアプリを構築しました。完全にブラウザのクライアントサイドで、オフラインかつ
00:05:03制限なしで動作します。新しい「Fable 5」モデルを使ってCloud Code上でコーディングしました。最終結果がこちらです。
00:05:10ちなみに、このリポジトリをダウンロードして自分で試してみたい方のために、リンクを
00:05:15下の説明欄に追加しました。LiteRT.JSがブラウザ上でBlazePoseモデルを使用して、
00:05:2333個のボディランドマークを検出し、Three.jsを用いてリアルタイムで3Dキャラを動かしています。バックエンドサーバーはなく、
00:05:31すべてがこのマシン上で、完全にオフラインで処理されています。ご覧の通り、
00:05:38CPUでは推論時間23.3ミリ秒、平均38 FPS程度です。ポーズ推定が
00:05:47少し遅延しているのがわかります。しかし、WebGPUバージョンに切り替えると、
00:05:54安定して120 FPSに達し、推論時間は8.4ミリ秒になります。ポーズ推定の
00:06:02追従も速くなりました。フレームレートで約3倍、推論時間で2.8倍の改善となり、
00:06:10Googleの公開数値とおおむね一致しています（彼らの発表の中では控えめな方ですが）。BlazePoseは
00:06:16比較的小さなモデルなのでGPUの負荷はそれほど大きくありませんが、
00:06:23それでもTensorの計算をCPUからWebGPUに移すだけで、レイテンシが大幅に削減されます。
00:06:30ポーズキャプチャを記録し、JSONやBVHファイルとして書き出す機能も追加しました。
00:06:36Blenderなどで読み込み、独自のキャラクターにリターゲットすることも可能です。ご覧の通り、
00:06:44完璧とは言えません。動きはまだ粗削りですし、
00:06:49発展途上の段階です。しかし、この初期バージョンをたった10分で構築できたことは、
00:06:56新しいLiteRT.jsの凄さを物語っています。
00:07:01以上、LiteRT.jsの概要でした。WebAssemblyがブラウザでの複雑な
00:07:08アプリケーション動作の可能性をどこまで広げたか、正直驚かされます。
00:07:14この新しいLiteRT.jsライブラリは、JavaScriptが時にネイティブに近い性能への
00:07:21ボトルネックになることを証明しました。このライブラリには非常に感銘を受けており、
00:07:27今年後半の正式リリースが待ちきれません。皆さんはLiteRT.jsについてどう思いますか？試しましたか？使ってみたいですか？
00:07:35ぜひコメントで教えてください。それでは皆さん、
00:07:40このような技術解説がお好きでしたら、高評価ボタンを押して知らせていただけると嬉しいです。
00:07:45また、チャンネル登録も忘れずにお願いします。BetterStackのAndresでした。
00:07:50また次回の動画でお会いしましょう。