npm install react-native-reanimated

More powerful alternative to Animated library for React Native.

About react-native-reanimated

React Native Reanimated is a robust alternative to the standard Animated library, designed specifically for enhancing animations in React Native applications. This npm package, meticulously developed by Software Mansion, offers a more powerful and flexible solution for handling complex animations. By utilizing JavaScript along with native capabilities, React Native Reanimated provides a smoother and more efficient animation experience that is crucial for creating dynamic and responsive user interfaces. Its ability to run animations on the UI thread without crossing the bridge into JavaScript thread ensures that animations remain smooth even when the JavaScript thread is busy, making it a superior choice for performance-sensitive applications.

To integrate React Native Reanimated into your project, simply execute the "npm install react-native-reanimated" command in your project's root directory. This straightforward installation process adds the library to your React Native environment, allowing you to immediately begin enhancing your application with high-performance animations. React Native Reanimated supports declarative animations and gesture-based interactions, which are essential for modern mobile apps that prioritize user experience and interface fluidity. The library's extensive API also supports backward compatibility with the original Animated API, providing a seamless transition and easy adoption for existing projects that require improved animation capabilities.

React Native Reanimated is continuously updated to support the latest versions of React Native, ensuring developers have access to the most cutting-edge tools for animation development. Its commitment to performance optimization and enhancing the visual appeal of mobile applications makes it an invaluable asset for developers looking to push the boundaries of what's possible with React Native animations. Whether you're building a new app or upgrading an existing one, React Native Reanimated is the go-to solution for implementing high-quality, smooth animations that can transform user interaction and engagement.

More from software-mansion

software-mansion npm packages

Find the best node modules for your project.

Search npm

react-native-gesture-handler

Experimental implementation of a new declarative API for gesture handling in...

Read more
,

react-native-reanimated

More powerful alternative to Animated library for React Native...

Read more

Dependencies

Core dependencies of this npm package and its dev dependencies.

@babel/plugin-transform-arrow-functions, @babel/plugin-transform-nullish-coalescing-operator, @babel/plugin-transform-optional-chaining, @babel/plugin-transform-shorthand-properties, @babel/plugin-transform-template-literals, @babel/preset-typescript, convert-source-map, invariant, @babel/cli, @babel/core, @babel/preset-env, @babel/types, @react-native/babel-preset, @react-native/eslint-config, @react-native/metro-config, @react-native/typescript-config, @testing-library/jest-native, @testing-library/react-hooks, @testing-library/react-native, @types/babel__core, @types/babel__generator, @types/babel__traverse, @types/convert-source-map, @types/invariant, @types/jest, @types/node, @types/react, @types/react-test-renderer, @typescript-eslint/eslint-plugin, @typescript-eslint/parser, @typescript-eslint/rule-tester, axios, babel-eslint, babel-jest, babel-plugin-module-resolver, clang-format, code-tag, cspell, eslint, eslint-config-prettier, eslint-config-standard, eslint-import-resolver-babel-module, eslint-plugin-import, eslint-plugin-jest, eslint-plugin-n, eslint-plugin-no-inline-styles, eslint-plugin-promise, eslint-plugin-react-hooks, eslint-plugin-standard, eslint-plugin-tsdoc, husky, jest, lint-staged, madge, prettier, react, react-native, react-native-builder-bob, react-native-gesture-handler, react-native-web, react-test-renderer, shelljs, ts-prune, typescript

Documentation

A README file for the react-native-reanimated code repository. View Code

React Native Reanimated by Software Mansion

React Native's Animated library reimplemented

Reanimated 3 is here! Check out our documentation page for more information

React Native Reanimated provides a more comprehensive, low level abstraction for the Animated library API to be built on top of and hence allow for much greater flexibility especially when it comes to gesture based interactions.

Nightly CI state

Build nightly npm package Run nightly monorepo test Check static framework nightly build Check React Native nightly build Check Expo dev-client nightly build Check TypeScript nightly build Test V8 on Android nightly Test build on Windows nightly Validate urls in source code

Installation

Check out the installation section of our docs for the detailed installation instructions.

Fabric

To learn how to use react-native-reanimated with Fabric architecture, head over to Fabric README. Instructions on how to run Fabric Example within this repo can be found in the FabricExample README.

Documentation

Check out our dedicated documentation page for info about this library, API reference and more: https://docs.swmansion.com/react-native-reanimated/

Examples

The source code for the example (showcase) app is under the Example/ directory. If you want to play with the API but don't feel like trying it on a real app, you can run the example project. Check Example/ directory README for installation instructions.

License

Reanimated library is licensed under The MIT License.

Credits

This project has been built and is maintained thanks to the support from Shopify, Expo.io and Software Mansion

shopify expo swm

Community Discord

Join the Software Mansion Community Discord to chat about Reanimated or other Software Mansion libraries.

Reanimated is created by Software Mansion

Since 2012 Software Mansion is a software agency with experience in building web and mobile apps. We are Core React Native Contributors and experts in dealing with all kinds of React Native issues. We can help you build your next dream product – Hire us.