GPU

Limited availability

This feature is not Baseline because it does not work in some of the most widely-used browsers.

实验性: 这是一项实验性技术
在将其用于生产之前,请仔细检查浏览器兼容性表格

WebGPU APIGPU 接口是使用 WebGPU 的入口点。它用于返回一个 GPUAdapter,你可以从中请求设备,获取配置特性以及限制等。

当前上下文的 GPU 对象可以通过 Navigator.gpuWorkerNavigator.gpu 属性访问。

实例属性

requestAdapter() 实验性

返回 Promise,会兑现一个 GPUAdapter 对象实例。这时,你可以请求一个 GPUDevice,它是使用 WebGPU 功能的主要接口。

getPreferredCanvasFormat() 实验性

返回用于当前系统上显示 8 位色深、标准动态范围(SDR)内容的最佳 canvas 纹理格式。

示例

请求适配器和设备

js
async function init() {
  if (!navigator.gpu) {
    throw Error("WebGPU not supported.");
  }

  const adapter = await navigator.gpu.requestAdapter();
  if (!adapter) {
    throw Error("Couldn't request WebGPU adapter.");
  }

  const device = await adapter.requestDevice();

  //...
}

使用最佳纹理格式配置 GPUCanvasContext

js
const canvas = document.querySelector("#gpuCanvas");
const context = canvas.getContext("webgpu");

context.configure({
  device: device,
  format: navigator.gpu.getPreferredCanvasFormat(),
  alphaMode: "premultiplied",
});

规范

Specification
WebGPU
# gpu-interface

浏览器兼容性

Report problems with this compatibility data on GitHub
desktopmobileserver
Chrome
Edge
Firefox
Opera
Safari
Chrome Android
Firefox for Android
Opera Android
Safari on iOS
Samsung Internet
WebView Android
WebView on iOS
Deno
GPU
Experimental
getPreferredCanvasFormat
Experimental
requestAdapter
Experimental
On AC power, discrete GPU returned if no powerPreference set.
Experimental
wgslLanguageFeatures
Experimental

Legend

Tip: you can click/tap on a cell for more information.

Full support
Full support
Partial support
Partial support
In development. Supported in a pre-release version.
In development. Supported in a pre-release version.
No support
No support
Experimental. Expect behavior to change in the future.
See implementation notes.
User must explicitly enable this feature.
Has more compatibility info.

参见