WebGPU 介绍

https://www.toutiao.com/article/7221930629695914496/

官网:http://webgpu.io/

webGPU资讯:

https://gpuweb.github.io/gpuweb/

Github:https://github.com/gpuweb/gpuweb

WebGPU 的名称由来

下一代的 Web 图形接口不叫 WebGL 3.0 的原因,你清楚了吗?已经不是 GL 一脉的了,为了使现代巨头在名称上不打架,所以采用了更贴近硬件名称的 WebGPU,WebGPU 从根源上和 WebGL 就不是一个时代的,无论是编码风格还是性能表现上。

题外话,OpenGL 并不是没有学习的价值,反而它还会存在一段时间,WebGL 也一样。

WebGPU 是一种新的网络图形 API,它具有显著的优势,它遵循现代计算机图形 API的架构,例如Vulkan、DirectX 12和Metal。Web 图形 API 范式的这种转变允许用户利用原生图形 API 带来的相同好处:由于能够让 GPU 保持忙碌的工作,更快的应用程序,更少的图形驱动程序特定的错误,以及新功能的潜力。将来实施。

WebGPU 可以说是 Web 上所有渲染 API 中最复杂的,尽管这一成本被 API 提供的性能提升和对未来支持的保证所抵消。这篇文章旨在揭开 API 的神秘面纱,让我们更容易拼凑出如何编写使用它的 Web 应用程序。

例如大大减少相同图形的 JavaScript 工作量,以及机器学习模型推断的三倍以上的改进。WebGPU 的初始版本可以在 ChromeOS、macOS 和 Windows 上使用。对其他平台的支持将于今年晚些时候推出。

广泛的平台支持 WebGPU:

Google Chrome:WebGPU 在 Chrome 中作为原始试用版提供。目前 Android 版 Chrome Canary 不支持 WebGPU。
Mozilla Firefox:您必须使用 Beta 或 Nightly 频道。Firefox Nightly for Android 支持 WebGPU,尽管它们的实现似乎缺少一些功能。
Microsoft Edge:WebGPU 目前可通过他们的金丝雀版本获得,但功能上与 Chrome 相同。
Apple Safari:Safari 团队正在致力于在桌面上支持 WebGPU,但在移动方面没有任何消息。
如下图:

WebGPU 浏览器支持

WebGPU 的初始版本可在支持 Vulkan 的 ChromeOS 设备、支持 Direct3D 12 的 Windows 设备和 macOS 的 Chrome 113 中使用。Linux、Android 和对现有平台的扩展支持即将推出。

除了在 Chrome 中的初步实现之外,目前在 Firefox 和 Safari 中正在开发 WebGPU。

WebGPU 库支持

许多广泛使用的 WebGL 库已经在实施 WebGPU 支持的过程中或已经这样做了。这意味着使用 WebGPU 可能只需要进行一行更改:

Babylon.js已经完全支持 WebGPU.
官网:https://babylonjs.com/

在线演示:

https://playground.babylonjs.com/#YX6IB8#73

Github:https://github.com/BabylonJS/Babylon.js

Babylon 的使命是创建世界上最强大、最漂亮、最简单的Web渲染引擎之一。我们的热情是让它对每个人都完全开放和免费。我们是艺术家、开发人员、创作者和梦想家,我们希望尽可能简单,让每个人都能将自己的想法付诸实践。这是Babylon.js平台的一个重要里程碑。Babylon.js是带着对有史以来最伟大的科幻节目之一的深深热爱和钦佩而命名的,我们很高兴地宣布推出下一版本的Babylon.jsp平台。Babylon.js 5.0是迄今为止该平台最大、最大胆、最雄心勃勃的更新。从对WebGPU的全面支持,到使用Native Capabilities跨平台部署体验的能力,再到数不胜数的工具、功能和改进,Babylon.js 5.0为每个人带来了下一代网络渲染技术。

如下图:

PlayCanvas 宣布了最初的 WebGPU 支持。

官网:

https://playcanvas.github.io/

WebGPU是一项尖端技术,有望彻底改变3D图形在网络上的处理方式。作为WebGL的继任者,WebGPU为复杂的3D图形和模拟提供了更快、更高效的渲染功能。

