WebGPU 的新变化 (Chrome 113)

François Beaufort
François Beaufort

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

我们还开始在 MDN 上添加有关 WebGPU 的全面文档

还有更多其他功能。

importExternalTexture() 中使用 WebCodecs VideoFrame

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

不过,最初的 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 上传视频实验示例,试用一下。

WebGPU 中的新变化

WebGPU 新变化系列中涵盖的所有内容的列表。

Chrome 131

Chrome 130

Chrome 129

Chrome 128

Chrome 127

Chrome 126

Chrome 125

Chrome 124

Chrome 123

Chrome 122

Chrome 121

Chrome 120

Chrome 119

Chrome 118

Chrome 117

Chrome 116

Chrome 115

Chrome 114

Chrome 113