What's WebGPU 新功能 (Chrome 116 以上版本)

François Beaufort
François Beaufort
GitHub

WebCodecs 整合

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

不過，初始 WebGPU 規格不允許從 WebCodecs VideoFrame 物件建立 GPUExternalTexture 物件。這項功能對於已經使用 WebCodecs 的進階影片處理應用程式非常重要，並希望在影片處理管道中整合 WebGPU。WebCodecs 整合新增了使用 VideoFrame 做為 GPUExternalTexture 和 copyExternalImageToTexture() 呼叫來源的支援功能。請參考以下範例和 chromestatus 項目。

// 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);

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

請參考使用 WebCodecs 上傳影片的實驗功能範例。

GPUAdapter requestDevice() 傳回遺失的裝置

如果 GPUAdapter 上的 requestDevice() 方法已因用於建立 GPUDevice 而失敗，現在會執行立即標示為遺失的 GPUDevice，而不是傳回以 null 拒絕的承諾。請參閱問題 chromium:1234617。

const adapter = await navigator.gpu.requestAdapter();
const device1 = await adapter.requestDevice();

// New! The promise is not rejected anymore with null.
const device2 = await adapter.requestDevice();
// And the device is immediately marked as lost.
const info = await device2.lost;

如果呼叫 importExternalTexture()，則保持影片播放順暢

使用 HTMLVideoElement 呼叫 importExternalTexture() 時，當影片在可視區域中未顯示影片時，相關聯的影片播放就不會受到限制。請參閱問題 chromium:1425252。

規格符合

GPUPipelineError() 建構函式中的 message 引數為選用引數。請參閱變更 chromium:4613967。

如果 WGSL 來源 code 包含 \0，會觸發 createShaderModule() 錯誤。請參閱問題 dawn:1345。

使用 createSampler() 對紋理取樣時，系統會使用的預設最高細節層級 (lodMaxClamp) 為 32。請參閱變更 chromium:4608063。

改善開發人員體驗

開發人員工具 JavaScript 控制台會顯示訊息，提醒開發人員在不支援的平台上使用 WebGPU。請參閱變更 chromium:4589369。

如果 getMappedRange() 失敗，開發人員工具 JavaScript 控制台就會立即顯示緩衝區驗證錯誤訊息，而不必強制開發人員傳送指令至佇列。請參閱變更 chromium:4597950。

開發人員工具 JavaScript 控制台的螢幕截圖，其中顯示緩衝區驗證錯誤訊息。
開發人員工具 JavaScript 控制台中的緩衝區驗證錯誤訊息。

日出最新消息

disallow_unsafe_apis 偵錯切換鈕已重新命名為 allow_unsafe_apis，且預設為停用。這個切換按鈕會隱藏 API 進入點或尚未視為安全參數組合的驗證錯誤。偵錯功能非常實用。 請參閱問題 dawn:1685。

已移除 wgpu::ShaderModuleWGSLDescriptor 已淘汰的 source 屬性，並改用 code。請參閱變更 dawn:130321。

已實作缺少的 wgpu::RenderBundle::SetLabel() 方法。請參閱變更 dawn:134502。

應用程式透過 wgpu::RequestAdapterOptionsBackendType 選項取得轉接程式時，可以要求特定後端。請參考以下範例和問題 dawn:1875。

wgpu::RequestAdapterOptionsBackendType backendTypeOptions = {};
backendTypeOptions.backendType = wgpu::BackendType::D3D12;

wgpu::RequestAdapterOptions options = {};
options.nextInChain = &backendTypeOptions;

// Request D3D12 adapter.
myInstance.RequestAdapter(&options, myCallback, myUserData);

新增了 SwapChain::GetCurrentTexture() 方法，額外用於交換鏈紋理，以便將傳回的 wgpu::Texture 用於副本。請參考以下範例和問題 dawn:1551。

wgpu::SwapChain swapchain = myDevice.CreateSwapChain(mySurface, &myDesc);
swapchain.GetCurrentTexture();
swapchain.Present();

這只涵蓋部分重點功能。請參閱完整的修訂版本清單。

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