WebGPU is the new API for compute and graphics on the Web. It's developed by the GPU for the Web community group at W3C.

Architecture

TODO

Presentation

Content side

CanvasContext creates a new wr::ExternalImageId. It then sends a DeviceCreateSwapChain message to the GPU process to associate this external image with the swapchain ID (via Device::InitSwapChain). It also provides the size/format of the swapchain, and generates the buffer IDs for reading back the data.

There is a Texture object created with matching dimensions. It's communicated with the other pieces via WebRenderLocalCanvasData.

The nsDisplayCanvas::CreateWebRenderCommands, which runs on a display list build, checks if the image key exists and matches the display list. Otherwise, it creates a new key and associates it with the external image via AddPrivateExternalImage. It then pushes the image ID into the display list.

The info about the swapchain is put into WebRenderLocalCanvasData, which can be accessed by CreateOrRecycleWebRenderUserData. Part of that logic is done in UpdateWebRenderLocalCanvasData, and another part is at the end of the CanvasContextType::WebGPU case. Finally, we send the SwapChainPresent message to the GPU.

GPU side

There is mCanvasMap - a map of "external Id" to associated PresentationData. It contains the device, the queue, and the pool of buffers used to read back the data.

On RecvDeviceCreateSwapChain, the new PresentationData is created and associated with the external ID. We also create a MemoryTextureHost object associated with this external ID.

On RecvSwapChainPresent, we find an available buffer to read the data into, or create it. We then record a new command buffer to read back the data into this buffer, and submit it right away. Finally, we request the buffer for mapping, specifying PresentCallback.

The callback just copies the data (from the mapped buffer) into the MemoryTextureHost storage. When WebRender builds a frame, it gets TextureUpdateSource::External update, which is resolved by locking the external texture handler in upload_to_texture_cache, and getting the ExternalImageSource::RawData for the data we read back from wgpu.

Links

Bug tracking

Graphics: WebGPU component: Open bugs only | All bugs

"webgpu-mvp" meta-bug dependencies

Implementation Status

Demos:

• hello-webgpu-compute

General information:

• API Specification
• Introduction to WebGPU (Berlin All Hands)