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

François Beaufort
François Beaufort

เผยแพร่: 7 กุมภาพันธ์ 2024, อัปเดตล่าสุด: 17 ตุลาคม 2025

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

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

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

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

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

  • Chrome จะใช้อะแดปเตอร์ GPU เดียวกันเสมอซึ่งได้รับการจัดสรรสำหรับปริมาณงานอื่นๆ ของ Chrome โดยทั่วไปแล้วสำหรับแล็ปท็อปจะเป็นกราฟิกการ์ดในตัวเนื่องจากด้านการใช้พลังงาน (เช่น การประหยัดพลังงาน) ซึ่งหมายความว่าตัวเลือก powerPreference จะไม่มีผลใดๆ เมื่อเรียกใช้ requestAdapter() คุณบังคับให้ใช้ GPU ที่มีประสิทธิภาพสูงได้หากมี โดยเปิดใช้chrome://flags/#force-high-performance-gpu Flag แล้วรีสตาร์ท Chrome