Nouveautés de WebGPU (Chrome 131)

François Beaufort
François Beaufort

Distances de coupure en WGSL

Les distances de découpe vous permettent de limiter le volume de découpe des primitives avec des demi-espaces définis par l'utilisateur dans la sortie de l'étape de vertex. Définir vos propres plans de découpe vous permet de mieux contrôler ce qui est visible dans vos scènes WebGPU. Cette technique est particulièrement utile pour les applications telles que les logiciels de CAO, où un contrôle précis de la visualisation est crucial.

Lorsque la fonctionnalité "clip-distances" est disponible dans un GPUAdapter, demandez un GPUDevice avec cette fonctionnalité pour obtenir la prise en charge des distances de coupure dans WGSL, puis activez explicitement cette extension dans votre code WGSL avec enable clip_distances;. Une fois activé, vous pouvez utiliser le tableau intégré clip_distances dans votre nuanceur de sommet. Ce tableau contient les distances à un plan de coupe défini par l'utilisateur:

  • Une distance de découpe de 0 signifie que le sommet se trouve sur le plan.
  • Une distance positive signifie que le sommet se trouve dans la demi-espace de l'extrait (côté que vous souhaitez conserver).
  • Une distance négative signifie que le sommet se trouve en dehors de la demi-espace de découpe (côté que vous souhaitez supprimer).

Consultez l'extrait de code suivant, l'entrée chromestatus et l'problème 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()

Une fois que GPUCanvasContext configure() a été appelé avec un dictionnaire de configuration, la méthode GPUCanvasContext getConfiguration() vous permet de vérifier la configuration du contexte de canevas. Il inclut les membres device, format, usage, viewFormats, colorSpace, toneMapping et alphaMode. Cette fonctionnalité est utile pour vérifier si le navigateur est compatible avec le canevas HDR, comme illustré dans l'exemple de particules (HDR). Consultez l'extrait de code suivant, l'entrée chromestatus et l'problème 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.
}

Les primitives de point et de ligne ne doivent pas comporter de biais de profondeur

Comme annoncé précédemment, la spécification WebGPU génère désormais une erreur de validation si vous définissez depthBias, depthBiasSlopeScale et depthBiasClamp sur une valeur non nulle lorsque la topologie d'un pipeline de rendu est un type de ligne ou de point. Consultez le problème 352567424.

Fonctions intégrées d'analyse inclusive pour les sous-groupes

Dans le cadre de l'expérimentation des sous-groupes, les fonctions intégrées de sous-groupe suivantes ont été ajoutées dans l'issue 361330160:

  • subgroupInclusiveAdd(value): renvoie la somme de l'analyse inclusive de toutes les value d'appels actifs dans le sous-groupe.
  • subgroupInclusiveMul(value): renvoie la multiplication de l'analyse inclusive de toutes les value d'appels actifs dans le sous-groupe.

Prise en charge expérimentale de la multi-dessin indirect

La fonctionnalité de GPU indirect multi-dessin vous permet d'émettre plusieurs appels de dessin avec une seule commande de GPU. Cela est particulièrement utile lorsque de nombreux objets doivent être affichés, comme dans les systèmes de particules, l'instanciation et les scènes de grande envergure. Les méthodes GPURenderPassEncoder drawIndirect() et drawIndexedIndirect() ne peuvent émettre qu'un seul appel de dessin à la fois à partir d'une certaine région d'un tampon GPU.

Tant que cette fonctionnalité expérimentale n'est pas normalisée, activez l'indicateur "Unsafe WebGPU Support" (Compatibilité avec WebGPU non sécurisé) à chrome://flags/#enable-unsafe-webgpu pour la rendre disponible dans Chrome.

Avec la fonctionnalité de GPU non standard "chromium-experimental-multi-draw-indirect" disponible dans un GPUAdapter, demandez un GPUDevice avec cette fonctionnalité. Créez ensuite un GPUBuffer avec l'utilisation GPUBufferUsage.INDIRECT pour stocker les appels de dessin. Vous pourrez l'utiliser plus tard dans les nouvelles méthodes GPURenderPassEncoder multiDrawIndirect() et multiDrawIndexedIndirect() pour émettre des appels de dessin dans une passe de rendu. Consultez l'extrait suivant et l'problème 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();

Option de compilation du module de nuanceur : mathématiques strictes

Une option de développement booléenne strictMath a été ajoutée à GPUShaderModuleDescriptor pour vous permettre d'activer ou de désactiver les mathématiques strictes lors de la compilation du module de nuanceur. Elle est disponible derrière l'indicateur "Fonctionnalités de développement WebGPU" à chrome://flags/#enable-webgpu-developer-features, ce qui signifie qu'elle n'est destinée qu'à être utilisée en phase de développement. Consultez le problème 42241455.

Cette option est actuellement compatible avec Metal et Direct3D. Lorsque les mathématiques strictes sont désactivées, le compilateur peut optimiser vos nuanceurs en:

  • Ignorer la possibilité de valeurs NaN et Infinity.
  • Traitement de -0 comme +0.
  • Remplacement de la division par une multiplication plus rapide par le réciproque.
  • Réorganiser les opérations en fonction des propriétés associatives et distributives
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 });

Suppression de la méthode requestAdapterInfo() de GPUAdapter

La méthode asynchrone requestAdapterInfo() de GPUAdapter est redondante, car vous pouvez déjà obtenir GPUAdapterInfo de manière synchrone à l'aide de l'attribut info de GPUAdapter. Par conséquent, la méthode requestAdapterInfo() non standard de GPUAdapter est désormais supprimée. Consultez l'intention de suppression.

Informations Dawn

L'exécutable tint_benchmark mesure le coût de la traduction des nuanceurs de WGSL vers chaque langage de backend. Pour en savoir plus, consultez la nouvelle documentation.

Il ne s'agit là que de quelques-uns des points clés. Consultez la liste exhaustive des commits.

Nouveautés de WebGPU

Liste de tous les éléments abordés dans la série Nouveautés de WebGPU.

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