Neu in WebGPU (Chrome 113)

François Beaufort
François Beaufort
GitHub

Nach jahrelanger Entwicklung gibt das Chrome-Team bekannt, dass die erste Version von WebGPU jetzt standardmäßig in Chrome unter ChromeOS, macOS und Windows verfügbar ist. Weitere Informationen finden Sie in der Einführung in Chrome WebGPU.

Wir haben auch damit begonnen, eine umfassende Dokumentation für WebGPU im MDN hinzuzufügen.

Und das war noch nicht alles.

WebCodecs-VideoFrame-Quelle in importExternalTexture() verwenden

WebGPU stellt eine API bereit, um undurchsichtige externe Texturobjekte von HTMLVideoElement bis importExternalTexture() zu erstellen. Mithilfe dieser Objekte kannst du die Videoframes effizient und möglicherweise ohne Kopie direkt aus den YUV-Quelldaten abfragen.

Die ursprüngliche WebGPU-Spezifikation lässt jedoch das Erstellen von GPUExternalTexture-Objekten aus WebCodecs-VideoFrame-Objekten nicht zu. Diese Funktion ist wichtig für fortgeschrittene Anwendungen zur Videoverarbeitung, die bereits WebCodecs verwenden und WebGPU in die Videoverarbeitungspipeline integrieren möchten. Wir besprechen derzeit das Problem gpuweb/gpuweb#1380.

Feature aktivieren

Standardmäßig ist diese Funktion in Chrome nicht aktiviert. Sie können sie aber in Chrome 113 ausprobieren, indem Sie sie explizit aktivieren. Sie können es lokal aktivieren, indem Sie das Flag „WebGPU Developer Features“ auf chrome://flags/#enable-webgpu-developer-features aktivieren.

Um sie für alle Nutzer Ihrer App zu aktivieren, läuft derzeit ein Ursprungstest und endet in Chrome 118 (8. Dezember 2023). Wenn Sie am Test teilnehmen möchten, registrieren Sie sich und fügen Sie ein Meta-Element mit dem Ursprungstesttoken entweder im HTML- oder im HTTP-Header ein. Weitere Informationen finden Sie im Beitrag Erste Schritte mit Ursprungstests.

Beispielcode

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

Sehen Sie sich das experimentelle Beispiel Video Uploading with WebCodecs an, um damit zu experimentieren.

Neu bei WebGPU

Hier finden Sie eine Liste aller Inhalte, die in der Reihe What's New in WebGPU behandelt wurden.

Chrome 124

Chrome 123

Chrome 122

Chrome 121

Chrome 120

Chrome 119

Chrome 118

Chrome 117

Chrome 116

Chrome 115

Chrome 114

Chrome 113