Nouveautés de WebGPU (Chrome 129)

François Beaufort
François Beaufort

Compatibilité HDR avec le mode de mappage des tons du canevas

Les développeurs Web ont des options limitées pour diffuser du contenu HDR, en s'appuyant principalement sur les éléments <img> et <video>. L'élément <canvas> reste toutefois limité au format SDR. Pour générer du contenu HDR dynamique dans un canevas, vous devez encoder son contenu en tant qu'image HDR avant de l'afficher (voir cette démo pour en savoir plus).

Le nouveau paramètre GPUCanvasToneMappingMode de la configuration du canevas WebGPU permet désormais à WebGPU de dessiner des couleurs plus claires que le blanc (#FFFFFF). Il le fait via les modes suivants:

  • "standard": le comportement par défaut limite le contenu à la plage SDR de l'écran. Pour ce faire, toutes les valeurs de couleur de l'espace de couleurs de l'écran sont limitées à l'intervalle [0, 1].

  • "extended": déverrouille la plage HDR complète de l'écran. Ce mode correspond à "standard" dans la plage [0, 1] de l'écran. Le forçage ou la projection est effectué sur la plage dynamique étendue de l'écran, mais pas sur [0, 1].

L'extrait de code suivant vous montre comment configurer un canevas pour la plage dynamique élevée.

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

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

context.configure({
  device,
  format: "rgba16float",
  toneMapping: { mode: "extended" },
});

Découvrez le HDR avec WebGPU en consultant l'exemple de particules (HDR) et l'exemple HDR WebGPU, et consultez l'entrée chromestatus.

Ordinateur portable avec un écran HDR affichant une image éclatante.
Échantillon "Particles" (particules) (HDR) affiché sur un écran HDR.

Prise en charge des sous-groupes étendus

Suite à l'annonce de l'expérimentation des sous-groupes, les fonctions intégrées des sous-groupes sont désormais disponibles à la fois dans les nuanceurs de calcul et les nuanceurs de fragments. Ils ne sont plus limités aux nuanceurs de calcul. Consultez le problème 354738715.

Notez que la valeur intégrée subgroup_size est actuellement buguée dans les nuanceurs de fragments. Évitez-le pour le moment.

De plus, les fonctions intégrées de sous-groupe suivantes ont été ajoutées:

  • subgroupAdd(value): renvoie la somme de toutes les value d'appels actifs dans le sous-groupe.
  • subgroupExclusiveAdd(value): renvoie la somme de l'analyse exclusive de toutes les value d'appels actifs dans le sous-groupe.
  • subgroupMul(value): renvoie la multiplication de toutes les value d'appels actifs dans le sous-groupe.
  • subgroupExclusiveMul(value): renvoie la multiplication d'analyse exclusive de toutes les value d'appels actifs dans le sous-groupe.

  • subgroupAnd(value): renvoie l'AND binaire de toutes les value d'appels actifs dans le sous-groupe.
  • subgroupOr(value): renvoie l'OU binaire de toutes les value d'appels actifs dans le sous-groupe.
  • subgroupXor(value): renvoie la XOR binaire de toutes les value d'appels actifs dans le sous-groupe.

  • subgroupMin(value): renvoie la valeur minimale de toutes les value d'appels actifs dans le sous-groupe.
  • subgroupMax(value): renvoie la valeur maximale de toutes les value d'appels actifs dans le sous-groupe.

  • subgroupAll(value): renvoie la valeur "true" si value est "true" pour toutes les invocations actives du sous-groupe.
  • subgroupAny(value): renvoie la valeur "true" si value est "true" pour toute invocation active dans le sous-groupe.

  • subgroupElect(): renvoie la valeur "true" si cet appel a le subgroup_invocation_id le plus bas parmi les appels actifs du sous-groupe.
  • subgroupBroadcastFirst(value): diffuse value à partir de l'appel actif avec le subgroup_invocation_id le plus bas du sous-groupe vers toutes les autres invocations actives.

  • subgroupShuffle(value, id): renvoie value à partir de l'appel actif dont subgroup_invocation_id correspond à id.
  • subgroupShuffleXor(value, mask): renvoie value à partir de l'appel actif dont subgroup_invocation_id correspond à subgroup_invocation_id ^ mask. mask doit être uniformément dynamique.
  • subgroupShuffleUp(value, delta): renvoie value à partir de l'appel actif dont subgroup_invocation_id correspond à subgroup_invocation_id - delta.
  • subgroupShuffleDown(value, delta): renvoie value à partir de l'appel actif dont subgroup_invocation_id correspond à subgroup_invocation_id + delta.

  • quadBroadcast(value, id): diffuse value à partir de l'appel quadruple avec un ID égal à id. id doit être une expression constante.
  • quadSwapX(value): échange value entre les invocations dans le quad dans la direction X.
  • quadSwapY(value): échange value entre les invocations dans le quad dans la direction Y.
  • quadSwapDiagonal(value): échange value entre les invocations dans le quad en diagonale.

Informations Dawn

La structure wgpu::PrimitiveState inclut désormais directement le paramètre de contrôle de la découpe de profondeur, ce qui élimine la nécessité d'une structure wgpu::PrimitiveDepthClipControl distincte. Pour en savoir plus, consultez l'extrait de code suivant et la PR webgpu-headers.

// Before
wgpu::PrimitiveState primitive = {};
wgpu::PrimitiveDepthClipControl depthClipControl;
depthClipControl.unclippedDepth = true;
primitive.nextInChain = &depthClipControl;
// Now
wgpu::PrimitiveState primitive = {};
primitive.unclippedDepth = true;

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