WebGPU —— Chrome Developers

本文是_(WebGPU - Chrome Developers)[https://developer.chrome.com/docs/web-platform/webgpu/]_的翻译。

WebGPU支持web上的高性能3D图形和数据并行计算。

WebGPU是什么？

WebGPU是一个新的网络API，它暴露了现代计算机图形功能，特别是Direct3D 12、Metal和Vulkan，用于在图形处理单元（GPU）上执行渲染和计算操作。

这个目标与WebGL系列的API相似，但WebGPU能够访问GPU的更多高级功能。WebGL主要用于绘制图像，但可以通过很大的努力重新用于其他类型的计算，而WebGPU为在GPU上进行一般的计算提供一流的支持。

在W3C的 "网络GPU "社区小组中，经过四年的开发，WebGPU现在已经准备好让开发者在Chrome中试用，并对API和着色语言提出反馈意见。

"After a decade of WebGL bringing 3D graphics to the web and enabling all sorts of new experiences, it’s now time to upgrade the stack and help web developers take full advantage of modern graphics cards. WebGPU arrives just in time!"

Mr.doob, Three.js 的开发者

WebGPU gets us closer to the metal and it also unlocks the power of compute shader for Web developers. New 3D experiences can be built today on Babylon.js Playground.

David Catuhe, Babylon.js 的开发者

Babylon.js的demo：使用WebGPU的计算着色器功能模拟汹涌的大海

现状

步骤	状态
创建解释器	完成
创造规范的初始稿	正在进行中
收集反馈并迭代设计	正在进行中
初始试验	正在进行中
发布	未开始

如何使用 WebGPU

通过 about://flags 开启

要在本地试验WebGPU，而不需要原产地试用令牌，请在about://flags中启用#enable-unsafe-webgpu标志。

在初始试验阶段启用支持

从Chrome 94开始，WebGPU可在Chrome中作为原产地试用。原产地试用预计将在Chrome 105（2022年9月21日）结束。

原产地试验允许您尝试新功能，并就其可用性、实用性和有效性向网络标准社区提供反馈。欲了解更多信息，请参见《网络开发者初始试验指南》。要报名参加这项或其他初始试验，请访问注册页面。

初始实验注册

1. 为你的初始试验申请一个令牌。

2. 将令牌添加到你的页面。有两种方法可以做到这一点:

   • 在每个页面的头部添加一个 origin-trial 标签。例如，这可能看起来像。

     <meta http-equiv="origin-trial" content="TOKEN_GOES_HERE">

   • 如果你能配置你的服务器，你也可以使用Origin-Trial HTTP头来添加令牌。由此产生的响应头看起来应该是这样的：

     Origin-Trial: TOKEN_GOES_HERE

特征检测

检查是否支持WebGPU，使用：

if ("gpu" in navigator) {
  // WebGPU is supported! 🎉
}

注意

由navigator.gpu.requestAdapter()返回的GPU适配器可能为null。

开始

WebGPU是一个低级别的API，就像WebGL一样。它非常强大，相当啰嗦，而且在深入研究之前需要了解关键的概念。这就是为什么我将在本文中链接到现有的高质量内容，以便你开始学习WebGPU。

• WebGPU — All of the cores, none of the canvas

• Get started with GPU Compute on the web

• A Taste of WebGPU in Firefox

• WebGPU for Metal Developers, Part One

• Learn what key data structures and types are needed to draw in WebGPU

• WebGPU Explainer

• WebGPU Best Practices

浏览器支持

WebGPU在ChromeOS、macOS和Windows 10的Chrome 94中的特定设备上可用，未来将支持更多设备。通过在Chrome浏览器上运行
--enable-features=Vulkan，可以获得Linux实验性支持。对更多平台的支持也将随之而来。

完整的已知问题列表可在 ot-caveats 中找到。

在撰写本文时，Safari和Firefox的WebGPU支持正在进行中。

平台支持

就像在WebGL的世界里，一些库也实现了WebGPU。

• Dawn是Chromium中使用的WebGPU的一个C实现。它可以用来在C和C应用程序中以WebGPU为目标，然后使用Emscripten移植到WebAssembly，并在浏览器中自动利用WebGPU的优势。

• Wgpu是Firefox中使用的WebGPU的一个Rust实现。它被Rust生态系统中的各种GPU应用所使用，例如Veloren，一个多人的体素RPG。

演示

• WebGPU Samples

• Metaballs rendered in WebGPU

• WebGPU Clustered Forward Shading

安全与隐私

为了确保网页只能使用自己的数据，所有的命令在到达GPU之前都经过严格的验证。请查看WebGPU规范中的恶意使用考虑部分，以了解更多有关驱动错误的安全权衡。

反馈

Chrome团队想要了解你使用WebGPU的经验。

告诉我们关于API的设计

是不是API或shading语言有什么地方没有像你预期的那样工作？或者是缺少实现你的想法所需的方法或属性？对安全模型有问题或意见？在相应的gitHub-repo上提交一个规格问题，或者将你的想法添加到现有问题中。

报告实现中出现的问题

您是否发现Chrome浏览器的实现存在错误？或者实现方式与规范不同？请在new.crbug.com上提交一个错误。请确保包含尽可能多的细节，比如内部的about:gpu页面的内容、简单的重现说明，并在组件框中输入Blink>WebGPU。glitch对于分享快速而简单的重现非常有用。

支持WebGPU

您是否计划使用WebGPU？您的公开支持有助于Chrome团队确定功能的优先次序，并向其他浏览器供应商展示支持这些功能的重要性。

使用标签#WebGPU向@ChromiumDev发送一条推文，让我们知道您在哪里以及如何使用它。在StackOverflow上以#webgpu为标签提问。

有用的链接

• Public explainer

• WebGPU API Spec

• WebGPU Shading Language (WGSL)

• Chromium tracking bug

• ChromeStatus.com entry

• Blink Component: Blink>WebGPU

• TAG Review

• Intent to Experiment

• WebGPU’s matrix channel