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

François Beaufort
François Beaufort

WGSL'de klip mesafeleri

Kırpma mesafeleri, ilkellerin kırpma hacmini, köşe aşamasının çıkışında kullanıcı tanımlı yarı boşluklarla kısıtlamanıza olanak tanır. Kendi kırpma düzlemlerinizi tanımlamak, WebGPU sahnelerinizde nelerin görüneceği konusunda daha fazla kontrol sahibi olmanızı sağlar. Bu teknik, özellikle görselleştirme üzerinde hassas kontrol sahibi olmanın önemli olduğu CAD yazılımı gibi uygulamalarda yararlıdır.

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

  • 0 olan kırpma mesafesi, köşenin düzlemde olduğu anlamına gelir.
  • Pozitif mesafe, köşenin klip yarı alanının (tutmak istediğiniz taraf) içinde olduğu anlamına gelir.
  • Negatif mesafe, köşenin kırpma yarı uzayının (atlamak istediğiniz taraf) dışında 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. Bu grupta device, format, usage, viewFormats, colorSpace, toneMapping ve alphaMode üye yer alıyor. Bu, Parçacıklar (HDR) örneğinde gösterildiği gibi, tarayıcının HDR kanvası destekleyip desteklemediğini kontrol etme gibi görevler için yararlıdır. Aşağıdaki snippet'i, chromestatus girişini ve 370109829 numaralı sorunu inceleyin.

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 primitiflerinde derinlik önyargısı olmamalıdır

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

Alt gruplar için dahil edici tarama yerleşik işlevleri

Alt grup denemesi kapsamında, 361330160 numaralı sürüme aşağıdaki alt grup yerleşik işlevleri eklendi:

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

Çoklu çizim için deneysel dolaylı destek

Birden fazla çizim için dolaylı GPU özelliği, tek bir GPU komutuyla birden fazla çizim çağrısı göndermenize olanak tanır. Bu özellikle, partikül sistemleri, örnekleme ve büyük sahneler gibi çok sayıda nesnenin oluşturulması gereken durumlarda faydalıdır. drawIndirect() ve drawIndexedIndirect() GPURenderPassEncoder yöntemleri, bir GPU arabelleğinin belirli bir bölgesinden tek seferde yalnızca tek bir çizim çağrısı gönderebilir.

Bu deneysel özellik standartlaştırılana kadar Chrome'da kullanılabilmesi için chrome://flags/#enable-unsafe-webgpu adresinde "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ğe sahip bir GPUDevice isteyin. Ardından, çizim çağrılarını depolamak için GPUBufferUsage.INDIRECT kullanımıyla bir GPUBuffer oluşturun. Daha sonra, yeni multiDrawIndirect() ve multiDrawIndexedIndirect() GPURenderPassEncoder yöntemlerinde bir oluşturma geçişi içinde çizim çağrıları göndermek için kullanabilirsiniz. Aşağıdaki snippet'e ve 356461286 numaralı soruna bakın.

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();

Gölgelendirici modülü derleme seçeneği katı matematik

GPUShaderModuleDescriptor'a, gölgelendirici modülü derleme sırasında katı matematiği etkinleştirmenize veya devre dışı bırakmanıza olanak tanıyan bir doğru/yanlış strictMath geliştirici seçeneği eklendi. Bu özellik, chrome://flags/#enable-webgpu-developer-features adresindeki "WebGPU Geliştirici Özellikleri" işaretinin arkasında yer alır. Bu, özelliğin yalnızca geliştirme sırasında kullanılması amaçlandığı anlamına gelir. 42241455 numaralı soruna bakın.

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

  • NaN ve Infinity değerlerinin olasılığı yoksayılır.
  • -0 değerinin +0 olarak değerlendirilmesi.
  • Bölme işlemini, ters değerle çarpma işlemiyle değiştirme.
  • İşlemleri ilişkilendirme ve dağıtma özelliklerine göre 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öntemini kaldırın

GPUAdapter info özelliğini kullanarak GPUAdapterInfo'yu zaten senkronize olarak alabildiğiniz için GPUAdapter requestAdapterInfo() asynkron yöntemi gereksizdir. Bu nedenle, standart olmayan GPUAdapter requestAdapterInfo() yöntemi kaldırıldı. Kaldırma amacını inceleyin.

Şafak güncellemeleri

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

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

WebGPU'daki Yenilikler

WebGPU'daki Yenilikler serisinde ele alınan tüm konuların listesi.

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