Neuerungen bei der WebGPU (Chrome 131)

François Beaufort
François Beaufort
GitHub

Entfernungen in WGSL begrenzen

Mit Clip-Distanzen können Sie das Clip-Volume von Primitives mit benutzerdefinierten Halbräumen in der Ausgabe der Vertex-Phase einschränken. Wenn Sie eigene Clipping-Ebenen definieren, haben Sie mehr Kontrolle darüber, was in Ihren WebGPU-Szenen sichtbar ist. Diese Technik ist besonders nützlich für Anwendungen wie CAD-Software, bei denen eine präzise Steuerung der Visualisierung entscheidend ist.

Wenn die Funktion "clip-distances" in einem GPUAdapter verfügbar ist, fordern Sie ein GPUDevice mit dieser Funktion an, um die Unterstützung von Clip-Entfernungen in WGSL zu erhalten, und aktivieren Sie diese Erweiterung explizit in Ihrem WGSL-Code mit enable clip_distances;. Nach der Aktivierung können Sie das integrierte clip_distances-Array in Ihrem Vertex-Shader verwenden. Dieses Array enthält Entfernungen zu einer benutzerdefinierten Clipping-Ebene:

  • Ein Clip-Abstand von 0 bedeutet, dass der Vertex auf der Ebene liegt.
  • Ein positiver Abstand bedeutet, dass sich der Knotenpunkt im Halbraum des Clips befindet (der Seite, die Sie behalten möchten).
  • Ein negativer Abstand bedeutet, dass sich der Knotenpunkt außerhalb des Halbraums befindet, der abgeschnitten werden soll.

Weitere Informationen finden Sie im folgenden Snippet, im chromestatus-Eintrag und in Problem 358408571.

const adapter = await navigator.gpu.requestAdapter();
if (!adapter.features.has("clip-distances")) {
  throw new Error("Clip distances support is not available");
}
// Explicitly request clip distances support.
const device = await adapter.requestDevice({
  requiredFeatures: ["clip-distances"],
});

const vertexShaderModule = device.createShaderModule({ code: `
  enable clip_distances;

  struct VertexOut {
    @builtin(clip_distances) my_clip_distances : array<f32, 1>,
    @builtin(position) my_position : vec4f,
  }
  @vertex fn main() -> VertexOut {
    var output : VertexOut;
    output.my_clip_distances[0] = 1;
    output.my_position = vec4f(0, 0, 0, 1);
    return output;
  }
`,
});

// Send the appropriate commands to the GPU...

GPUCanvasContext.getConfiguration()

Nachdem GPUCanvasContext configure() mit einem Konfigurations-Dictionary aufgerufen wurde, können Sie mit der GPUCanvasContext-Methode getConfiguration() die Canvas-Kontextkonfiguration prüfen. Dazu gehören device-, format-, usage-, viewFormats-, colorSpace-, toneMapping- und alphaMode-Mitglieder. Das ist nützlich für Aufgaben wie das Prüfen, ob der Browser HDR-Canvas unterstützt, wie im Beispiel für Partikel (HDR) gezeigt. Weitere Informationen finden Sie im folgenden Snippet, im ChromeStatus-Eintrag und in Problem 370109829.

const adapter = await navigator.gpu.requestAdapter();
const device = await adapter.requestDevice();

const canvas = document.querySelector("canvas");
const context = canvas.getContext("webgpu");

// Configure the canvas for HDR.
context.configure({
  device,
  format: "rgba16float",
  toneMapping: { mode: "extended" },
});

const configuration = context.getConfiguration();
if (configuration.toneMapping.mode === "extended") {
  // The browser supports HDR canvas.
  // Warning! The user still needs a HDR display to enjoy HDR content.
}

Punkt- und Linien-Grundtypen dürfen keinen Tiefen-Bias haben

Wie bereits angekündigt, ist es in der WebGPU-Spezifikation jetzt ein Validierungsfehler, depthBias, depthBiasSlopeScale und depthBiasClamp auf einen Wert ungleich null zu setzen, wenn die Topologie für eine Renderpipeline ein Linien- oder Punkttyp ist. Weitere Informationen finden Sie unter Problem 352567424.

Integrierte Funktionen für inklusive Scans für Untergruppen

Im Rahmen der Untergruppen-Tests wurden die folgenden integrierten Funktionen für Untergruppen in Problem 361330160 hinzugefügt:

  • subgroupInclusiveAdd(value): Gibt die inklusive Scan-Summierung aller aktiven Aufrufe values in der Untergruppe zurück.
  • subgroupInclusiveMul(value): Gibt das inklusive Scanprodukt aller aktiven Aufrufe values in der Untergruppe zurück.

Experimentelle Unterstützung für Multi-Draw-Indirect

Mit der GPU-Funktion „Multi-Draw Indirect“ können Sie mehrere Zeichenaufrufe mit einem einzigen GPU-Befehl ausgeben. Das ist besonders nützlich, wenn eine große Anzahl von Objekten gerendert werden muss, z. B. bei Partikelsystemen, Instanziierung und großen Szenen. Mit den drawIndirect()- und drawIndexedIndirect()-Methoden von GPURenderPassEncoder kann jeweils nur ein Draw-Aufruf aus einem bestimmten Bereich eines GPU-Puffers ausgegeben werden.

