DEV Community 👩‍💻👨‍💻

Rupak Dey
Rupak Dey

Posted on • Updated on

REACT ANIMATION - Animation Libraries for React.js

Framer Motion

  • JavaScript library
  • Relatively new
  • Easiest, feature rich & production ready
npm i framer-motion
Enter fullscreen mode Exit fullscreen mode

React Reveal

  • Based on the popular css animation library animation.css
  • Primarily used to show and/or hide DOM elements
npm i react-reveal
Enter fullscreen mode Exit fullscreen mode

React Motion

  • React specific animation library
  • Based on real physics
  • Uses sniffing and dumping
npm i react-motion
Enter fullscreen mode Exit fullscreen mode

React Spring

  • Inspired by react-motion
  • Attempts to improve performance over react-motion
npm i react-spring
Enter fullscreen mode Exit fullscreen mode

React Anime

  • React wrapper for the popular library Anime.js
  • All the functionalities wrapped into their declarative form
npm i react-anime
Enter fullscreen mode Exit fullscreen mode



Worked with other cool libraries? Share in the comment section below!



Connect with me : Github | Tutoring | Freelance Web Dev

Top comments (2)

Collapse
 
moniruzzamansaikat profile image
Moniruzzaman Saikat

Thank you

Collapse
 
deyrupak profile image
Rupak Dey Author

I'm glad it proved to be useful!

🌚 Life is too short to browse without dark mode