Halaman ini diterjemahkan oleh Cloud Translation API.

Yang Baru di WebGPU (Chrome 131)

François Beaufort

Jarak klip di WGSL

Jarak klip memungkinkan Anda membatasi volume klip primitif dengan setengah ruang yang ditentukan pengguna dalam output tahap vertex. Menentukan bidang kliping Anda sendiri memberikan kontrol yang lebih besar atas apa yang terlihat di adegan WebGPU Anda. Teknik ini sangat berguna untuk aplikasi seperti software CAD, yang memerlukan kontrol visualisasi yang presisi.

Jika fitur "clip-distances" tersedia di GPUAdapter, minta GPUDevice dengan fitur ini untuk mendapatkan dukungan jarak klip di WGSL, dan aktifkan ekstensi ini secara eksplisit dalam kode WGSL Anda dengan enable clip_distances;. Setelah diaktifkan, Anda dapat menggunakan array bawaan clip_distances di shader vertex. Array ini menyimpan jarak ke bidang klip yang ditentukan pengguna:

Jarak klip 0 berarti verteks terletak pada bidang.
Jarak positif berarti verteks berada di dalam setengah ruang klip (sisi yang ingin Anda pertahankan).
Jarak negatif berarti verteks berada di luar setengah ruang klip (sisi yang ingin Anda hapus).

Lihat cuplikan berikut, entri chromestatus, dan masalah 358408571.

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

Setelah GPUCanvasContext configure() dipanggil dengan kamus konfigurasi, metode GPUCanvasContext getConfiguration() memungkinkan Anda memeriksa konfigurasi konteks kanvas. Ini mencakup anggota device, format, usage, viewFormats, colorSpace, toneMapping, dan alphaMode. Hal ini berguna untuk tugas seperti memeriksa apakah browser mendukung kanvas HDR, seperti yang ditunjukkan dalam contoh Partikel (HDR). Lihat cuplikan berikut, entri chromestatus, dan masalah 370109829.

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.
}

Primitif titik dan garis tidak boleh memiliki bias kedalaman

Seperti yang diumumkan sebelumnya, spesifikasi WebGPU kini membuat error validasi untuk menyetel depthBias, depthBiasSlopeScale, dan depthBiasClamp ke nilai bukan nol jika topologi untuk pipeline render adalah jenis garis atau titik. Lihat masalah 352567424.

Fungsi bawaan pemindaian inklusif untuk subgrup

Sebagai bagian dari eksperimen subgrup, fungsi bawaan subgrup berikut telah ditambahkan dalam masalah 361330160:

subgroupInclusiveAdd(value): Menampilkan penjumlahan pemindaian inklusif dari semua pemanggilan value yang aktif di seluruh subgrup.
subgroupInclusiveMul(value): Menampilkan perkalian pemindaian inklusif dari semua pemanggilan aktif value di seluruh subgrup.

Dukungan eksperimental untuk multi-draw tidak langsung

Fitur GPU multi-draw tidak langsung memungkinkan Anda mengeluarkan beberapa panggilan gambar dengan satu perintah GPU. Hal ini sangat berguna dalam situasi ketika sejumlah besar objek perlu dirender, seperti sistem partikel, instancing, dan adegan besar. Metode drawIndirect() dan drawIndexedIndirect() GPURenderPassEncoder hanya dapat mengeluarkan satu panggilan gambar dalam satu waktu dari region tertentu pada buffer GPU.

Hingga fitur eksperimental ini distandardisasi, aktifkan tanda "Unsafe WebGPU Support" di chrome://flags/#enable-unsafe-webgpu agar tersedia di Chrome.

Dengan fitur GPU non-standar "chromium-experimental-multi-draw-indirect" yang tersedia di GPUAdapter, minta GPUDevice dengan fitur ini. Kemudian, buat GPUBuffer dengan penggunaan GPUBufferUsage.INDIRECT untuk menyimpan panggilan gambar. Anda dapat menggunakannya nanti dalam metode multiDrawIndirect() dan multiDrawIndexedIndirect() GPURenderPassEncoder baru untuk mengeluarkan panggilan gambar di dalam render pass. Lihat cuplikan berikut dan masalah 356461286.

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

Opsi kompilasi modul shader matematika ketat

Opsi developer boolean strictMath telah ditambahkan ke GPUShaderModuleDescriptor untuk memungkinkan Anda mengaktifkan atau menonaktifkan matematika ketat selama kompilasi modul shader. Fitur ini tersedia di balik tanda "Fitur Developer WebGPU" di chrome://flags/#enable-webgpu-developer-features, yang berarti fitur ini hanya ditujukan untuk digunakan selama pengembangan. Lihat masalah 42241455.

Opsi ini saat ini didukung di Metal dan Direct3D. Jika matematika ketat dinonaktifkan, compiler dapat mengoptimalkan shader Anda dengan:

Mengabaikan kemungkinan nilai NaN dan Infinity.
Memperlakukan -0 sebagai +0.
Mengganti pembagian dengan perkalian yang lebih cepat dengan kebalikan.
Mengatur ulang operasi berdasarkan sifat asosiatif dan distributif.

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

Menghapus GPUAdapter requestAdapterInfo()

Metode asinkron requestAdapterInfo() GPUAdapter bersifat redundan karena Anda sudah bisa mendapatkan GPUAdapterInfo secara sinkron menggunakan atribut info GPUAdapter. Oleh karena itu, metode GPUAdapter requestAdapterInfo() non-standar kini dihapus. Lihat niat untuk menghapus.

Update Dawn

Dapat dieksekusi tint_benchmark mengukur biaya menerjemahkan shader dari WGSL ke setiap bahasa backend. Lihat dokumentasi baru untuk mempelajari lebih lanjut.

Hal ini hanya mencakup beberapa sorotan utama. Lihat daftar commit yang lengkap.