WebGPU 新功能 (Chrome 155-156)

WGSL fragment_depth 擴充功能

在幾何圖形密集的轉譯階段，Early-Z 最佳化是開發人員的最佳幫手。這項功能可讓 GPU 在執行昂貴的片段著色器之前，先捨棄隱藏的像素，大幅提升效能。如果光柵化深度未通過深度測試，GPU 會完全略過片段著色器，前提是著色器沒有其他副作用。

如要瞭解硬體如何處理這項作業，MJP 撰寫了一篇精彩的文章：何時必須停用 Early-Z？。

雖然自訂深度操控功能很實用，但在片段著色器中執行這項操作會產生隱藏稅。在片段著色器中寫入 @builtin(frag_depth)，通常會強制驅動程式停用整個繪製呼叫的早期 Z 最佳化。這是因為驅動程式啟發式演算法無法保證著色器計算出的輸出深度，與光柵化器插補的深度相符。

為解決這項效能問題，WGSL 擴充功能 fragment_depth 可讓您在 @builtin(frag_depth) 上指定 less 或 greater 深度模式名稱，明確指出寫入深度與內插深度的比較方式，讓 GPU 安全地套用 Early-Z 最佳化。

您可以使用 navigator.gpu.wgslLanguageFeatures，在 JavaScript 中偵測這項語言擴充功能。建議您在 WGSL 著色器程式碼頂端使用 requires 指令，指出 requires fragment_depth; 可能無法移植。請參閱以下範例和推出意願。

if (!navigator.gpu.wgslLanguageFeatures.has("fragment_depth")) {
  throw new Error(`WGSL fragment depth is not available`);
}

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

const shaderModule = device.createShaderModule({ code: `
  requires fragment_depth;

  @fragment
  fn main() -> @builtin(frag_depth, less) f32 {
    // Explicitly states that the output fragment depth is less than early-Z depth,
    // allowing the GPU to safely preserve early-Z optimizations.
    return 0.0f;
  }`,
});

紋理壓縮未對齊

「texture-compression-unaligned」GPU 功能可建立壓縮紋理，其尺寸不是區塊大小的整數倍數 (例如 BC、ETC2 和 ASTC 格式的 4x4)。過去，WebGPU 嚴格要求紋理大小必須與這些區塊邊界對齊。這項功能可避免為了配合區塊對齊而填補或縮放紋理，因此能保留原始壓縮保真度，不會造成縮放失真。請參閱推出意向。

下列程式碼片段會檢查轉接器是否支援未對齊的紋理壓縮，如果支援，則會要求使用該轉接器的裝置。

const adapter = await navigator.gpu.requestAdapter();
if (!adapter.features.has("texture-compression-unaligned")) {
  throw new Error("Texture compression unaligned support is not available");
}
// Explicitly request texture compression unaligned support.
const device = await adapter.requestDevice({
  requiredFeatures: ["texture-compression-unaligned"],
});

非常感謝 spark.js 的外部貢獻者 Ignacio Castaño 推動這項功能、規格和 CTS 工作！

srgb-linear 和 display-p3-linear 色域

新增「srgb-linear」和「display-p3-linear」預先定義的色域後，WebGPU 畫布背景資訊現在可以直接轉譯為擴充範圍線性色域，支援廣色域螢幕。這些色域在像素值和物理亮度之間維持線性關係。因此非常適合用於遊戲中的物理光線算繪，以及空間處理工作，例如反鋸齒、內插和抽取。請參閱推出意向和粒子 (HDR) 範例 PR #574。

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",
  colorSpace: "display-p3-linear",
});

額外的 snorm10-10-10-2 頂點格式

「snorm10-10-10-2」頂點格式是封裝的 32 位元格式，包含四個帶正負號的正規化值：三個 10 位元元件 (r, g, b) 和一個 2 位元元件 (a)。這種格式可有效率地儲存屬性，例如具有額外 2 位元純量或對齊標記的 3D 法向量，同時節省記憶體頻寬。請參閱規格 PR 6491。

Linux 支援 NVIDIA 的 f16

選用的「shader-f16」功能可在 WGSL 中支援 16 位元浮點值，現在 Linux 系統也支援這項功能，適用於近期推出的 NVIDIA GPU 驅動程式。詳情請參閱問題 chromium:42251215。

Dawn 更新

現在，您可以使用 WGPUAdapterPropertiesD3D 結構，查詢特定 GPU 轉接器的基礎 DXGIAdapter LUID。詳情請參閱 Chromium 問題 562849566。

以上是幾項重點。查看完整的修訂版本清單。

WebGPU 新功能

「WebGPU 的新功能」系列文章涵蓋的所有內容清單。

Chrome 155-156

Chrome 153-154

Chrome 151-152

Chrome 149-150

Chrome 147-148

Chrome 146

Chrome 145

Chrome 144

Chrome 143

Chrome 142

Chrome 141

Chrome 140

Chrome 139

Chrome 138

Chrome 137

Chrome 136

Chrome 135

Chrome 134

Chrome 133

Chrome 132

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