此页面由 Cloud Translation API 翻译。

WebGPU 的新变化 (Chrome 113)

François Beaufort

经过多年的开发，Chrome 团队宣布，ChromeOS、macOS 和 Windows 上的 Chrome 现已默认支持 WebGPU 的第一个版本。如需了解详情，请参阅 Chrome 发布 WebGPU。

还有更多其他功能。

在 `importExternalTexture()` 中使用 WebCodecs `VideoFrame` 源代码

WebGPU 公开了一个 API，用于通过 importExternalTexture() 从 HTMLVideoElement 创建不透明的“外部纹理”对象。您可以使用这些对象高效地采样视频帧，可能直接从源 YUV 数据以 0 复制的方式进行采样。

不过，最初的 WebGPU 规范不允许通过 WebCodecs VideoFrame 对象创建 GPUExternalTexture 对象。对于已在使用 WebCodecs 且希望将 WebGPU 集成到视频处理流水线中的高级视频处理应用，此功能至关重要。目前，我们正在 gpuweb/gpuweb#1380 问题中进行讨论。

启用该功能

默认情况下，Chrome 中不会启用此功能，但您可以通过明确启用此功能，在 Chrome 113 中对其进行试用。您可以在本地启用该功能，方法是启用 chrome://flags/#enable-webgpu-developer-features 中的“WebGPU 开发者功能”标志。

为了让您的应用的所有访问者都能使用此功能，目前正在进行源试用，Chrome 118（2023 年 12 月 8 日）将结束试用。若要参与试用，请注册一个元元素，并在 HTML 或 HTTP 标头中添加带有源试用令牌的元元素。如需了解详情，请参阅开始使用源代码试用版一文。

示例代码

// 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 上传视频实验示例，试用一下。