WebGPU是一门神奇的技术,在浏览器支持率0%,标准还没有定稿的情况下,就已经被Three.js和Babylon.js等主流3D和游戏框架支持了。而且被Tensorflow.js用来加速手机端的深度学习,比起WebGL能带来20~30倍的显著提升。
在主流框架中 WebGPU 的例子
1、在Three.js中使用WebGPU
使用Three.js的封装,我们可以直接生成WebGPU的调用。
我们照猫画虎引入WebGPU相关的库:
剩下就跟普通的WebGL代码写起来差不多:
只不过渲染器使用WebGPURenderer:
如果封装的不能满足需求了,我们可以使用WGSL语言进行扩展:
WGSL是WebGPU进行GPU指令编程的语言。类似于OpenGL的GLSL, Direct3D的HLSL。
我们来看一个完整的例子,显示一个跳舞的小人,也不过100多行代码:
2、在Babylon.js中使用WebGPU
Babylon.js的封装与Three.js大同小异,我们来看个PlayGround的效果:
3、用WebGPU进行深度学习加速
除了3D界面和游戏,深度学习的推理器也是GPU的重度用户。所以Tensorflow.js也在还落不了地的时候就支持了WebGPU。实在是计算着色器太重要了。
写出来的加速代码就像下面一样,很多算子的实现最终是由WGSL代码来实现的,最终会转换成GPU的指令。
参考:https://developer.aliyun.com/article/932061
>>WebGL和WebGPU:https://www.zhihu.com/question/315103318