WebGPU'daki Yenilikler (Chrome{6/}131)

François Beaufort
François Beaufort

WGSL'de kırpma mesafeleri

Kırpma mesafeleri, köşe aşamasının çıkışında kullanıcı tanımlı yarım boşluklarla temel öğelerin kırpma hacmini kısıtlamanıza olanak tanır. Kendi kırpma düzlemlerinizi tanımlamak, WebGPU sahnelerinizde görünür olanlar üzerinde daha fazla kontrol sağlar. Bu teknik, özellikle görselleştirme üzerinde hassas kontrolün çok önemli olduğu CAD yazılımları gibi uygulamalar için faydalıdır.

"clip-distances" özelliği bir GPUAdapter'da kullanılabildiğinde, WGSL'de kırpma mesafesi desteği almak için bu özelliği içeren bir GPUDevice isteyin ve enable clip_distances; ile bu uzantıyı WGSL kodunuzda açıkça etkinleştirin. Etkinleştirildikten sonra, köşe gölgelendiricinizde clip_distances yerleşik diziyi kullanabilirsiniz. Bu dizi, kullanıcı tanımlı bir kırpma düzlemine olan mesafeleri içerir:

  • 0 olan bir kırpma mesafesi, köşe noktasının düzlem üzerinde olduğu anlamına gelir.
  • Pozitif mesafe, köşe noktasının kırpma yarı alanının içinde (tutmak istediğiniz taraf) olduğunu gösterir.
  • Negatif uzaklık, köşe noktasının kırpma yarı alanının dışında (atmak istediğiniz taraf) olduğu anlamına gelir.

Aşağıdaki snippet'e, chromestatus girişine ve 358408571 numaralı soruna bakın.

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

const vertexShaderModule = device.createShaderModule({ code: `
  enable clip_distances;

  struct VertexOut {
    @builtin(clip_distances) my_clip_distances : array<f32, 1>,
    @builtin(position) my_position : vec4f,
  }
  @vertex fn main() -> VertexOut {
    var output : VertexOut;
    output.my_clip_distances[0] = 1;
    output.my_position = vec4f(0, 0, 0, 1);
    return output;
  }
`,
});

// Send the appropriate commands to the GPU...

GPUCanvasContext getConfiguration()

GPUCanvasContext configure() bir yapılandırma sözlüğüyle çağrıldıktan sonra GPUCanvasContext getConfiguration() yöntemi, tuval bağlamı yapılandırmasını kontrol etmenize olanak tanır. device, format, usage, viewFormats, colorSpace, toneMapping ve alphaMode üyeleri dahildir. Bu, Parçacıklar (HDR) örneğinde gösterildiği gibi tarayıcının HDR tuvali destekleyip desteklemediğini kontrol etme gibi görevler için kullanışlıdır. Aşağıdaki snippet'e, chromestatus girişine ve 370109829 numaralı soruna bakın.

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

const canvas = document.querySelector("canvas");
const context = canvas.getContext("webgpu");

// Configure the canvas for HDR.
context.configure({
  device,
  format: "rgba16float",
  toneMapping: { mode: "extended" },
});

const configuration = context.getConfiguration();
if (configuration.toneMapping.mode === "extended") {
  // The browser supports HDR canvas.
  // Warning! The user still needs a HDR display to enjoy HDR content.
}

Nokta ve çizgi öğelerinde derinlik önyargısı olmamalıdır.

Daha önce duyurulduğu gibi, WebGPU spesifikasyonu artık bir oluşturma işlem hattının topolojisi bir çizgi veya nokta türü olduğunda depthBias, depthBiasSlopeScale ve depthBiasClamp değerlerinin sıfır olmayan bir değere ayarlanmasını doğrulama hatası olarak kabul ediyor. 352567424 numaralı soruna bakın.

Alt gruplar için kapsayıcı tarama yerleşik işlevleri

Alt gruplarla ilgili deneme kapsamında, 361330160 numaralı sorunda aşağıdaki alt grup yerleşik işlevleri eklenmiştir:

  • subgroupInclusiveAdd(value): Alt gruptaki tüm etkin çağrıların value kapsayıcı tarama toplamını döndürür.
  • subgroupInclusiveMul(value): Alt gruptaki tüm etkin çağırma işlemlerinin value kapsayıcı tarama çarpımını döndürür.

Çoklu çekme dolaylı için deneysel destek

Çoklu çizim dolaylı GPU özelliği, tek bir GPU komutuyla birden fazla çizim çağrısı yapmanıza olanak tanır. Bu özellik, özellikle parçacık sistemleri, örnekleme ve büyük sahneler gibi çok sayıda nesnenin oluşturulması gereken durumlarda yararlıdır. drawIndirect() ve drawIndexedIndirect() GPURenderPassEncoder yöntemleri, GPU arabelleğinin belirli bir bölgesinden tek seferde yalnızca tek bir çizim çağrısı yayınlayabilir.

