Deze pagina is vertaald door de Cloud Translation API.

Wat is er nieuw in WebGPU (Chrome 113)

François Beaufort

Na jaren van ontwikkeling kondigt het Chrome-team aan dat de eerste versie van WebGPU nu standaard beschikbaar is in Chrome op ChromeOS, macOS en Windows. Bekijk Chrome levert WebGPU voor meer informatie.

We zijn ook begonnen met het toevoegen van uitgebreide documentatie voor WebGPU op MDN.

En er is nog meer.

Gebruik WebCodecs `VideoFrame` bron in `importExternalTexture()`

WebGPU stelt een API beschikbaar om ondoorzichtige "externe textuur"-objecten te creëren van HTMLVideoElement via importExternalTexture() . U kunt deze objecten gebruiken om de videoframes efficiënt te bemonsteren, mogelijk op een 0-kopie manier, rechtstreeks vanuit de YUV-brongegevens.

De oorspronkelijke WebGPU-specificatie staat echter niet toe dat GPUExternalTexture objecten worden aangemaakt vanuit WebCodecs VideoFrame objecten. Deze mogelijkheid is belangrijk voor geavanceerde videoverwerkingstoepassingen die al WebCodecs gebruiken en WebGPU willen integreren in de videoverwerkingspijplijn. Er vindt momenteel een discussie plaats in het probleem gpuweb/gpuweb#1380 .

Schakel de functie in

Standaard is deze functie niet ingeschakeld in Chrome, maar u kunt ermee experimenteren in Chrome 113 door de functionaliteit expliciet in te schakelen. U kunt deze lokaal activeren door de vlag 'WebGPU Developer Features' in te schakelen op chrome://flags/#enable-webgpu-developer-features .

Om het voor alle bezoekers van je app mogelijk te maken, is er momenteel een proefperiode gaande. Deze loopt af in Chrome 118 (8 december 2023). Om deel te nemen aan de proefperiode, meld je je aan en voeg een meta-element met de proeftoken van Origin toe in de HTML- of HTTP-header. Raadpleeg voor meer informatie het bericht ' Aan de slag met proefperiodes van Origin' .

Voorbeeldcode

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

Bekijk het experimentele voorbeeld Video uploaden met WebCodecs om ermee te spelen.