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 unter Die WebGPU von Chrome wird ausgeliefert.

Außerdem haben wir damit begonnen, eine umfassende Dokumentation für WebGPU auf MDN hinzuzufügen.

Und das ist noch nicht alles.

WebCodecs-Quelle VideoFrame in importExternalTexture() verwenden

WebGPU macht eine API verfügbar, um eine undurchsichtige „externe Textur“ zu erstellen Objekte von HTMLVideoElement bis importExternalTexture(). Sie können diese Objekte verwenden, um die Videoframes effizient zu stichproben, potenziell auf 0-Kopie-Weise direkt aus den YUV-Quelldaten.

Die ursprüngliche WebGPU-Spezifikation erlaubt jedoch nicht, GPUExternalTexture-Objekte aus WebCodecs-Objekten vom Typ VideoFrame zu erstellen. Diese Funktion ist wichtig für fortgeschrittene Videoverarbeitungsanwendungen, die bereits WebCodecs verwenden und WebGPU in die Videoverarbeitungspipeline integrieren möchten. Derzeit wird über das Problem gpuweb/gpuweb#1380 diskutiert.

Feature aktivieren

Diese Funktion ist in Chrome standardmäßig nicht aktiviert. Sie können sie aber in Chrome 113 testen, indem Sie sie explizit aktivieren. Sie können sie lokal aktivieren, indem Sie „WebGPU-Entwicklerfunktionen“ aktivieren flag bei chrome://flags/#enable-webgpu-developer-features.

Um sie für alle Besucher Ihrer App zu aktivieren, läuft derzeit ein Ursprungstest, der in Chrome 118 (8. Dezember 2023) endet. Registrieren Sie sich und fügen Sie ein Meta-Element mit dem Ursprungstesttoken in den HTML- oder HTTP-Header ein, um am Test teilzunehmen. 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 dazu das Testbeispiel Video-Upload mit WebCodecs an.

Das ist neu bei WebGPU

Eine Liste aller behandelten Themen der Reihe What's New in WebGPU.

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