WebGPU：疑難排解提示和修正

François Beaufort
François Beaufort
GitHub

本文說明 WebGPU 在 Chrome 瀏覽器中無法運作或無法正常運作的原因，並提供明確的步驟以解決可能的問題。

以下範例顯示當 navigator 不提供 gpu 時，您可能會收到的 JavaScript 錯誤：

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

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

這可能是出於下列其中一個原因。請依照以下順序查看：

  1. WebGPU 需要 Chrome 113 以上版本的作業系統，且搭載 ChromeOS、macOS、Windows，以及 Android 裝置上的 Chrome 121 以上版本。前往 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 轉接器為空值

以下範例說明當您呼叫 requestAdapter() 取得的轉接程式為空值時，可能會出現的 JavaScript 錯誤：

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 旗標，然後重新啟動 Chrome。如需 Linux 實驗性支援，您也必須啟用 chrome://flags/#enable-vulkan 標記。詳情請參閱「Headless Chrome 的 WebGPU 支援」一文。

  3. GPU 硬體已明確列入封鎖清單。如果畫面上顯示「WebGPU 已透過封鎖清單或指令列停用」訊息，，您可以啟用 chrome://flags/#enable-unsafe-webgpu 標記並重新啟動 Chrome，藉此停用 WebGPU 轉接器封鎖清單。chrome://gpu

  4. requestAdapter() 傳遞的選項沒有相符的 GPU 轉接器。嘗試透過不同選項呼叫 requestAdapter()。

  5. WebGPU 需要 GPU (硬體或軟體模擬)。如要檢查 Chrome 是否偵測到 GPU，請前往 chrome://gpu。

WebGPU 的速度比 WebGL 慢

  1. 開啟 chrome://gpu 並確認其中的內容為「WebGPU: Hardware accelerated」(WebGPU：硬體加速)。如果畫面上顯示「WebGPU：軟體專用，無法使用硬體加速功能」，則可能需要更新 GPU 驅動程式。

  2. 直接將 WebGL 概念轉譯為 WebGPU 可能不足以充分運用 WebGPU 的獨特最佳化功能。請參閱從 WebGL 到 WebGPU，進一步瞭解部分差異。

Windows 特定限制

在 Windows 裝置上使用 WebGPU 時，請注意下列限制：

  • Chrome 不支援同時使用多個 GPU 轉接器。請參閱問題 chromium:329211593。

  • 由於電力用量方面的因素 (例如省電功能)，Chrome 一律會使用與其他 Chrome 工作負載分配的 GPU 轉接器相同。一般來說，這種顯示卡是整合式圖形卡。這表示 powerPreference 選項在呼叫 requestAdapter() 時沒有任何影響。