このページは Cloud Translation API によって翻訳されました。

WebGPU の新機能（Chrome 113）

François Beaufort

数年にわたる開発の後、Chrome チームは、ChromeOS、macOS、Windows の Chrome で WebGPU の最初のリリースがデフォルトで利用可能になったことを発表しました。詳しくは、Chrome に WebGPU を搭載をご覧ください。

MDN に WebGPU の包括的なドキュメントも追加しました。

その他

`importExternalTexture()` で WebCodecs `VideoFrame` ソースを使用する

WebGPU で不透明な「外部テクスチャ」を作成する API を公開HTMLVideoElement～importExternalTexture() のオブジェクト。これらのオブジェクトを使用すると、動画フレームを効率的に（ソース YUV データから直接 0 コピーで）サンプリングできます。

ただし、最初の WebGPU 仕様では、WebCodecs の VideoFrame オブジェクトから GPUExternalTexture オブジェクトを作成することはできません。この機能は、すでに WebCodec を使用していて、動画処理パイプラインに WebGPU を統合したい高度な動画処理アプリで重要です。現在、gpuweb/gpuweb#1380 の問題について議論中です。

機能を有効にする

デフォルトでは、この機能は Chrome で有効になっていませんが、Chrome 113 では明示的に有効にすることでテストできます。[WebGPU のデベロッパー機能] を有効にすると、ローカルで有効にできます。フラグ（chrome://flags/#enable-webgpu-developer-features）を入力します。

アプリ訪問者がこの機能を利用できるようにするため、現在オリジントライアルが進行中であり、Chrome 118（2023 年 12 月 8 日）で終了する予定です。トライアルに参加するには、登録し、HTML ヘッダーまたは HTTP ヘッダーのいずれかにオリジントライアルトークンを含む meta 要素を含めます。詳しくは、オリジントライアルのスタートガイドの投稿をご覧ください。

サンプルコード

// Access the GPU device.
const adapter = await navigator.gpu.requestAdapter();
const device = await adapter.requestDevice();

// Create VideoFrame from HTMLVideoElement.
const video = document.querySelector("video");
const videoFrame = new VideoFrame(video);

const texture = device.importExternalTexture({ source: videoFrame });
// TODO: Use texture in bind group creation.

WebCodecs を使用した動画のアップロードの試験運用版のサンプルをご覧ください。