WebGPU の新機能(Chrome 155 ~ 156)

WGSL fragment_depth 拡張機能

ジオメトリを多用するレンダリング パスでは、早期 Z 最適化が開発者の強い味方になります。GPU が高コストのフラグメント シェーダーを実行する前に隠れたピクセルを破棄できるようにすることで、パフォーマンスを大幅に向上させます。ラスタライズされた深度が深度テストに失敗した場合、シェーダーに他の副作用がない限り、GPU はフラグメント シェーダーを完全にスキップします。

ハードウェアがこの処理をどのように行うかについて詳しく知りたい場合は、MJP の優れた記事「Early-Z を無効にする必要があるのはいつか?」をご覧ください。

カスタム深度操作は便利ですが、フラグメント シェーダーで行うと、隠れたコストが発生します。フラグメント シェーダー内で @builtin(frag_depth) に書き込むと、通常、ドライバは描画呼び出し全体でこれらの早期 Z 最適化を無効にします。これは、ドライバ ヒューリスティクスでは、シェーダーで計算された出力深度がラスタライザーで補間された深度と一致することを保証できないためです。

このパフォーマンスの低下に対処するため、WGSL 拡張機能 fragment_depth を使用すると、@builtin(frag_depth) で less または greater の深度モード名を指定して、書き込まれた深度と補間された深度を比較する方法を明示的に指定できます。これにより、GPU は早期 Z 最適化を安全に適用できます。

この言語拡張機能は、JavaScript で navigator.gpu.wgslLanguageFeatures を使用して機能検出できます。WGSL シェーダー コードの先頭に requires-directive を使用して、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"],
});

この機能を推進してくださった外部の貢献者である Ignacio Castaño 氏に感謝いたします。

srgb-linear と display-p3-linear の色空間

「srgb-linear」と「display-p3-linear」の事前定義された色空間が追加されたことで、WebGPU キャンバス コンテキストで拡張範囲のリニア色空間に直接レンダリングして、広色域ディスプレイをサポートできるようになりました。これらの色空間では、ピクセル値と物理輝度の間に線形関係が維持されます。このため、ゲームでの物理的な光のレンダリングや、アンチエイリアシング、補間、間引きなどの空間処理タスクに最適です。出荷の意向と Particles(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」頂点形式は、4 つの符号付き正規化値を保持するパックされた 32 ビット形式です。3 つの 10 ビット コンポーネント(r, g, b)と 1 つの 2 ビット コンポーネント(a)が含まれます。この形式を使用すると、メモリ帯域幅を節約しながら、3D 法線ベクトルと 2 ビットのスカラーやアライメント フラグなどの属性を効率的に保存できます。仕様 PR 6491 をご覧ください。

NVIDIA の Linux での f16 のサポート

WGSL で 16 ビット浮動小数点値のサポートを提供するオプションの「shader-f16」機能が、最近の NVIDIA GPU ドライバの Linux でサポートされるようになりました。問題 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