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

François Beaufort
François Beaufort

เอกสารนี้จะอธิบายสาเหตุที่ 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() เป็นค่าว่าง

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 แบบไม่มีส่วนหัว

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

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

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

WebGPU ช้ากว่า WebGL

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

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

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

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

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

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