GPU 上的生命游戏

规则

每个细胞看周围 8 个邻居：活细胞有 2 或 3 个活邻居就存活，空格恰好有 3 个活邻居就诞生，其余死亡。这里额外记录年龄：值大于 0 表示活了几代，小于 0 表示刚死去、正在淡出的“幽灵”。

为什么需要乒乓缓冲

下一代的每个细胞都依赖上一代的邻居。如果原地更新，一个线程写入时，隔壁线程可能还没读完旧值，结果就乱了。解决办法是两个缓冲：这一代读 A 写 B，下一代读 B 写 A。

pass.setBindGroup(0, stepBG[cur]);   // [0]: 读 A 写 B；[1]: 读 B 写 A
pass.dispatchWorkgroups(Math.ceil(W / 8), Math.ceil(H / 8));
cur = 1 - cur;

两个绑定组提前建好，每代只切换下标，几乎没有开销。

二维工作组

@workgroup_size(8, 8) 是 64 个线程排成 8×8 的方块，调度也是二维的。线程坐标这样算：

let x = wg.x * 8u + lid % 8u;
let y = wg.y * 8u + lid / 8u;

这就是 global_invocation_id.xy：工作组位置乘以 8，加上组内位置。这里的除法和取模都是对常量 8，编译器会变成位运算。边界环绕用 select 而不是取模，既省事又避免运行时整数除法。

实例化绘制网格

渲染时 draw(6, W * H)：每个细胞一个方块实例。顶点着色器由 instance_index 推出 (x, y)，从缓冲读出细胞值，按年龄映射颜色：新生是黄色，然后薄荷绿、青色，最老的是紫色。空细胞被推到屏幕外，不产生片元。

节奏

generations / s 决定每秒演化几代；一帧最多跑 4 代，多个计算 pass 录进同一个命令缓冲。在途帧数依旧用 onSubmittedWorkDone 限制在 2 帧，GPU 忙不过来时宁可跳帧也不让队列积压。