2026.07.11
百万粒子的呼吸：GPGPU 粒子系统从 0 到 1
一万颗粒子靠 BufferGeometry 就够了，一百万颗呢？这篇付费长文完整推导 GPGPU/FBO 粒子管线：把位置存进浮点纹理、用片元着色器算物理、双缓冲 ping-pong 更新，再让 curl noise 赋予粒子群「呼吸感」。附完整可运行的 R3F 实现骨架。
这个博客首页的星系有一万颗粒子，每颗的旋转都在顶点着色器里实时计算。但顶点着色器有个天花板：粒子之间没有记忆，也没有交互——每一帧的位置都是从初始位置用公式推出来的，粒子不能「记住」自己上一帧在哪，更不能对鼠标、对彼此做出反应。
想让一百万颗粒子像鸟群一样避开你的光标、像烟雾一样被风场卷起、像星云一样缓慢坍缩，你需要把物理模拟也搬进 GPU。这就是 GPGPU（General-Purpose GPU）粒子系统。
你将读到什么
- 为什么顶点着色器动画有天花板：无状态计算的本质局限
- 核心思想转换：把「位置」当成一张浮点纹理来读写
- FBO ping-pong 双缓冲：模拟着色器每帧如何演进粒子状态
- curl noise 的直觉推导：为什么它能生成无发散的「风场」，让粒子群产生呼吸感
- 鼠标斥力场、目标形状回归（morphing）两种交互的实现
- R3F 完整工程骨架：
useFBO、数据纹理初始化、渲染循环接线 - 一百万粒子的性能预算表：什么设备跑得动，怎么降级
全文约 6800 字，代码可直接跑起来。下一代后端（WebGPU compute）与节点材质迁移账本，见《从 GLSL 到 WebGPU/TSL》。以下是完整推导——