WebGPU (Chrome 131) में नया क्या है

François Beaufort
François Beaufort
GitHub

WGSL में क्लिप की दूरियां

क्लिप की दूरियों की मदद से, उपयोगकर्ता के तय किए गए हाफ-स्पेस की मदद से, वर्टिक्स स्टेज के आउटपुट में प्राइमटिव के क्लिप वॉल्यूम को सीमित किया जा सकता है. क्लिपिंग प्लेन तय करने से, आपको WebGPU के सीन में दिखने वाली चीज़ों को बेहतर तरीके से कंट्रोल करने में मदद मिलती है. यह तकनीक, सीएडी सॉफ़्टवेयर जैसे ऐप्लिकेशन के लिए खास तौर पर काम की है, जहां विज़ुअलाइज़ेशन पर सटीक कंट्रोल ज़रूरी होता है.

जब GPUAdapter में "clip-distances" सुविधा उपलब्ध हो, तो WGSL में क्लिप की दूरी की सुविधा पाने के लिए, इस सुविधा वाले GPUDevice का अनुरोध करें. साथ ही, enable clip_distances; की मदद से अपने WGSL कोड में इस एक्सटेंशन को साफ़ तौर पर चालू करें. इसे चालू करने के बाद, अपने वर्टेक्स शेडर में, clip_distances बिल्ट-इन कलेक्शन का इस्तेमाल किया जा सकता है. यह कलेक्शन, उपयोगकर्ता के तय किए गए क्लिप प्लेन की दूरी है:

  • क्लिप की दूरी 0 होने का मतलब है कि वर्टिक्स, प्लैन पर मौजूद है.
  • अगर दूरी का मान धनात्मक है, तो इसका मतलब है कि वर्टिक्स, क्लिप के आधे हिस्से (जिस हिस्से को आपको रखना है) में है.
  • नेगेटिव दूरी का मतलब है कि वर्टिक्स, क्लिप के आधे हिस्से (वह हिस्सा जिसे आपको हटाना है) से बाहर है.

नीचे दिया गया स्निपेट, chromestatus पर मौजूद एंट्री, और समस्या 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()

GPUCanvasContext configure() को कॉन्फ़िगरेशन डिक्शनरी के साथ कॉल करने के बाद, GPUCanvasContext getConfiguration() तरीके से कैनवस कॉन्टेक्स्ट कॉन्फ़िगरेशन की जांच की जा सकती है. इसमें device, format, usage, viewFormats, colorSpace, toneMapping, और alphaMode के सदस्य शामिल हैं. यह कई कामों के लिए मददगार है. जैसे, यह पता लगाना कि ब्राउज़र पर एचडीआर कैनवस काम करता है या नहीं. इस बारे में पार्टिकल (एचडीआर) सैंपल में बताया गया है. नीचे दिया गया स्निपेट, chromestatus पर मौजूद एंट्री, और समस्या 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.
}

पॉइंट और लाइन प्राइमिटिव में डेप्थ बायस नहीं होना चाहिए

पहले बताए गए मुताबिक, WebGPU स्पेसिफ़िकेशन के मुताबिक, रेंडर पाइपलाइन के लिए टोपोलॉजी लाइन या पॉइंट टाइप होने पर, depthBias, depthBiasSlopeScale, और depthBiasClamp को शून्य से ज़्यादा वैल्यू पर सेट करने पर, पुष्टि करने से जुड़ी गड़बड़ी होती है. समस्या 352567424 देखें.

सबग्रुप के लिए, शामिल करने वाले स्कैन के पहले से मौजूद फ़ंक्शन

सबग्रुप के एक्सपेरिमेंट के हिस्से के तौर पर, समस्या 361330160 में ये सबग्रुप पहले से मौजूद फ़ंक्शन जोड़े गए हैं:

  • subgroupInclusiveAdd(value): यह सबग्रुप में मौजूद सभी चालू बातचीत के value मैसेज का, सभी के लिए एक स्कैन का कुल योग दिखाता है.
  • subgroupInclusiveMul(value): यह सबग्रुप में सभी चालू इनवोकेशन value के स्कैन के मल्टीप्लायर को दिखाता है.

मल्टी-ड्रॉ इनडायरेक्ट के लिए एक्सपेरिमेंटल सपोर्ट