Bis diese experimentelle Funktion standardisiert ist, müssen Sie das Flag „Unsafe WebGPU Support“ unter chrome://flags/#enable-unsafe-webgpu aktivieren, damit sie in Chrome verfügbar ist.

Fordern Sie mit der nicht standardmäßigen GPU-Funktion "chromium-experimental-multi-draw-indirect", die in einem GPUAdapter verfügbar ist, ein GPUDevice mit dieser Funktion an. Erstellen Sie dann einen GPUBuffer mit der GPUBufferUsage.INDIRECT-Verwendung, um die Zeichenaufrufe zu speichern. Sie können sie später in den neuen multiDrawIndirect()- und multiDrawIndexedIndirect()-GPURenderPassEncoder-Methoden verwenden, um Draw-Aufrufe innerhalb eines Render-Passes auszugeben. Sehen Sie sich das folgende Snippet und Problem 356461286 an.

const adapter = await navigator.gpu.requestAdapter();
if (!adapter.features.has("chromium-experimental-multi-draw-indirect")) {
  throw new Error("Experimental multi-draw indirect support is not available");
}
// Explicitly request experimental multi-draw indirect support.
const device = await adapter.requestDevice({
  requiredFeatures: ["chromium-experimental-multi-draw-indirect"],
});

// Draw call have vertexCount, instanceCount, firstVertex, and firstInstance parameters.
const drawData = new Uint32Array([
  3, 1, 0, 0, // First draw call
  3, 1, 3, 0, // Second draw call
]);
// Create a buffer to store the draw calls.
const drawBuffer = device.createBuffer({
  size: drawData.byteLength,
  usage: GPUBufferUsage.INDIRECT | GPUBufferUsage.COPY_DST,
});
device.queue.writeBuffer(drawBuffer, 0, drawData);

// Create a render pipeline, a vertex buffer, and a render pass encoder...

// Inside a render pass, issue the draw calls.
myPassEncoder.setPipeline(myPipeline);
myPassEncoder.setVertexBuffer(0, myVertexBuffer);
myPassEncoder.multiDrawIndirect(drawBuffer, /*offset=*/ 0, /*maxDrawCount=*/ 2);
myPassEncoder.end();

Kompilierungsoption für Shadermodule „strict math“

Dem GPUShaderModuleDescriptor wurde eine boolesche strictMath-Entwickleroption hinzugefügt, mit der Sie die strikte Mathematik während der Shader-Modul-Kompilierung aktivieren oder deaktivieren können. Sie ist hinter dem Flag „WebGPU Developer Features“ unter chrome://flags/#enable-webgpu-developer-features verfügbar. Das bedeutet, dass sie nur für die Entwicklung vorgesehen ist. Weitere Informationen finden Sie unter Problem 42241455.

Diese Option wird derzeit für Metal und Direct3D unterstützt. Wenn „Strikte Mathematik“ deaktiviert ist, kann der Compiler Ihre Shader optimieren, indem er:

  • Die Möglichkeit von NaN- und Unendlich-Werten wird ignoriert.
  • Behandlung von -0 als +0.
  • Ersetzen der Division durch eine schnellere Multiplikation mit dem Kehrwert.
  • Vorgänge basierend auf assoziativen und distributiven Eigenschaften neu anordnen.
const adapter = await navigator.gpu.requestAdapter();
const device = await adapter.requestDevice();

const code = `
  // Examines the bit pattern of the floating-point number to
  // determine if it represents a NaN according to the IEEE 754 standard.
  fn isNan(x : f32) -> bool {
    bool ones_exp = (bitcast<u32>(x) & 0x7f8) == 0x7f8;
    bool non_zero_sig = (bitcast<u32>(x) & 0x7ffff) != 0;
    return ones_exp && non_zero_sig;
  }
  // ...
`;

// Enable strict math during shader compilation.
const shaderModule = device.createShaderModule({ code, strictMath: true });

Entfernung von „GPUAdapter.requestAdapterInfo()“

Die asynchrone Methode „requestAdapterInfo()“ von GPUAdapter ist redundant, da Sie GPUAdapterInfo bereits synchron über das GPUAdapter-Attribut „info“ abrufen können. Daher wurde die nicht standardmäßige GPUAdapter-Methode „requestAdapterInfo()“ entfernt. Weitere Informationen finden Sie unter Absicht zum Entfernen.

Änderungen bei Dawn

Mit dem ausführbaren tint_benchmark werden die Kosten für die Übersetzung von Shadern von WGSL in die jeweilige Backend-Sprache gemessen. Weitere Informationen

Dies sind nur einige der wichtigsten Highlights. Vollständige Liste der Commits

Neu bei WebGPU

Eine Liste aller Themen, die in der Reihe Neu in WebGPU behandelt wurden.

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