Three Best Practices

A comprehensive reference that packs 120+ Three.js optimization rules across 22 categories, from critical memory disposal patterns to WebGPU and TSL best practices. Pulls from the official Three.js llms branch and Utsubo's 100 Tips guide. The priority system is genuinely useful: it separates fundamental setup from critical render loop fixes and lower impact tweaks. If you're writing Three.js code in Claude, this gives you specific rule names like `memory-dispose-geometry` and `draw-call-optimization` to reference. The asset compression section alone (Draco, KTX2, Meshopt) could save you hours of research. It's dense but well organized, and the quick reference makes it scannable when you just need to check if you're doing something stupid with shadow maps or shader precision.

skills.sh installs: 1.6K
GitHub stars: 68
last updated: Aug 21, 2026

View on GitHub

Install

$ npx -y skills add emalorenzo/three-agent-skills --skill three-best-practices --agent claude-code

Installs into .claude/skills of the current project.

Files

Three.js Best Practices

Comprehensive performance optimization guide for Three.js applications. Contains 120+ rules across 18 categories, prioritized by impact.

Sources & Credits

This skill compiles best practices from multiple authoritative sources:

Official guidelines from Three.js llms branch maintained by mrdoob

100 Three.js Tips by Utsubo - Excellent comprehensive guide covering WebGPU, asset optimization, and performance tips