Co nowego w WebGPU (Chrome 129)

François Beaufort
François Beaufort
GitHub

Obsługa HDR w trybie mapowania tonacji

Deweloperzy witryn mają ograniczone możliwości dostarczania treści HDR, ponieważ polegają głównie na elementach <img> i <video>. Element <canvas> pozostaje jednak ograniczony do SDR. Generowanie dynamicznych treści HDR na kanwie wymaga zakodowania ich jako obrazu HDR przed wyświetleniem (przykład: prezentacja).

Nowy parametr GPUCanvasToneMappingMode w konfiguracji kanwy WebGPU umożliwia teraz WebGPU rysowanie kolorów jaśniejszych niż biały (#FFFFFF). Robi to za pomocą tych trybów:

  • "standard": domyślne zachowanie ogranicza treści do zakresu SDR ekranu. Ten tryb jest realizowany przez ograniczenie wszystkich wartości kolorów w przestrzeni kolorów ekranu do przedziału [0, 1].

  • "extended": odblokowuje pełny zakres HDR ekranu. W tym trybie "standard" jest dopasowywany w zakresie [0, 1] na ekranie. Sklerowanie lub projekcja jest wykonywana z uwzględnieniem rozszerzonego zakresu dynamicznego ekranu, ale nie [0, 1].

Poniższy fragment kodu pokazuje, jak skonfigurować kanwę do obsługi wysokiego zakresu dynamicznego.

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

Aby dowiedzieć się więcej o HDR w WebGPU, zapoznaj się z próbką Particles (HDR) i przykładem HDR w WebGPU oraz sprawdź artykuł chromestatus.

Laptop z ekranem HDR wyświetlający żywy obraz.
Przykład cząsteczek (HDR) wyświetlany na ekranie HDR.

Obsługa rozszerzonych podgrup

Po ogłoszeniu eksperymentu dotyczącego podgrup funkcje wbudowane podgrupy są teraz dostępne do użycia zarówno w przypadku shaderów obliczeniowych, jak i fragmentacyjnych. Nie są już ograniczone tylko do shaderów obliczeniowych. Zobacz problem 354738715.

Pamiętaj, że wbudowana wartość subgroup_size jest obecnie niestabilna w shaderach fragmentów. Na razie nie używaj go.

Ponadto dodano te wbudowane funkcje podgrupy:

  • subgroupAdd(value): zwraca sumę wszystkich aktywnych wywołań value w podgrupie.
  • subgroupExclusiveAdd(value): zwraca sumę wyników skanowania wszystkich aktywnych wywołań value w podgrupie.
  • subgroupMul(value): zwraca iloczyn wszystkich aktywnych wywołań value w podgrupie.
  • subgroupExclusiveMul(value): zwraca mnożnik skanowania wykluczającego wszystkich aktywnych wywołań value w podgrupie.

  • subgroupAnd(value): zwraca binarne AND wszystkich aktywnych wywołań value w podgrupie.
  • subgroupOr(value): zwraca binarne LUB wszystkich aktywnych wywołań value w podgrupie.
  • subgroupXor(value): zwraca binarne XOR wszystkich aktywnych wywołań value w podgrupie.

  • subgroupMin(value): zwraca minimalną wartość wszystkich aktywnych wywołań value w podgrupie.
  • subgroupMax(value): zwraca maksymalną wartość wszystkich aktywnych wywołań value w podgrupie.

  • subgroupAll(value): zwraca wartość prawda, jeśli value ma wartość prawda dla wszystkich aktywnych wywołań w podgrupie.
  • subgroupAny(value): zwraca wartość prawda, jeśli value ma wartość prawda dla dowolnego aktywnego wywołania w podgrupie.

  • subgroupElect(): zwraca wartość „prawda”, jeśli to wywołanie ma najniższą wartość subgroup_invocation_id spośród aktywnych wywołań w podgrupie.
  • subgroupBroadcastFirst(value): rozgłasza value z aktywnej wywołania o najniższym subgroup_invocation_id w podgrupie do wszystkich innych aktywnych wywołań.

  • subgroupShuffle(value, id): zwraca value z aktywnej wywołania, którego subgroup_invocation_id jest zgodne z id.
  • subgroupShuffleXor(value, mask): zwraca value z aktywnej wywołania, którego subgroup_invocation_id jest zgodne z subgroup_invocation_id ^ mask. mask musi być dynamicznie jednorodna.
  • subgroupShuffleUp(value, delta): zwraca value z aktywnej wywołania, którego subgroup_invocation_id jest zgodne z subgroup_invocation_id - delta.
  • subgroupShuffleDown(value, delta): zwraca value z aktywnej wywołania, którego subgroup_invocation_id jest zgodne z subgroup_invocation_id + delta.

  • quadBroadcast(value, id): Przesyła value z wywołania kwadratu o identyfikatorze id. id musi być wyrażeniem statycznym.
  • quadSwapX(value): przełącza value między wywołaniami w kwartecie w kierunku X.
  • quadSwapY(value): przełącza value między wywołaniami w kwadrze w kierunku osi Y.
  • quadSwapDiagonal(value): przełącza value między wywołaniami w kwartecie na ukos.

Aktualizacje świtu

Struktura wgpu::PrimitiveState zawiera teraz ustawienie kontroli klipu głębi, co eliminuje potrzebę korzystania z osobnej struktury wgpu::PrimitiveDepthClipControl. Więcej informacji znajdziesz w tym fragmencie kodu i PR webgpu-headers.

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

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

Obejmuje to tylko niektóre najważniejsze informacje. Zapoznaj się z pełną listą commitów.

Co nowego w WebGPU

Lista wszystkich tematów omawianych w cyklu Co nowego w 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