给 3D 场景装物理，Rapier 把确定性带进浏览器

Three.js 把 3D 场景画出来了，但场景里的东西还都是悬空的，不会掉、不会撞、不会塌。补上这一块的是 Rapier，本系列第 10 个工具。它的官方定位一句话值得念一遍：为游戏、动画和机器人打造的 2D 与 3D 物理引擎，animation 直接写进了使命里。内核用 Rust 写成，编成 WebAssembly 在浏览器里跑，仓库 6 千星、Apache-2.0 协议，README 里写着 forever free and open-source。JS 侧的接入包是 @dimforge/rapier3d-compat，最新版 0.21.0。

一、Rust 内核，WASM 过桥

和 Matter.js 这类纯 JS 引擎不同，Rapier 的模拟核心跑在 WASM 里，碰撞检测和求解器的性能上限高出一截，这也是它被大型项目和游戏引擎看中的原因。crates 分成 rapier2d 和 rapier3d，各自还有 f64 精度变体。

JS 绑定的 compat 版把 WASM 二进制直接内嵌，前端项目不用额外配置 WASM 加载管线，装上就能用。React Three Fiber 的用户有现成的 @react-three/rapier（npm 上已到 2.2.0），声明式地把物理体挂到 3D 组件上。

二、和 Matter.js 怎么分工

两个引擎经常被拿来比，实际分工挺清楚：轻量 2D 场景、交互原型，Matter.js 的 API 更友好；刚体数量大、要 3D、要长时间稳定模拟，Rapier 是性能上限更高的那个。它官网首页列的卖点里有一条对出片流水线特别关键：determinism，确定性。同样的初条件和固定步长，模拟结果一致。

这一点正是浏览器物理引擎的稀缺品：实时引擎普遍用钟表时间驱动，渲染两次帧对不齐。Rapier 把确定性当设计目标，配合自己控制的步进节奏，序列帧渲染的麻烦少一半。

三、放进出片流水线

实践上就是三件套：Three.js 管画面，Rapier 管模拟，Remotion 管时间线。相机和物体关键帧挂帧号，物理世界按固定步长推进，每帧渲染前同步一次位姿。倒塌的塔、碰撞的 logo、多米诺机关，这类「编排不出来的运动」都交给它算。

系列还剩两个画面向工具，下一篇是 OGL，一个 4.7 千星的极简 WebGL 库，着色器玩家的心头好。