Novidades da WebGPU (Chrome“129)

François Beaufort
François Beaufort
GitHub

Suporte a HDR com o modo de mapeamento de tons da tela

Os desenvolvedores da Web têm opções limitadas para fornecer conteúdo HDR, dependendo principalmente dos elementos <img> e <video>. No entanto, o elemento <canvas> continua restrito ao SDR. Para gerar conteúdo HDR dinâmico em uma tela, é necessário codificar o conteúdo como uma imagem HDR antes de exibi-lo. Para conferir um exemplo, consulte esta demonstração.

O novo parâmetro GPUCanvasToneMappingMode na configuração da tela da WebGPU agora permite que a WebGPU desenhe cores mais brilhantes que o branco (#FFFFFF) nos seguintes modos:

  • "standard": o comportamento padrão restringe o conteúdo ao intervalo SDR da tela. Esse modo é alcançado ao limitar todos os valores de cor no espaço de cores da tela ao intervalo [0, 1].

  • "extended": desbloqueia o intervalo HDR completo da tela. Esse modo corresponde a "standard" no intervalo [0, 1] da tela. A limitação ou projeção é feita para o intervalo dinâmico estendido da tela, mas não para [0, 1].

O snippet de código a seguir mostra como configurar uma tela para o alto alcance dinâmico.

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" },
});

Confira a amostra Particles (HDR) e o exemplo de HDR da WebGPU e a entrada chromestatus para conhecer o HDR com a WebGPU.

Um laptop com uma tela HDR mostrando uma imagem vibrante.
O exemplo de partículas (HDR) exibido em uma tela HDR.

Suporte para subgrupos expandidos

Após o anúncio da experimentação de subgrupos, as funções integradas de subgrupos agora estão disponíveis para uso em sombreadores de computação e de fragmentos. Eles não são mais restritos a shaders de computação. Consulte o problema 354738715.

O valor integrado subgroup_size está com bugs em sombreadores de fragmentos. Evite por enquanto.

Além disso, as seguintes funções integradas do subgrupo foram adicionadas:

  • subgroupAdd(value): retorna a soma de todas as invocações value ativas no subgrupo.
  • subgroupExclusiveAdd(value): retorna a soma de verificação exclusiva de todas as invocações value ativas no subgrupo.
  • subgroupMul(value): retorna a multiplicação de todas as invocações value ativas no subgrupo.
  • subgroupExclusiveMul(value): retorna a multiplicação de verificação exclusiva de todas as invocações value ativas no subgrupo.

  • subgroupAnd(value): retorna o AND binário de todas as invocações value ativas no subgrupo.
  • subgroupOr(value): retorna a OU binária de todas as invocações value ativas no subgrupo.
  • subgroupXor(value): retorna a operação XOR binária de todas as invocações value ativas no subgrupo.

  • subgroupMin(value): retorna o valor mínimo de todas as invocações value ativas no subgrupo.
  • subgroupMax(value): retorna o valor máximo de todas as invocações value ativas no subgrupo.

  • subgroupAll(value): retorna verdadeiro se value for verdadeiro para todas as invocações ativas no subgrupo.
  • subgroupAny(value): retorna verdadeiro se value for verdadeiro para qualquer invocação ativa no subgrupo.

  • subgroupElect(): retorna verdadeiro se essa invocação tiver o subgroup_invocation_id mais baixo entre as invocações ativas no subgrupo.
  • subgroupBroadcastFirst(value): transmite value da invocação ativa com o subgroup_invocation_id mais baixo no subgrupo para todas as outras invocações ativas.

  • subgroupShuffle(value, id): retorna value da invocação ativa cujo subgroup_invocation_id corresponde a id.
  • subgroupShuffleXor(value, mask): retorna value da invocação ativa cujo subgroup_invocation_id corresponde a subgroup_invocation_id ^ mask. mask precisa ser dinamicamente uniforme.
  • subgroupShuffleUp(value, delta): retorna value da invocação ativa cujo subgroup_invocation_id corresponde a subgroup_invocation_id - delta.
  • subgroupShuffleDown(value, delta): retorna value da invocação ativa cujo subgroup_invocation_id corresponde a subgroup_invocation_id + delta.

  • quadBroadcast(value, id): transmite value da invocação quad com o id igual a id. id precisa ser uma expressão constante.
  • quadSwapX(value): troca value entre invocações no quad na direção X.
  • quadSwapY(value): troca value entre invocações no quad na direção Y.
  • quadSwapDiagonal(value): troca value entre invocações no quadrante diagonalmente.

Atualizações do Dawn

A estrutura wgpu::PrimitiveState agora inclui diretamente a configuração de controle de recorte de profundidade, eliminando a necessidade de uma estrutura wgpu::PrimitiveDepthClipControl separada. Para saber mais, consulte o snippet de código a seguir e o PR webgpu-headers.

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

// Now
wgpu::PrimitiveState primitive = {};
primitive.unclippedDepth = true;

Isso abrange apenas alguns dos principais destaques. Confira a lista completa de confirmações.

Novidades na WebGPU

Uma lista de tudo o que foi abordado na série O que há de novo na 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