मल्टी-ड्रॉ इनडायरेक्ट जीपीयू सुविधा की मदद से, एक जीपीयू कमांड से कई ड्रॉ कॉल जारी किए जा सकते हैं. यह सुविधा खास तौर पर उन स्थितियों में काम आती है जहां बड़ी संख्या में ऑब्जेक्ट को रेंडर करना होता है. जैसे, पार्टिकल सिस्टम, इंस्टैंसिंग, और बड़े सीन. drawIndirect() और drawIndexedIndirect() GBRenderPassEncoder के तरीके, जीपीयू बफ़र के खास इलाके से एक बार में सिर्फ़ एक ड्रॉ कॉल जारी कर सकते हैं.

जब तक एक्सपेरिमेंट के तौर पर उपलब्ध यह सुविधा स्टैंडर्ड नहीं हो जाती, तब तक chrome://flags/#enable-unsafe-webgpu पर "असुरक्षित WebGPU सहायता" फ़्लैग को चालू करें, ताकि इसे Chrome में उपलब्ध कराया जा सके.

GPUAdapter में उपलब्ध "chromium-experimental-multi-draw-indirect" नॉन-स्टैंडर्ड जीपीयू सुविधा की मदद से, इस सुविधा वाले GPUDevice का अनुरोध करें. इसके बाद, ड्रॉ कॉल को स्टोर करने के लिए GPUBufferUsage.INDIRECT के इस्तेमाल के साथ एक GPUBuffer बनाएं. बाद में, multiDrawIndirect() और multiDrawIndexedIndirect() GPURenderPassEncoder के नए तरीकों में इसका इस्तेमाल किया जा सकता है, ताकि रेंडर पास में ड्रॉ कॉल जारी किए जा सकें. यहां दिया गया स्निपेट और समस्या 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();

शेडर मॉड्यूल कंपाइल करने का विकल्प स्ट्रिक्ट मैथ

GPUShaderModuleDescriptor में, बूलियन strictMath डेवलपर विकल्प जोड़ा गया है. इससे शेडर मॉड्यूल के कंपाइल होने के दौरान, सटीक गणित की सुविधा को चालू या बंद किया जा सकता है. यह सुविधा chrome://flags/#enable-webgpu-developer-features पर "WebGPU डेवलपर सुविधाएं" फ़्लैग के पीछे उपलब्ध है. इसका मतलब है कि यह सुविधा सिर्फ़ डेवलपमेंट के दौरान इस्तेमाल करने के लिए है. समस्या 42241455 देखें.

फ़िलहाल, यह विकल्प Metal और Direct3D पर काम करता है. सटीक गणित की सुविधा बंद होने पर, कंपाइलर आपके शेडर को इन तरीकों से ऑप्टिमाइज़ कर सकता है:

  • NaN और Infinity वैल्यू की संभावना को अनदेखा करना.
  • -0 को +0 के तौर पर इस्तेमाल करना.
  • व्युत्क्रम से तेज़ी से गुणा करके विभाजन को बदलना.
  • असोसिएटिव और डिस्ट्रिब्यूटिव प्रॉपर्टी के आधार पर, ऑपरेशन को फिर से व्यवस्थित करना.
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 });

जीपीयू अडैप्टर requestAdapterInfo() हटाएं

जीपीयू अडैप्टर requestAdapterInfo() एसिंक्रोनस तरीका काम का नहीं है, क्योंकि आप जीपीयू अडैप्टर info एट्रिब्यूट का इस्तेमाल करके पहले से ही जीपीयूAdapterInfo सिंक कर सकते हैं. इसलिए, अब GPUAdapter requestAdapterInfo() का नॉन-स्टैंडर्ड तरीका हटा दिया गया है. हटाने का इंटेंट देखें.

Dawn के बारे में अपडेट

tint_benchmark एक्ज़ीक्यूटेबल, WGSL से हर बैकएंड भाषा में शेडर का अनुवाद करने की लागत का आकलन करता है. इसके बारे में ज़्यादा जानने के लिए, नया दस्तावेज़ देखें.

इसमें सिर्फ़ कुछ खास हाइलाइट शामिल हैं. कमिट की पूरी सूची देखें.

WebGPU में नया क्या है

WebGPU में नया क्या है सीरीज़ में शामिल सभी चीज़ों की सूची.

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