GPUBuffer

Limited availability

This feature is not Baseline because it does not work in some of the most widely-used browsers.

Experimentell: Dies ist eine experimentelle Technologie
Überprüfen Sie die Browser-Kompatibilitätstabelle sorgfältig vor der Verwendung auf produktiven Webseiten.

Sicherer Kontext: Diese Funktion ist nur in sicheren Kontexten (HTTPS) in einigen oder allen unterstützenden Browsern verfügbar.

Hinweis: Diese Funktion ist in Web Workers verfügbar.

Das GPUBuffer-Interface der WebGPU API repräsentiert einen Speicherblock, der zur Speicherung von Rohdaten verwendet werden kann, um GPU-Operationen auszuführen.

Eine GPUBuffer-Objektinstanz wird mit der GPUDevice.createBuffer()-Methode erstellt.

Instanzeigenschaften

label Experimentell: Ein String, der eine Bezeichnung bietet, die verwendet werden kann, um das Objekt zu identifizieren, zum Beispiel in GPUError-Meldungen oder Konsolenwarnungen.
mapState Experimentell Schreibgeschützt: Ein enumerierter Wert, der den abgebildeten Zustand des GPUBuffer darstellt.
size Experimentell Schreibgeschützt: Eine Zahl, die die Länge der Speicherzuweisung des GPUBuffer in Bytes repräsentiert.
usage Experimentell Schreibgeschützt: Die bitweisen Flags, die die zulässigen Verwendungen des GPUBuffer darstellen.

Instanzmethoden

destroy() Experimentell: Zerstört den GPUBuffer.
getMappedRange() Experimentell: Gibt einen ArrayBuffer zurück, der den abgebildeten Inhalt des GPUBuffer im angegebenen Bereich enthält.
mapAsync() Experimentell: Abbilden des angegebenen Bereichs des GPUBuffer. Gibt ein Promise zurück, das aufgelöst wird, wenn der Inhalt des GPUBuffer bereit ist, mit GPUBuffer.getMappedRange() zugegriffen zu werden.
unmap() Experimentell: Hebt die Abbildung des GPUBuffer-Bereichs auf, wodurch sein Inhalt wieder für die GPU-Nutzung verfügbar wird.

Beispiele

In unserem einfachen Berechnungs-Demo erstellen wir einen Ausgabepuffer, um GPU-Berechnungen zu lesen, und einen Staging-Puffer, der zur JavaScript-Zugriff abgebildet wird.

const output = device.createBuffer({
  size: BUFFER_SIZE,
  usage: GPUBufferUsage.STORAGE | GPUBufferUsage.COPY_SRC,
});

const stagingBuffer = device.createBuffer({
  size: BUFFER_SIZE,
  usage: GPUBufferUsage.MAP_READ | GPUBufferUsage.COPY_DST,
});

Später, sobald der stagingBuffer die Ergebnisse der GPU-Berechnung enthält, wird eine Kombination von GPUBuffer-Methoden verwendet, um die Daten zurück zu JavaScript zu lesen, damit sie dann in die Konsole protokolliert werden können:

GPUBuffer.mapAsync() wird verwendet, um den GPUBuffer zum Lesen abzubilden.
GPUBuffer.getMappedRange() wird verwendet, um einen ArrayBuffer zurückzugeben, der den Inhalt des GPUBuffer enthält.
GPUBuffer.unmap() wird verwendet, um den GPUBuffer erneut freizugeben, nachdem wir den Inhalt bei Bedarf in JavaScript eingelesen haben.

// map staging buffer to read results back to JS
await stagingBuffer.mapAsync(
  GPUMapMode.READ,
  0, // Offset
  BUFFER_SIZE, // Length
);

const copyArrayBuffer = stagingBuffer.getMappedRange(0, BUFFER_SIZE);
const data = copyArrayBuffer.slice(0);
stagingBuffer.unmap();
console.log(new Float32Array(data));

Spezifikationen

Specification
WebGPU # gpubuffer

Browser-Kompatibilität

BCD tables only load in the browser

Siehe auch

Die WebGPU API