motion-three-r3f
motion-three-r3f
Catalogue généré le 2026-05-11
En une phrase
Motion 3D : Three.js + React Three Fiber.
Quand l'utiliser
- Voir la description ci-dessus et la section « Pour aller plus loin ».
Comment l'invoquer
- Slash command :
/motion-three-r3f(si exposé dans ton CLI) - Phrases déclencheurs : voir la description complète ci-dessous
- Auto-invocation : sur demande explicite
Description complète
Motion 3D : Three.js + React Three Fiber. Render loop, frameloop demand, invalidate, useFrame, et règles de perf pour hero WebGL.
Pour aller plus loin
Three.js / R3F Motion
Objectif
3D utile + loop maîtrisée + perf.
Procédure
- Valider nécessité 3D
- Loop: setAnimationLoop / frameloop demand + invalidate
- useFrame unique logique; pas de rAF multiples
- Cleanup/dispose
Outputs attendus
- Archi recommandée
- Snippets Canvas + frameloop/invalidate + useFrame
- Checklist perf
Hints
- Install: npm install three @react-three/fiber
Source
- Plugin :
perso (standalone) - Nom interne :
motion-three-r3f - Fichier :
/home/thymon/.claude/skills/motion-three-r3f/SKILL.md