此页面由 Cloud Translation API 翻译。

WebGPU（Chrome 129）中的新变化

François Beaufort

支持使用画布色调映射模式的 HDR

网站开发者在提供 HDR 内容时可选的方案有限，主要依赖于 <img> 和 <video> 元素。不过，<canvas> 元素仍仅限 SDR。如需在画布中生成动态 HDR 内容，您需要先将其内容编码为 HDR 图片，然后才能显示（如需查看示例，请参阅此演示）。

WebGPU 画布配置中的新 GPUCanvasToneMappingMode 参数现在允许 WebGPU 绘制比白色 (#FFFFFF) 更亮的颜色。它通过以下模式实现此目的：

"standard"：默认行为会将内容限制在屏幕的 SDR 范围内。此模式的实现方法是将屏幕颜色空间中的所有颜色值限制在 [0, 1] 范围内。
"extended"：解锁屏幕的完整 HDR 范围。此模式与屏幕 [0, 1] 范围中的 "standard" 匹配。对屏幕的扩展动态范围执行钳制或投影，但不对 [0, 1] 执行。

以下代码段展示了如何为画布配置高动态范围。

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

如需探索结合使用 HDR 和 WebGPU，请参阅粒子 (HDR) 示例和 WebGPU HDR 示例，并查看 chromestatus 条目。

一台笔记本电脑，屏幕上显示了一幅鲜艳生动的 HDR 画面。 — HDR 屏幕上显示的“粒子 (HDR)”示例。

扩展的子群组支持

在宣布子群组实验后，子群组内置函数现在可在计算着色器和片段着色器中使用。它们不再仅限于计算着色器。请参阅问题 354738715。

请注意，在片段着色器中，subgroup_size 内置值目前存在错误。暂时不要这样做。

此外，还添加了以下子组内置函数：

subgroupAdd(value)：返回子组中所有活动调用 value 的总和。
subgroupExclusiveAdd(value)：返回子组中所有活跃调用 value 的独占扫描总和。
subgroupMul(value)：返回子组中所有活动调用 value 的乘积。
subgroupExclusiveMul(value)：返回子组中所有活跃调用 value 的独占扫描乘法。
subgroupAnd(value)：返回子组中所有有效调用 value 的二进制 AND。
subgroupOr(value)：返回子组中所有有效调用 value 的二进制 OR。
subgroupXor(value)：返回子组中所有活动调用 value 的二进制异或。
subgroupMin(value)：返回子组中所有有效调用 value 的最小值。
subgroupMax(value)：返回子组中所有活动调用 value 的最大值。
subgroupAll(value)：如果子组中的所有有效调用都为 value，则返回 true。
subgroupAny(value)：如果针对子组中的任何活跃调用的 value 为 true，则返回 true。
subgroupElect()：如果此调用在子组中的活跃调用中具有最低的 subgroup_invocation_id，则返回 true。
subgroupBroadcastFirst(value)：将子组中 subgroup_invocation_id 最低的活跃调用中的 value 广播到所有其他活跃调用。
subgroupShuffle(value, id)：从 subgroup_invocation_id 与 id 匹配的有效调用返回 value。
subgroupShuffleXor(value, mask)：从 subgroup_invocation_id 与 subgroup_invocation_id ^ mask 匹配的有效调用中返回 value。mask 必须是动态均匀的。
subgroupShuffleUp(value, delta)：从 subgroup_invocation_id 与 subgroup_invocation_id - delta 匹配的有效调用返回 value。
subgroupShuffleDown(value, delta)：从 subgroup_invocation_id 与 subgroup_invocation_id + delta 匹配的有效调用中返回 value。
quadBroadcast(value, id)：从 ID 等于 id 的四元调用广播 value。id 必须是常量表达式。
quadSwapX(value)：在 X 方向的四边形调用之间交换 value。
quadSwapY(value)：在 Y 方向上的四次调用之间交换 value。
quadSwapDiagonal(value)：沿四边形对角线在两次调用之间交换 value。

Dawn 更新

wgpu::PrimitiveState 结构体现在直接包含深度剪裁控制设置，无需单独的 wgpu::PrimitiveDepthClipControl 结构体。如需了解详情，请参阅以下代码段和 webgpu-headers PR。

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

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

WebGPU（Chrome 129）中的新变化

支持使用画布色调映射模式的 HDR

扩展的子群组支持

Dawn 更新

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