WebGPU: เคล็ดลับและการแก้ปัญหา

François Beaufort
François Beaufort
GitHub

เอกสารนี้อธิบายสาเหตุที่ WebGPU อาจใช้งานไม่ได้หรือไม่ทำงานตามที่คาดไว้ในเบราว์เซอร์ Chrome พร้อมขั้นตอนที่ชัดเจนในการแก้ปัญหา (หากทำได้)

ตัวอย่างต่อไปนี้แสดงข้อผิดพลาด JavaScript ที่คุณอาจได้รับเมื่อ gpu ไม่พร้อมใช้งานใน navigator

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

cancel Uncaught TypeError: Cannot read properties of undefined (reading 'requestAdapter')

ซึ่งอาจเกิดจากสาเหตุข้อใดข้อหนึ่งต่อไปนี้ โปรดดูรายการดังกล่าวตามลำดับต่อไปนี้

  1. WebGPU ต้องใช้ Chrome 113 ขึ้นไปใน ChromeOS, macOS, Windows และ Chrome 121 ขึ้นไปใน Android ตรวจสอบเวอร์ชันของคุณที่ chrome://version และอัปเดตหากจำเป็น

  2. WebGPU เข้าถึงได้เฉพาะในบริบทที่ปลอดภัยเท่านั้น หากคุณแสดงโค้ดผ่านโปรโตคอลที่ไม่ปลอดภัย (เช่น http:, file:) ให้ใช้โปรโตคอล https: ที่ปลอดภัยหรือแก้ไขปัญหานี้ระหว่างการพัฒนาเว็บแอปด้วยวิธีใดวิธีหนึ่งต่อไปนี้

    • แสดงโค้ดในเครื่องบน http://localhost หรือ http://127.0.0.1 ด้วยคำสั่ง npx http-server หรือ python3 -m http.server

    • เพิ่มต้นทางลงในรายการ "ต้นทางที่ไม่ปลอดภัยซึ่งถือว่าปลอดภัย" ของ chrome://flags/#unsafely-treat-insecure-origin-as-secure แล้วรีสตาร์ท Chrome

    • ติดตั้ง Node.js แล้วเรียกใช้ npx servez --ssl เพื่อแสดงโฟลเดอร์ผ่าน https ด้วยใบรับรองปลอม คุณยังคงได้รับคำเตือนใน Chrome ซึ่งสามารถข้ามได้โดยคลิก "ขั้นสูง" แล้วคลิก "ดำเนินการต่อ"

    • แสดงเว็บเซิร์ฟเวอร์ภายในต่ออินเทอร์เน็ตด้วย ngrok

อะแดปเตอร์ GPU เป็นค่าว่าง

ต่อไปนี้คือตัวอย่างข้อผิดพลาด JavaScript ที่คุณอาจได้รับเมื่ออะแดปเตอร์ที่ได้จากการเรียก requestAdapter() เป็น Null

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

cancel Uncaught TypeError: Cannot read properties of undefined (reading requestDevice)

ปัญหานี้อาจเกิดขึ้นได้จากสาเหตุข้อใดข้อหนึ่งต่อไปนี้ โปรดดูรายการดังกล่าวตามลำดับต่อไปนี้

  1. WebGPU จะปิดอยู่เมื่อผู้ใช้ปิด "ใช้การเร่งกราฟิกเมื่อพร้อมใช้งาน" ใน chrome://settings/system ตรวจสอบว่าการตั้งค่านี้ปิดอยู่หรือไม่ แล้วเปิดอีกครั้ง

  2. แพลตฟอร์มนี้ยังไม่รองรับ WebGPU คุณสามารถเปิดใช้ Flag chrome://flags/#enable-unsafe-webgpu และรีสตาร์ท Chrome ได้ หากต้องการการสนับสนุนแบบทดลองสำหรับ Linux คุณจะต้องเปิดใช้ Flag chrome://flags/#enable-vulkan ด้วย ดูข้อมูลเพิ่มเติมเกี่ยวกับการรองรับ WebGPU ใน Chrome แบบ Headless

  3. ฮาร์ดแวร์ GPU อยู่ในรายการที่บล็อกโดยเฉพาะ หากเห็นข้อความ "ปิดใช้ WebGPU ผ่านรายการที่บล็อกหรือบรรทัดคำสั่งแล้ว" ใน chrome://gpu คุณสามารถปิดใช้รายการที่บล็อกอะแดปเตอร์ WebGPU ได้โดยเปิดใช้ Flag chrome://flags/#enable-unsafe-webgpu แล้วรีสตาร์ท Chrome

  4. ไม่มีอะแดปเตอร์ GPU ที่ตรงกับตัวเลือกที่ส่งใน requestAdapter() ลองโทรหา requestAdapter() ด้วยตัวเลือกต่างๆ

  5. WebGPU ต้องใช้ GPU (ฮาร์ดแวร์หรือซอฟต์แวร์จำลอง) คุณตรวจสอบได้ว่า Chrome ตรวจพบ GPU หรือไม่โดยไปที่ chrome://gpu

  6. กระบวนการ GPU ขัดข้องหลายครั้ง คุณสามารถโหลดหน้าเว็บซ้ำหรือรีสตาร์ท Chrome ดูข้อมูลเพิ่มเติมได้ที่แนวทางปฏิบัติแนะนำสำหรับการสูญเสียอุปกรณ์ WebGPU

WebGPU ทำงานช้ากว่า WebGL

  1. เปิด chrome://gpu และตรวจสอบว่าคุณอ่าน "WebGPU: เร่งด้วยฮาร์ดแวร์" ได้ หากเห็นข้อความ "WebGPU: ซอฟต์แวร์เท่านั้น ไม่มีการเร่งฮาร์ดแวร์" คุณอาจต้องอัปเดตไดรเวอร์ GPU

  2. การแปลแนวคิด WebGL เป็น WebGPU โดยตรงอาจไม่ได้ใช้ประโยชน์จากการเพิ่มประสิทธิภาพที่ไม่ซ้ำใครของ WebGPU อย่างเต็มที่ ดูข้อมูลเกี่ยวกับความแตกต่างบางอย่างของ WebGL และ WebGPU ได้ที่บทความจาก WebGL สู่ WebGPU

ข้อจำกัดเฉพาะของ Windows

โปรดคำนึงถึงข้อจำกัดต่อไปนี้เมื่อใช้ WebGPU ในอุปกรณ์ Windows

  • Chrome ไม่รองรับการใช้อะแดปเตอร์ GPU หลายตัวพร้อมกัน ดูปัญหา chromium:329211593

  • Chrome จะใช้อะแดปเตอร์ GPU เดียวกันกับที่จัดสรรไว้สำหรับเวิร์กโหลดอื่นๆ ของ Chrome เสมอ ซึ่งโดยทั่วไปแล้วสำหรับแล็ปท็อปจะเป็นการ์ดกราฟิกแบบรวม เนื่องจากข้อจำกัดด้านการใช้พลังงาน (เช่น การประหยัดพลังงาน) ซึ่งหมายความว่าตัวเลือก powerPreference จะไม่มีผลเมื่อเรียกใช้ requestAdapter()