WebGPU:在浏览器中模拟 250,000 个粒子
今天是第 50 天。这是我“每天从零开始构建新技术”系列项目的最后一天。
我选择用 WebGPU 来结束这个系列。WebGPU 允许你在浏览器中完全利用 GPU 来模拟 250,000 个粒子。
你的 CPU 拥有少量高速核心,而 GPU 则拥有数千个简单核心。为了移动 250,000 个粒子,CPU 需要逐一处理,而 GPU 则可以同时处理数千个。
WebGPU 是 WebGL 的现代继任者。它使用 compute shader 在你的硬件上运行通用程序。
工作原理:
- 创建一个 device 来管理 GPU。
- 创建一个 buffer 来存储粒子的位置和速度等数据。
- 将数据一次性上传到 GPU。
- 编写一个 compute shader 来处理移动逻辑。
Compute shader 会同时为每个粒子运行相同的逻辑。数据始终保留在 GPU 上,从计算阶段转移到渲染阶段时无需离开硬件。这种速度使得模拟能够以 60fps 的帧率运行。
WebGPU 将成为浏览器内机器学习和重度计算的基础。它是未来 Web 开发的重要工具。
感谢关注这个系列。你可以在这里找到所有项目的完整存档。
完整代码:https://github.com/dev48v/webgpu-from-zero
完整文章:https://dev.to/dev48v/webgpu-i-simulated-250000-particles-entirely-on-the-gpu-in-the-browser-2o0f