ฟีเจอร์สำหรับนักพัฒนาแอป WebGPU

François Beaufort
François Beaufort

เผยแพร่: 3 มิถุนายน 2025

การติดตั้งใช้งาน WebGPU API ของ Chrome มีฟีเจอร์ที่ออกแบบมาเพื่อการพัฒนาและการทดสอบเท่านั้น ฟีเจอร์เหล่านี้อยู่นอกข้อกำหนด WebGPU มาตรฐาน อย่าใช้ฟีเจอร์เหล่านี้ในเวอร์ชันที่ใช้งานจริง

เอกสารนี้จะอธิบายรายละเอียดเกี่ยวกับวิธีเปิดใช้ฟีเจอร์สำหรับนักพัฒนาซอฟต์แวร์ WebGPU และแสดงรายการที่ครอบคลุม

วิชาบังคับก่อน

หากต้องการเปิดใช้ฟีเจอร์สำหรับนักพัฒนาซอฟต์แวร์ WebGPU ใน Chrome ให้ทำตามขั้นตอนต่อไปนี้

  1. เปิดใช้ฟีเจอร์ "ฟีเจอร์สำหรับนักพัฒนาซอฟต์แวร์ WebGPU" ที่ chrome://flags/#enable-webgpu-developer-features
  2. รีสตาร์ทเบราว์เซอร์ Chrome

ปิดใช้การหาปริมาณการค้นหาการประทับเวลา

การค้นหาการประทับเวลาช่วยให้แอปพลิเคชัน WebGPU วัดเวลาในการดำเนินการของคำสั่ง GPU ได้อย่างแม่นยำ (เป็นหน่วยนาโนวินาที) ระหว่างการคำนวณและการส่งผ่านการแสดงผล คำค้นหาเหล่านี้มีความสำคัญต่อการวิเคราะห์ประสิทธิภาพและลักษณะการทำงานของภาระงาน GPU ดูรายละเอียดเพิ่มเติมได้ที่การค้นหาการประทับเวลาในพาสการคำนวณและการแสดงผล

เนื่องจากข้อกังวลเรื่องการโจมตีแบบกำหนดเวลา ระบบจึงกำหนดปริมาณการค้นหาการประทับเวลาด้วยความละเอียด 100 ไมโครวินาที ซึ่งเป็นการประนีประนอมที่ดีระหว่างความแม่นยำและความปลอดภัย ระบบจะปิดใช้การหาปริมาณนี้โดยอัตโนมัติเมื่อเปิดใช้ Flag "ฟีเจอร์สำหรับนักพัฒนาซอฟต์แวร์ WebGPU"

ข้อมูลอะแดปเตอร์เพิ่มเติม

หากต้องการทำความเข้าใจอะแดปเตอร์ที่ใช้ให้ดียิ่งขึ้น GPUAdapterInfo จะแสดงแอตทริบิวต์ต่อไปนี้

  • แอตทริบิวต์ device (มาตรฐาน) คือตัวระบุอะแดปเตอร์เฉพาะผู้ให้บริการ
  • แอตทริบิวต์ description (มาตรฐาน) คือสตริงที่มนุษย์อ่านได้ซึ่งให้รายละเอียดของอะแดปเตอร์
  • แอตทริบิวต์ driver (ไม่เป็นไปตามมาตรฐาน) คือสตริงที่มนุษย์อ่านได้ซึ่งอธิบายถึงคนขับ
  • แอตทริบิวต์ backend (ไม่เป็นไปตามมาตรฐาน) จะระบุแบ็กเอนด์กราฟิก เช่น "WebGPU", "D3D11", "D3D12", "metal", "vulkan", "openGL", "openGLES" หรือ "null"
  • แอตทริบิวต์ type (ไม่ใช่มาตรฐาน) ระบุประเภท GPU: "discrete GPU", "integrated GPU", "CPU" หรือ "unknown"
  • แอตทริบิวต์ d3dShaderModel (ไม่เป็นไปตามมาตรฐาน) จะระบุหมายเลขโมเดลเชเดอร์ D3D สูงสุดที่รองรับ เช่น 62 หมายถึงรองรับ HLSL SM 6.2
  • แอตทริบิวต์ vkDriverVersion (ไม่เป็นไปตามมาตรฐาน) คือเวอร์ชันไดรเวอร์ Vulkan ที่ผู้จำหน่ายระบุ
  • แอตทริบิวต์ powerPreference (ไม่เป็นไปตามมาตรฐาน) คือ "low-power" หรือ "high-performance" โดยอิงตาม GPUPowerPreference ใน GPURequestAdapterOptions

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)   { /* ... */ }
}

ตัวเลือกการคอมไพล์โมดูล Shader ที่เข้มงวด

GPUShaderModuleDescriptor มีstrictMath ตัวเลือกบูลีนที่ไม่เป็นไปตามมาตรฐาน ซึ่งเปิดหรือปิดใช้ความแม่นยำทางคณิตศาสตร์ที่เข้มงวดในระหว่างการคอมไพล์โมดูล Shader ตัวเลือกนี้ใช้ได้ใน 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 จะช่วยให้คุณทราบว่า GPU เข้าถึงวิดีโอที่นำเข้าด้วย 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');
}