Nieuw in WebGPU (Chrome 113)

François Beaufort
François Beaufort
GitHub

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

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

En er is meer.

WebCodecs VideoFrame-bron gebruiken in importExternalTexture()

WebGPU biedt een API om ondoorzichtige objecten voor externe texturen te maken van HTMLVideoElement via importExternalTexture(). Je kunt deze objecten gebruiken om efficiënt samples van de videoframes te nemen, mogelijk zonder te kopiëren, rechtstreeks vanuit de YUV-brongegevens.

De eerste WebGPU-specificatie staat niet toe dat je GPUExternalTexture-objecten maakt van WebCodecs VideoFrame-objecten. Deze mogelijkheid is belangrijk voor geavanceerde apps voor videoverwerking die al WebCodecs gebruiken en WebGPU willen integreren in de pijplijn voor videoverwerking. De discussie vindt op dit moment plaats in de kwestie gpuweb/gpuweb#1380.

De functie aanzetten

Deze functie staat standaard niet aan in Chrome, maar je kunt ermee experimenteren in Chrome 113 door de functionaliteit expliciet aan te zetten. Je kunt het lokaal activeren door de flag WebGPU-functies voor ontwikkelaars aan te zetten op chrome://flags/#enable-webgpu-developer-features.

Er loopt op dit moment een origin trial om dit aan te zetten voor alle bezoekers van je app. Deze test eindigt in Chrome 118 (8 december 2023). Als je wilt deelnemen aan de origin trial, meld je je aan en voeg je een meta-element met het origin trial-token toe aan de HTML- of HTTP-header. Ga naar het bericht Aan de slag met oorsprongstests voor meer informatie.

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.

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

Wat is er nieuw in WebGPU?

Een lijst met alles wat is behandeld in de serie Nieuw in WebGPU.

Chrome 155-156

Chrome 153-154

Chrome 151-152

Chrome 149-150

Chrome 147-148

Chrome 146

Chrome 145

Chrome 144

Chrome 143

Chrome 142

Chrome 141

Chrome 140

Chrome 139

Chrome 138

Chrome 137

Chrome 136

Chrome 135

Chrome 134

Chrome 133

Chrome 132

Chrome 131

Chrome 130

Chrome 129

Chrome 128

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