Nieuw in WebGPU (Chrome 131)

François Beaufort
François Beaufort
GitHub

Afstand tot fragment in WGSL

Met knipafstanden kunt u het knipvolume van primitieven beperken met door de gebruiker gedefinieerde halve ruimten in de uitvoer van de hoekpuntfase. Als je je eigen knipvlakken definieert, heb je meer controle over wat zichtbaar is in je WebGPU-scènes. Deze techniek is vooral handig voor apps zoals CAD-software, waarbij nauwkeurige controle over visualisatie cruciaal is.

Als de "clip-distances"-functie beschikbaar is in een GPUAdapter, vraag je een GPUDevice met deze functie aan om ondersteuning voor knipafstanden in WGSL te krijgen en zet je deze extensie expliciet aan in je WGSL-code met enable clip_distances;. Als dit aanstaat, kunt u de clip_distancesingebouwde matrix in uw hoekpuntshader gebruiken. Deze array bevat afstanden tot een door de gebruiker gedefinieerd knipvlak:

  • Een knipafstand van 0 betekent dat het hoekpunt op het vlak ligt.
  • Een positieve afstand betekent dat het hoekpunt zich in de halve ruimte van het knipgebied bevindt (de kant die je wilt behouden).
  • Een negatieve afstand betekent dat het hoekpunt zich buiten de halve ruimte van het knipbereik bevindt (de kant die je wilt verwijderen).

Raadpleeg het volgende fragment, het chromestatus-item en issue 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()

Nadat GPUCanvasContext configure() is aangeroepen met een configuratiewoordenboek, kun je met de methode GPUCanvasContext getConfiguration() de configuratie van het canvascontext controleren. Het bevat device, format, usage, viewFormats, colorSpace, toneMapping en alphaMode leden. Dit is handig voor taken zoals controleren of de browser HDR-canvas ondersteunt, zoals getoond in het voorbeeld Particles (HDR). Raadpleeg het volgende fragment, het chromestatus-item en issue 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.
}

Primitieven voor punten en lijnen mogen geen dieptebias hebben

Zoals eerder aangekondigd, is het volgens de WebGPU-specificatie nu een validatiefout om depthBias, depthBiasSlopeScale en depthBiasClamp in te stellen op een waarde die niet nul is als de topologie voor een weergavepijplijn een lijn- of punttype is. Ga naar probleem 352567424.

Inclusief scannen van ingebouwde functies voor subgroepen

Als onderdeel van het experiment met subgroepen zijn de volgende ingebouwde functies voor subgroepen toegevoegd in issue 361330160:

  • subgroupInclusiveAdd(value): Retourneert de inclusieve scansom van alle actieve aanroepen value in de subgroep.
  • subgroupInclusiveMul(value): Retourneert de inclusieve scanvermenigvuldiging van alle actieve aanroepen value's in de subgroep.

Experimentele ondersteuning voor indirect tekenen met meerdere tekeningen

Met de functie voor indirecte GPU met meerdere tekeningen kun je meerdere tekenaanroepen uitvoeren met één GPU-opdracht. Dit is vooral handig in situaties waarin een groot aantal objecten moet worden gerenderd, zoals deeltjessystemen, instanties en grote scènes. De methoden drawIndirect() en drawIndexedIndirect() van GPURenderPassEncoder kunnen maar één tekenaanroep tegelijk uitvoeren vanuit een bepaald gedeelte van een GPU-buffer.

Totdat deze experimentele functie is gestandaardiseerd, zet je de vlag 'Unsafe WebGPU Support' aan op chrome://flags/#enable-unsafe-webgpu om de functie beschikbaar te maken in Chrome.

Vraag met de niet-standaard GPU-functie "chromium-experimental-multi-draw-indirect" die beschikbaar is in een GPUAdapter een GPUDevice aan met deze functie. Maak daarna een GPUBuffer met het gebruik GPUBufferUsage.INDIRECT om de tekenaanroepen op te slaan. Je kunt deze later gebruiken in de nieuwe methoden multiDrawIndirect() en multiDrawIndexedIndirect() GPURenderPassEncoder om tekenaanroepen uit te geven binnen een weergave-pass. Ga naar het volgende fragment en probleem 356461286.

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();

Compilatieoptie voor shadermodule strict math

Er is een booleaanse strictMath ontwikkelaarsoptie toegevoegd aan GPUShaderModuleDescriptor waarmee je strikte wiskunde kunt aan- of uitzetten tijdens de compilatie van de shadermodule. De functie is beschikbaar achter de vlag WebGPU Developer Features op chrome://flags/#enable-webgpu-developer-features. Dit betekent dat het een functie is die alleen bedoeld is voor gebruik tijdens de ontwikkeling. Ga naar probleem 42241455.

Deze optie wordt op dit moment ondersteund in Metal en Direct3D. Als strikte wiskunde uitstaat, kan de compiler je shaders optimaliseren door:

  • De mogelijkheid van NaN- en Infinity-waarden wordt genegeerd.
  • -0 wordt behandeld als +0.
  • Deling vervangen door snellere vermenigvuldiging met de reciproke.
  • Bewerkingen opnieuw rangschikken op basis van associatieve en distributieve eigenschappen.
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 });

GPUAdapter requestAdapterInfo() verwijderen

De asynchrone methode requestAdapterInfo() van GPUAdapter is overbodig, omdat je GPUAdapterInfo al synchroon kunt ophalen met het kenmerk info van GPUAdapter. Daarom is de niet-standaard GPUAdapter-methode requestAdapterInfo() nu verwijderd. Ga naar de intentie tot verwijdering.

Updates voor Dawn

De uitvoerbare tint_benchmark meet de kosten van het vertalen van shaders van WGSL naar elke backend-taal. Neem de nieuwe documentatie door voor meer informatie.

Dit zijn maar enkele van de belangrijkste punten. Neem de uitgebreide lijst met doorvoeringen door.

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