Bu deneysel özellik standartlaştırılana kadar Chrome'da kullanılabilmesi için chrome://flags/#enable-unsafe-webgpu adresinde "Unsafe WebGPU Support" (Güvenli Olmayan WebGPU Desteği) işaretini etkinleştirin.

GPUAdapter'da bulunan "chromium-experimental-multi-draw-indirect" standart dışı GPU özelliğiyle, bu özelliği içeren bir GPUDevice isteyin. Ardından, çizim çağrılarını depolamak için GPUBufferUsage.INDIRECT kullanımıyla bir GPUBuffer oluşturun. Daha sonra, oluşturma geçişi içinde çizim çağrıları yayınlamak için yeni multiDrawIndirect() ve multiDrawIndexedIndirect() GPURenderPassEncoder yöntemlerinde kullanabilirsiniz. Aşağıdaki snippet'i ve 356461286 numaralı sorunu inceleyin.

const adapter = await navigator.gpu.requestAdapter();
if (!adapter.features.has("chromium-experimental-multi-draw-indirect")) {
  throw new Error("Experimental multi-draw indirect support is not available");
}
// Explicitly request experimental multi-draw indirect support.
const device = await adapter.requestDevice({
  requiredFeatures: ["chromium-experimental-multi-draw-indirect"],
});

// Draw call have vertexCount, instanceCount, firstVertex, and firstInstance parameters.
const drawData = new Uint32Array([
  3, 1, 0, 0, // First draw call
  3, 1, 3, 0, // Second draw call
]);
// Create a buffer to store the draw calls.
const drawBuffer = device.createBuffer({
  size: drawData.byteLength,
  usage: GPUBufferUsage.INDIRECT | GPUBufferUsage.COPY_DST,
});
device.queue.writeBuffer(drawBuffer, 0, drawData);

// Create a render pipeline, a vertex buffer, and a render pass encoder...

// Inside a render pass, issue the draw calls.
myPassEncoder.setPipeline(myPipeline);
myPassEncoder.setVertexBuffer(0, myVertexBuffer);
myPassEncoder.multiDrawIndirect(drawBuffer, /*offset=*/ 0, /*maxDrawCount=*/ 2);
myPassEncoder.end();

Shader modülü derleme seçeneği strict math

GPUShaderModuleDescriptor'a, gölgelendirici modülü derleme sırasında katı matematik işlemlerini etkinleştirmenize veya devre dışı bırakmanıza olanak tanıyan bir boolean strictMath geliştirici seçeneği eklendi. Bu özellik, chrome://flags/#enable-webgpu-developer-features adresindeki "WebGPU Developer Features" (WebGPU Geliştirici Özellikleri) işaretinin arkasında bulunur. Bu nedenle, yalnızca geliştirme sırasında kullanılmak üzere tasarlanmıştır. 42241455 numaralı soruna bakın.

Bu seçenek şu anda Metal ve Direct3D'de desteklenmektedir. Kesin matematik devre dışı bırakıldığında derleyici, gölgelendiricilerinizi şu şekilde optimize edebilir:

  • NaN ve Infinity değerlerinin olasılığını yoksayma.
  • -0, +0 olarak değerlendirilir.
  • Bölme işlemini, karşılıklı çarpma işlemiyle değiştirme.
  • Birleşme ve dağılma özelliklerine göre işlemleri yeniden düzenleme.
const adapter = await navigator.gpu.requestAdapter();
const device = await adapter.requestDevice();

const code = `
  // Examines the bit pattern of the floating-point number to
  // determine if it represents a NaN according to the IEEE 754 standard.
  fn isNan(x : f32) -> bool {
    bool ones_exp = (bitcast<u32>(x) & 0x7f8) == 0x7f8;
    bool non_zero_sig = (bitcast<u32>(x) & 0x7ffff) != 0;
    return ones_exp && non_zero_sig;
  }
  // ...
`;

// Enable strict math during shader compilation.
const shaderModule = device.createShaderModule({ code, strictMath: true });

GPUAdapter requestAdapterInfo() yönteminin kaldırılması

GPUAdapter requestAdapterInfo() eşzamansız yöntemi gereksizdir. Çünkü GPUAdapter info özelliğini kullanarak GPUAdapterInfo'yu eşzamanlı olarak alabilirsiniz. Bu nedenle, standart olmayan GPUAdapter requestAdapterInfo() yöntemi artık kaldırıldı. Kaldırma amacı başlıklı makaleyi inceleyin.

Dawn güncellemeleri

tint_benchmark yürütülebilir dosyası, gölgelendiricilerin WGSL'den her arka uç diline çevrilmesinin maliyetini ölçer. Bu özellik hakkında daha fazla bilgi edinmek için yeni belgelere göz atın.

Bu özet yalnızca önemli noktalardan bazılarını kapsar. Kapsamlı commit listesine göz atın.

WebGPU'daki yenilikler

WebGPU'daki Yenilikler serisinde ele alınan her şeyin listesi.

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