Motion (anciennement Framer Motion)
J'utilise Motion parce que mes animations React sortent fluides en 5 lignes au lieu d'un trip CSS keyframes, gestes, transitions, layout shift, tout est typé et déclaratif. La bibliothèque s'appelait Framer Motion : elle a quitté Framer, vit sur motion.dev, et le paquet à installer s'appelle désormais `motion`. Elle ne sert plus seulement React, une API vanilla couvre le reste.
Forces
- API déclarative, `motion.div` remplace les keyframes CSS, propriétés animables typées
- Gestes natifs (drag, hover, tap) sans librairie additionnelle
- Layout animations automatiques, éléments qui se réorganisent fluidement
- Socle des bibliothèques de composants animés à copier-coller : Kokonut UI, par exemple, est construite dessus. Connaître Motion, c'est savoir retoucher ce que tu y pioches au lieu de le subir
Limites
- Bundle size non-trivial pour des micro-animations, overkill sur landings statiques
- Performance dégradée avec des dizaines de composants animés en parallèle sans optimisation
Pour qui
- Sites web React qui doivent bouger sans coder du CSS keyframes ad hoc
- Apps avec micro-interactions, transitions de pages, et drag-and-drop fluides
- Vibecoders qui veulent un site qui claque sans freelance design