What's New in WebGPU (Chrome 113)

After years of development, the Chrome team announces that the first release of WebGPU is now available by default in Chrome on ChromeOS, macOS, and Windows. Check out Chrome ships WebGPU to learn more.

We've also started adding comprehensive documentation for WebGPU on MDN.

And there's more.

# Use WebCodecs VideoFrame source in importExternalTexture()

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 data.

However, the initial WebGPU specification does 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. Discussion is currently happening in the gpuweb/gpuweb#1380 issue.

# Enable the feature

By default, this feature is not enabled in Chrome, but it can be experimented with in Chrome 113 by explicitly enabling the functionality. You can activate it locally by enabling the "WebGPU Developer Features" flag at chrome://flags/#enable-webgpu-developer-features.

To enable it for all visitors to your app, an origin trial is currently underway and set to end in Chrome 118 (December 8, 2023). To participate in the trial, sign up and include a meta element with the origin trial token in either the HTML or HTTP header. For more information, refer to the Get started with origin trials post.

# Sample code

// 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.

Check out the Video Uploading with WebCodecs experimental sample to play with it.

# What's New in WebGPU

A list of everything that has been covered in the What's New in WebGPU series.

# Chrome 117

• Unset vertex buffer
• Unset bind group
• Silence errors from async pipeline creation when device is lost
• SPIR-V shader module creation updates
• Improving developer experience
• Caching pipelines with automatically generated layout
• Dawn updates

# Chrome 116

• WebCodecs integration
• Lost device returned by GPUAdapter requestDevice()
• Keep video playback smooth if importExternalTexture() is called
• Spec conformance
• Improving developer experience
• Dawn updates

# Chrome 115

• Supported WGSL language extensions
• Experimental support for Direct3D 11
• Get discrete GPU by default on AC power
• Improving developer experience
• Dawn updates

# Chrome 114

• Optimizing JavaScript
• getCurrentTexture() on unconfigured canvas throws InvalidStateError
• WGSL updates
• Dawn updates

# Chrome 113

• Use WebCodecs VideoFrame source in importExternalTexture()