WebCodecs integration
WebGPU exposes an API to create opaque “external texture” objects from HTMLVideoElement through importExternalTexture(). You can use these objects to sample the video frames efficiently, potentially in a 0-copy way directly from the source YUV color model data.
However, the initial WebGPU specification did not allow creating GPUExternalTexture objects from WebCodecs VideoFrame objects. This capability is important for advanced video processing apps that already use WebCodecs and would like to integrate WebGPU in the video processing pipeline. WebCodecs integration adds support for using a VideoFrame as the source for a GPUExternalTexture and a copyExternalImageToTexture() call. See the following example, and the chromestatus entry.
// 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.
Check out the Video Uploading with WebCodecs experimental sample to play with it.
Lost device returned by GPUAdapter requestDevice()
If the requestDevice() method on GPUAdapter fails because it has been already used to create a GPUDevice, it now fulfills with a GPUDevice immediately marked as lost, rather than returning a promise that rejects with null. See issue 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;
Keep video playback smooth if importExternalTexture() is called
When importExternalTexture() is called with an HTMLVideoElement, the associated video playback is not throttled anymore when the video is not visible in the viewport. See issue chromium:1425252.
Spec conformance
The message argument in the GPUPipelineError() constructor is optional. See change chromium:4613967.
An error is fired when calling createShaderModule() if the WGSL source code contains contains
