在 WebGPU 与 Vulkan 之间做出正确的选择（Making the Right Choice between WebGPU vs Vulkan）
本来想了解一下WebGPU 与 Vulkan的关系与区别，百度搜的都不咋靠谱，偶然发下这篇文章，感觉写的很好。
这里翻一下提供给需要的人。
PS：软件翻的，手动修改了一些别扭的地方，整体还行！
原文章地址：Making the Right Choice between WebGPU vs Vulkan
对于需要与现代 GPU 硬件高效交互的开发人员，建议使用WebGPU ，尤其是对于基于浏览器的应用程序。它通过最小化 JavaScript 调用和最佳地管理计算资源，表现优于Vulkan。然而，对于多样化的设备定位和光线追踪的无缝集成，Vulkan仍然是首选。
WebGPU 和 Vulkan 之间的主要区别
WebGPU 仍处于开发阶段，是一种现代 API，旨在解决 WebGL 的局限性。Vulkan 是一种成熟的跨平台行业标准图形 API。WebGPU 以最佳方式管理计算资源，减少过多 JavaScript 调用的开销。Vulkan 提供对调度、同步和内存分配的细粒度控制。
WebGPU 将
Direct3D 12、Metal、Vulkan等现代 API 的进步引入网络，提供新的基于浏览器的编程潜力。Vulkan 适用于多种设备，提供频繁的扩展和改进。WebGPU 由
Apple、Google、Mozilla、Microsoft 和 Intel等科技巨头共同开发。Vulkan 允许通过 Khronos做出贡献，提出改进建议或为开源项目做出贡献。
| 比较 | WebGPU | Vulkan |
|---|---|---|
| API 目的 | 解决 WebGL 的限制并与现代 GPU 硬件有效交互 | 跨平台图形和视频压缩行业标准 API |
| 发展 | 自 2017 年起由 W3C “GPU for the Web” 开发 | 2013 年由 AMD 开发，后来捐赠给 Khronos 集团 |
| 可用性 | Chrome 113 首次发布，适用于 Windows、ChromeOS 和 MacOS。计划针对 Android 和 Linux | 广泛可用，不断发展和频繁扩展 |
| 优点 | 自动处理异常，释放惊人的性能，减少 JavaScript 调用的开销 | 提供对调度、同步和内存分配的细粒度控制 |
| 用例 | 复杂的视觉效果、机器学习计算和计算资源优化 | 设备定位、GPU编程、3D性能增强 |
| 扩展和添加 | W3C 正在设计中的预期功能改进 | 频繁扩展和添加功能和改进，Vulkan SC 1.0 适用于安全关键系统 |
| 表现 | 基于 Vulkan 构建，性能比 WebGL 更好，CPU/GPU 使用率更均衡 | 提供更高的性能、更低的 CPU 占用率，支持在多个 CPU 核心之间分配工作 |
| 未来的承诺 | 有望成为 Web 开发人员在安全性、性能和可移植性方面的首选 | H.264、H.265 完全加速解码，可移植性 |
WebGPU 是什么？它适合谁使用？
WebGPU 是一种专为图形和机器工作负载而设计的高级 API。它的出现是为了解决 WebGL（一种基于浏览器的 GPU API，于 2011 年推出）的局限性，并将当代 GPU 的功能引入网络。它旨在为寻求卓越实时数据处理和视觉效果卓越的网络元素的开发人员和组织提供服务。
WebGPU 由 Apple、Google、Mozilla、Microsoft 和 Intel 自 2017 年以来合作开发，基于 Vulkan 构建。它目前可在 ChromeOS、macOS 和 Windows 上的 Chrome 113 上使用，而其他平台仍在筹备中。
1. WebGPU 的优点
- 解决 WebGL 限制
- 高效的 GPU 硬件接口
- 最佳计算资源管理
- 减少过多 JavaScript 调用的开销
- 提供灵活的编程模型
- 支持在 GPU 上移植算法类
2. WebGPU的缺点
- 仍处于早期发展阶段
- 当前默认禁用
- 未来平台可用性仍不明确
Vulkan 是什么？它适合谁使用？
Vulkan 是一种跨平台的行业标准图形 API，为开发人员提供了一个针对各种设备的平台。它经常进行扩展和添加，并且不断改进。Vulkan 适合那些需要在图形编程中控制调度、同步和内存分配的开发人员。
Vulkan 生态系统还拥有潜在的关键实用程序，例如 Vulkan Portability 和 Vulkan SC 1.0 规范，它们可满足安全关键型系统的需求，简化图形和计算需求。此外，它是第一个具有正式内存模型的图形 API。
1. Vulkan 的优点
- 跨平台特性
- 频繁的扩展和改进
- 有效控制图形编程的关键方面
- 对抗平台碎片化的潜力
- 第一个具有正式内存模型的图形 API
2. Vulkan的缺点
- 不保证部署时间表和设备支持
- 复杂 3D 模型的问题
WebGPU 和 Vulkan 的代码示例
1. WebGPU 3D 环面（Torus）
此代码说明了如何使用 WebGPU API 生成 3D 圆环。此示例需要支持 WebGPU 实验功能的现代网络浏览器。
// Create canvas and get WebGPU context
let canvas = document.createElement('canvas');
let context = canvas.getContext('gpupresent');
// Create a GPU device
let adapter = await navigator.gpu.requestAdapter();
let device = await adapter.requestDevice();
// Create a GPU buffer
let buffer = device.createBuffer({
size: VERTEX_SIZE * NUM_VERTICES,
usage: GPUBufferUsage.VERTEX,
mappedAtCreation: true
});
// Generate a 3D Torus
let vertices = new Float32Array(NUM_VERTICES * VERTEX_PER_QUAD);
for(let i = 0; i < NUM_VERTICES; i++) {
let quadPos = i % VERTEX_PER_QUAD;
let pos = [quadPos & 2, quadPos & 1];
vertices.set(pos, i * VERTEX_SIZE / 4);
}
// Unmap buffer and create a vertex buffer layout
buffer.unmap();
let vertexBuffers = [{arrayStride: VERTEX_SIZE, attributes: [{offset: 0, format: 'float32x4', shaderLocation: 0}]}];
2. Vulkan 三角形渲染
此示例演示了一个可以渲染简单三角形的基本 Vulkan 程序。请确保您的环境中已设置 Vulkan SDK，并了解 Vulkan API 的基本概念，例如命令缓冲区、交换链和管道。
// Include Vulkan
#include <vulkan/vulkan.h>
// Create an instance
VkApplicationInfo appInfo = {};
appInfo.pApplicationName = "Hello Triangle";
appInfo.applicationVersion = VK_MAKE_VERSION(1, 0, 0);
appInfo.pEngineName = "No Engine";
appInfo.engineVersion = VK_MAKE_VERSION(1, 0, 0);
appInfo.apiVersion = VK_API_VERSION_1_0;
VkInstanceCreateInfo createInfo = {};
createInfo.sType = VK_STRUCTURE_TYPE_INSTANCE_CREATE_INFO;
createInfo.pApplicationInfo = &appInfo;
uint32_t glfwExtensionCount = 0;
const char** glfwExtensions;
glfwExtensions = glfwGetRequiredInstanceExtensions(&glfwExtensionCount);
createInfo.enabledExtensionCount = glfwExtensionCount;
createInfo.ppEnabledExtensionNames = glfwExtensions;
createInfo.enabledLayerCount = 0;
if (vkCreateInstance(&createInfo, nullptr, &instance) != VK_SUCCESS) {
throw std::runtime_error("failed to create instance!");
}
WebGPU 与 Vulkan：决战判决（The Showdown Verdict）
图形 API 战场上，WebGPU 和 Vulkan 两大巨头相互对峙。根据您的使用情况和需求，其中一个可能会胜过另一个。以下是我们对不同受众群体的判断。
1. 寻求利用现代硬件功能的开发人员
如果您希望利用现代 GPU 硬件的功能，WebGPU 就是您的好帮手。它由技术巨头共同开发，反映了现代 GPU 硬件的功能，并通过其计算着色器提供了灵活的编程模型。WebGPU 还附带了流行的 JavaScript WebGL 库中正在开发的端口，使其成为开发人员的潜在首选。
2. 需要高灵活性和控制力的 AR/VR 创作者
对于那些寻求完全控制内存分配、调度和同步的人来说，Vulkan 是无与伦比的。它的持续发展为开发人员提供了令人难以置信的灵活性和改进能力。除了完全加速的 H.264 和 H.265 解码外，它还是需要高灵活性和控制力的 AR/VR 创作者的资源。
3. 游戏制造商追求高性能
WebGPU在高性能游戏领域被视为一个有前途的竞争者。它基于Vulkan构建，并且在CPU/GPU使用方面比WebGL表现得更加均衡。此外，它允许游戏开发者将多种算法移植到GPU上，从而实现WebGL时代难以想象的卓越视觉效果。
结论：
在图形 API 的较量中，两者势均力敌。在与 GPU 硬件的现代、高效交互方面，WebGPU 胜出。但在广泛的设备支持和控制方面，Vulkan 无人能敌。这一切都取决于您的预期应用。