PlayCanvas一直处于这项新技术的前沿,并一直致力于为其平台添加WebGPU支持。

有了WebGPU,我们可以期待未来在网络上看到更多身临其境和交互式的3D体验。

如下图:

TensorFlow.js支持大多数运算符的 WebGPU 优化版本。

官网:

https://js.tensorflow.org/

Github:https://github.com/tensorflow/tfjs

TensorFlow.js是一个开源的硬件加速JavaScript库,用于训练和部署机器学习模型。

在浏览器中开发ML
使用灵活直观的API,使用低级JavaScript线性代数库或高级层API从头开始构建模型。

在Node.js中开发ML
在Node.js运行时下使用相同的TensorFlow.js API执行原生TensorFlow。

运行现有模型
使用TensorFlow.js模型转换器在浏览器中运行预先存在的TensorFlow模型。

重新搜索现有模型
使用连接到浏览器的传感器数据或其他客户端数据重试预先存在的ML模型。

如下图:

Three.js WebGPU 支援正在进行中,

官网:https://threejs.org/

Github:https://github.com/mrdoob/three.js/

three.js,一个WebGL引擎,基于JavaScript,可直接运行GPU驱动游戏与图形驱动应用于浏览器。其库提供大量特性与API以绘制3D场景于浏览器。

如下图:

WebGPU 示例

在线演示:

https://webgpu.github.io/webgpu-samples

Github:https://github.com/webgpu/webgpu-samples

WebGPU示例是一组演示WebGPU API使用的示例。请在WebGPU.io上查看当前的实现状态以及如何在浏览器中运行WebGPU。

WebGPU 最佳实践

描述了使用WebGPU API各个方面的最佳实践。

需要注意的是,这些页面不是开始使用WebGPU的教程,而是专注于使用API的特定部分的最有效模式,尤其是如果您是熟悉WebGL或某个本地API的开发人员。如果你有兴趣学习WebGPU,请先查看以下资源(当你掌握了基本知识后一定会回来!)

如下图:

关于WebGPU的未来

展望宏图之类的话不说,但是随着红绿蓝三家的 GPU 技术越发精湛,加上各个移动端的 GPU 逐渐起色,三大现代图形API肯定还在发展,WebGPU 一定能在 Web 端释放现代图形处理器(GPU)的强大能力,无论是图形游戏,亦或是通用并行计算带来的机器学习、AI能力。

其实不应该只是和WebGL去对比。因为WebGPU必然将取代WebGL,这是W3C已经明显释放出来的信号。就比如我们日常使用3G,4G,5G甚至未来的6G,或者说是我们的iphoneX, iphone11, iphone12,iphone13一样。考虑到设备兼容和时间问题,WebGL也会长期存在。但是,说到根本,这些都是技术迭代升级带来的“自然选择”问题。WebGPU带来的异步特性,Compute Shader,非全局状态机,更灵活的resouce binding,甚至是未来的光线追踪等等,都是现代图形API的特性,也是WebGL无法实现的。

我们提到WebGPU的未来,更应该考虑是Web生态和Native生态的问题。尤其是面向未来,面向元宇宙时代。

WebGPU 毫无疑问会在未来取代 WebGL

Web 一直是最开放和易于传播的平台,而今天游戏、元宇宙等数字内容非常依赖 Web 平台的各种特性,但是 Web 环境中还没有跟上 DirectX12、Vulkan、Metal 等现代图形接口的变革。这一现状随着 WebGPU 标准的逐步完善,即将得到改变。这会给 Web 会带来非常振奋人心的未来可能性。

WebGPU 是由 W3C GPU for the Web 社区组所发布的规范,目标是允许网页代码以高性能且安全可靠的方式访问 GPU 功能。WebGPU 是一套为浏览器设计的次时代图形 API 标准,为了弥合各个平台图形 API 的差异性,它对 DirectX12、Vulkan、Metal 进行了融合和封装。借助 WebGPU,可以充分释放现代 GPU 硬件的强大能力,让开发者可以用 TS/JS 在 Web 端也开发媲美原生表现力的场景,实现更大型更复杂的 3D 场景表现,甚至使用现代 GPU 的通用计算能力完成之前无法想像的复杂计算任务。

文档更新时间: 2023-04-16 07:12   作者:admin