WebGPU के लिए डेवलपर की सुविधाएं

François Beaufort

पब्लिश किया गया: 3 जून, 2025

Chrome में WebGPU API लागू करने के बाद, इसमें सिर्फ़ डेवलपमेंट और टेस्टिंग के लिए बनाई गई सुविधाएं शामिल होंगी. ये सुविधाएं, WebGPU के स्टैंडर्ड स्पेसिफ़िकेशन के दायरे में नहीं आती हैं. इसलिए, इन्हें प्रोडक्शन में इस्तेमाल नहीं किया जाना चाहिए.

इस दस्तावेज़ में, WebGPU डेवलपर सुविधाओं को चालू करने का तरीका बताया गया है. साथ ही, इन सुविधाओं की पूरी सूची भी दी गई है.

पूर्वापेक्षा

Chrome में WebGPU डेवलपर सुविधाएं चालू करने के लिए, यह तरीका अपनाएं:

1. chrome://flags/#enable-webgpu-developer-features पर जाकर, "WebGPU डेवलपर सुविधाएं" फ़्लैग को चालू करें.
2. Chrome ब्राउज़र को रीस्टार्ट करें.

टाइमस्टैंप क्वेरी को क्वांटिज़ेशन की सुविधा बंद करना

टाइमस्टैंप क्वेरी की मदद से, WebGPU ऐप्लिकेशन, कैलकुलेट और रेंडर पास के दौरान GPU कमांड के लागू होने में लगने वाले समय को सटीक तरीके से (नैनोसेकंड तक) मेज़र कर सकते हैं. जीपीयू के वर्कलोड की परफ़ॉर्मेंस और व्यवहार का विश्लेषण करने के लिए, ये क्वेरी ज़रूरी हैं. ज़्यादा जानकारी के लिए, कंप्यूट और रेंडर पास में टाइमस्टैंप क्वेरी देखें.

टाइमिंग अटैक से जुड़ी समस्याओं की वजह से, टाइमस्टैंप क्वेरी को 100 माइक्रोसेकंड के रिज़ॉल्यूशन के साथ क्वांटाइज़ किया जाता है. इससे सटीक जानकारी और सुरक्षा के बीच एक अच्छा समझौता होता है. "WebGPU डेवलपर सुविधाएं" फ़्लैग चालू होने पर, यह क्वांटिज़ेशन अपने-आप बंद हो जाता है.

अडैप्टर के बारे में ज़्यादा जानकारी

इस्तेमाल किए जा रहे अडैप्टर के बारे में ज़्यादा जानने के लिए, GPUAdapterInfo ये एट्रिब्यूट दिखाता है:

• device एट्रिब्यूट (स्टैंडर्ड), वेंडर के हिसाब से अडैप्टर आइडेंटिफ़ायर है.
• description एट्रिब्यूट (स्टैंडर्ड) एक ऐसी स्ट्रिंग है जिसे कोई भी व्यक्ति आसानी से पढ़ सकता है. इसमें अडैप्टर की जानकारी दी जाती है.
• driver एट्रिब्यूट (नॉन-स्टैंडर्ड), ड्राइवर के बारे में ऐसी जानकारी होती है जिसे कोई भी व्यक्ति आसानी से पढ़ सकता है.
• backend एट्रिब्यूट (स्टैंडर्ड नहीं है) से ग्राफ़िक्स बैकएंड के बारे में पता चलता है. जैसे, "WebGPU", "D3D11", "D3D12", "metal", "vulkan", "openGL", "openGLES" या "null".
• type एट्रिब्यूट (स्टैंडर्ड नहीं है) से जीपीयू टाइप की पहचान होती है: "discrete GPU", "integrated GPU", "CPU" या "unknown".
• d3dShaderModel एट्रिब्यूट (यह स्टैंडर्ड नहीं है) से, D3D शेडर मॉडल का ज़्यादा से ज़्यादा इस्तेमाल किया जा सकने वाला नंबर पता चलता है. उदाहरण के लिए, 62 से पता चलता है कि HLSL SM 6.2 का इस्तेमाल किया जा सकता है.
• vkDriverVersion एट्रिब्यूट (नॉन-स्टैंडर्ड), वेंडर के तय किए गए Vulkan ड्राइवर वर्शन का नाम होता है.
• powerPreference एट्रिब्यूट (स्टैंडर्ड नहीं है) "low-power" या "high-performance" होता है. यह GPURequestAdapterOptions में मौजूद GPUPowerPreference के आधार पर तय होता है.

अपने ऐप्लिकेशन के डेवलपमेंट के दौरान, ज़्यादा मेमोरी का इस्तेमाल करने पर होने वाली समस्याओं से बचने के लिए, GPUAdapterInfo memoryHeaps ऐसी जानकारी दिखाता है जो स्टैंडर्ड नहीं है. जैसे, ऐडैप्टर पर उपलब्ध मेमोरी हेप का साइज़ और टाइप.

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

for (const { size, properties } of adapter.info.memoryHeaps) {
  console.log(size); // memory heap size in bytes
  if (properties & GPUHeapProperty.DEVICE_LOCAL)  { /* ... */ }
  if (properties & GPUHeapProperty.HOST_VISIBLE)  { /* ... */ }
  if (properties & GPUHeapProperty.HOST_COHERENT) { /* ... */ }
  if (properties & GPUHeapProperty.HOST_UNCACHED) { /* ... */ }
  if (properties & GPUHeapProperty.HOST_CACHED)   { /* ... */ }
}

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

GPUShaderModuleDescriptor में strictMath ऐसा बूलियन विकल्प शामिल होता है जो स्टैंडर्ड नहीं होता. यह शेडर मॉड्यूल के कंपाइल होने के दौरान, सटीक गणितीय सटीकता को चालू या बंद करता है. यह विकल्प Metal और Direct3D पर काम करता है. strictMath चालू होने पर, कंपाइलर सटीक गणितीय नियमों का पालन करता है. इसके उलट, इसे बंद करने पर कंपाइलर, शेडर को ऑप्टिमाइज़ कर सकता है. इसके लिए, वह:

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

वीडियो को ज़ीरो-कॉपी वाले तरीके से इंपोर्ट करना

GPUExternalTexture isZeroCopy के नॉन-स्टैंडर्ड बुलियन एट्रिब्यूट से आपको यह पता चलता है कि importExternalTexture() की मदद से इंपोर्ट किए गए वीडियो को, जीपीयू ने सीधे तौर पर ऐक्सेस किया है या नहीं. इसके लिए, किसी इंटरमीडियरी कॉपी की ज़रूरत नहीं पड़ी.

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

const video = document.querySelector('video');
const externalTexture = device.importExternalTexture({ source: video });

if (externalTexture.isZeroCopy) {
  console.log('Video frame was accessed directly by the GPU');
}