threejs-performance
Installation
SKILL.md
Three.js 性能优化指南
黄金法则
绘制调用 < 100 次/帧。 三角形数量不如绘制调用数量重要;超过 500 次绘制调用,强大 GPU 也会吃力。用 renderer.info.render.calls 监控(完整监控代码见 references/examples.md)。
诊断决策树
| 症状 | 先查 | 深入 |
|---|---|---|
| 掉帧、卡顿 | renderer.info.render.calls 是否 >100 |
实例化/合批(下文),后处理链 |
| 内存持续增长 | renderer.info.memory 的 geometries/textures 计数是否只增不减 |
dispose 铁律(下文),references/examples.md 完整清理代码 |
| 加载慢、显存爆 | 模型是否未压缩 | references/assets.md 压缩管线 |
| 粒子/物理瓶颈 | CPU 粒子是否 >5 万 | WebGPU 计算着色器,references/webgpu.md |
| R3F 项目莫名重渲染 | useFrame 里是否 setState | R3F 三规则(下文) |