What's WebGPU 新功能 (Chrome 113 版)

François Beaufort
François Beaufort

經過多年的開發,Chrome 團隊宣布,ChromeOS、macOS 和 Windows 上的 Chrome 已預設使用第一個版本的 WebGPU。詳情請參閱 Chrome 提供的 WebGPU

我們也開始在 MDN 新增完整的 WebGPU 說明文件

還有更多其他功能

importExternalTexture() 中使用 WebCodecs VideoFrame 來源

WebGPU 提供 API 來建立不透明的「外部紋理」物件HTMLVideoElementimportExternalTexture()您可以使用這些物件,有效率地對影片影格取樣,並可能直接從來源 YUV 資料執行零複製作業。

不過,初始 WebGPU 規格不允許從 WebCodecs VideoFrame 物件建立 GPUExternalTexture 物件。這項功能對於已經使用 WebCodecs 的進階影片處理應用程式非常重要,並希望在影片處理管道中整合 WebGPU。討論正在進行 gpuweb/gpuweb#1380 問題。

啟用這項功能

根據預設,Chrome 不會啟用這項功能,但您可以在 Chrome 113 中明確啟用此功能,進行實驗。如要在本機啟用,請啟用「WebGPU 開發人員功能」flag (位於 chrome://flags/#enable-webgpu-developer-features)。

如要為應用程式的所有訪客啟用這項功能,來源試用目前正在進行中,並將於 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 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