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

François Beaufort
François Beaufort
GitHub

經過多年的開發，Chrome 團隊宣布，ChromeOS、macOS 和 Windows 上的 Chrome 現在預設提供 WebGPU 的第一個版本。詳情請參閱「Chrome ships WebGPU」。

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

還有更多實用功能。

在「importExternalTexture()」中使用 WebCodecs VideoFrame 來源

WebGPU 會公開 API，以便從 HTMLVideoElement 透過 importExternalTexture() 建立不透明的「外部紋理」物件。您可以運用這些物件有效率地取樣影片影格，直接從來源 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 155-156

Chrome 153-154

Chrome 151-152

Chrome 149-150

Chrome 147-148

Chrome 146

Chrome 145

Chrome 144

Chrome 143

Chrome 142

Chrome 141

Chrome 140

Chrome 139

Chrome 138

Chrome 137

Chrome 136

Chrome 135

Chrome 134

Chrome 133

Chrome 132

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