ブラウザがGPUに直接話しかける WebGPUが主要4ブラウザに揃った

3行まとめ

• Chrome・Edge・Firefox・Safari のすべてが WebGPUGPU画像処理のために作られた演算装置。同じ計算を大量に並列でこなすのが得意です。 に対応しました
• 3D描画よりも、GPUに計算させる用途のほうが影響は大きくなります
• ブラウザの中だけでAIモデルを動かす下地が整いました

何が起きたか

WebGPU が主要ブラウザで正式に使えるようになりました。パソコンやスマホに載っている GPU を、ウェブページから直接動かすための仕組みです。

標準化を進めたのは W3C の「GPU for the Web」ワーキンググループ。Apple・Google・Intel・Microsoft・Mozilla が参加しました。

対応の内訳はブラウザごとに違います。Chrome と Edge は113から Windows・macOS・ChromeOS で使えます。Android は Chrome 121 から。

Firefox は Windows が141から。macOS Tahoe 26 の ARM64 は145からです。

Safari は macOS Tahoe 26・iOS 26・iPadOS 26・visionOS 26 で動きます。

Linux 版の Firefox や Intel 製 Mac など、作業中のプラットフォームはまだ残っています。

なぜ難しい・何がすごいか

置き換わる相手は WebGLWebGLブラウザで3D描画を行う従来の仕組み。OpenGL ES 2.0 がもとになっています。 です。2011年ごろに登場し、ブラウザで3Dを描く道を開いた仕組みでした。中身は OpenGL ES 2.0 という規格を JavaScript に移したものです。

土台の OpenGL には今後の更新予定がありません。つまり WebGL には新しい機能が入ってきません。

もうひとつは用途の偏りです。WebGL は canvas に絵を描くために設計されており、GPU に計算だけさせる使い方を苦手としていました。画面に何も描かない処理、たとえば機械学習の推論が増えたことで、この偏りが効いてきます。

WebGPU が向き合う相手は Direct3D 12・Metal・Vulkan です。2014年以降に出てきたGPU規格に、そのまま対応するよう設計されています。仕様書はこう述べています。

WebGPU は WebGL とは関係がなく、OpenGL ES を明示的な対象にしていない

たとえ話

窓口の違いで考えると見通しが立ちます。

WebGL は「絵を1枚描いてください」という注文だけを受け付ける窓口でした。メニューが決まっていて、それ以外の相談は持ち込めません。

WebGPU は工場そのものへの入館証です。何を作らせるかを自分で決められます。絵を描かせてもいいし、計算だけさせて結果を持ち帰ってもかまいません。

用語ミニ辞典

• GPU: 画像処理のために作られた演算装置。同じ計算を大量に並列でこなすのが得意です。
• WebGL: ブラウザで3D描画を行う従来の仕組み。OpenGL ES 2.0 がもとになっています。
• GPGPU: GPU を描画以外の一般的な計算に使うこと。機械学習の推論などが当てはまります。
• シェーダー: GPU の中で走る処理の本体。頂点や画素ごとに並列で実行されます。
• WGSL: WebGPU 用のシェーダー言語。GPU 上で動くプログラムをテキストで書きます。

技術者向けの深掘り

入口は navigator.gpu です。ここから adapter と論理デバイスを順に取り出します。

if (!navigator.gpu) throw Error("WebGPU not supported.");
const adapter = await navigator.gpu.requestAdapter();
const device = await adapter.requestDevice();

adapter は物理GPUとドライバに対応します。論理デバイスを挟む理由は分離です。1台のGPUは複数のウェブアプリが同時に使います。

パイプラインは2種類。render pipeline が canvas などへの描画を担当します。compute pipeline は汎用計算のためのものです。

compute shader は指定した workgroup の数だけ並列に走ります。

Render Bundles は描画コマンドの列を記録して再利用する仕組みで、CPU側の負荷を下げます。Babylon.js の Snapshot Rendering はこれを使い、シーンの描画を約10倍速くします。

実装は Chromium が Dawn、Firefox が wgpu。どちらも単独で持ち運べるライブラリです。

これは自分に関係ある？

• ウェブを見るだけの人: することはありません。重い3Dサイトやブラウザ上のAI機能が軽くなる形で効いてきます。ブラウザを新しく保つのが唯一の準備です。
• ウェブ開発者: 新規の3Dは WebGPU を前提に組める段階に入りました。ただし未対応の環境は残るので、navigator.gpu の有無で分岐し、WebGL に戻す道を残しておくと安全です。
• AIをブラウザで動かしたい人: ONNX Runtime と Transformers.js がすでに WebGPU を使っています。サーバーに送らず手元で推論する構成が、現実的な選択肢になりました。