React Native Reanimated
High-performance animation library for React Native that runs animations on the UI thread, not the JS thread. Uses 'worklets' — JavaScript functions that execute on the native UI thread — for smooth 60/120fps animations without JS bridge overhead. Works with React Native Gesture Handler for gesture-driven animations. The standard for smooth animations in production React Native apps, powering gesture-based UI in Shopify, Coinbase, and others.
Score Breakdown
⚙ Agent Friendliness
🔒 Security
Animation library — no security surface. Software Mansion maintains. Native code execution on UI thread is sandboxed within app process.
⚡ Reliability
Best When
You need smooth gesture-driven animations or complex animation sequences in React Native that must run without JS thread interference.
Avoid When
You need simple opacity/scale transitions — React Native's built-in Animated API is sufficient and has less setup complexity.
Use Cases
- • Build smooth gesture-driven animations for agent mobile UIs — swipe-to-complete, drag-to-reorder, pinch-to-zoom without JS thread jank
- • Create animated agent status indicators, progress bars, and transition animations that run at 60fps regardless of JS thread load
- • Implement smooth list item animations in agent task lists using react-native-reanimated with FlatList or FlashList
- • Build bottom sheets and modal transitions for agent interaction flows using @gorhom/bottom-sheet (Reanimated-based)
- • Use shared element transitions between agent screens with Reanimated 3's layout animation API
Not For
- • Simple opacity/scale animations — Animated API built into React Native is sufficient for basic animations without Reanimated overhead
- • Web-only React applications — Reanimated is React Native only; use Framer Motion or CSS animations for web
- • Complex particle systems or canvas-based animations — use react-native-skia for GPU-accelerated 2D canvas rendering
Interface
Authentication
Animation library — no authentication.
Pricing
Software Mansion open source. MIT license.
Agent Metadata
Known Gotchas
- ⚠ Worklet functions must be annotated with 'worklet' directive — forgetting 'worklet' at the top of functions called from UI thread causes 'calling from worklet' runtime errors
- ⚠ useAnimatedStyle hook must not call non-worklet functions — calling regular JS functions from useAnimatedStyle causes 'worklet context' errors; all called functions need 'worklet' directive
- ⚠ Reanimated 3 requires specific Babel plugin configuration — missing 'react-native-reanimated/plugin' in babel.config.js causes worklet compilation to silently fail and animations don't run on UI thread
- ⚠ SharedValue reads in render functions are reactive — accessing .value in JSX re-renders the component unnecessarily; use animated components (Animated.View) to isolate animation updates
- ⚠ layout animations (entering/exiting) don't work inside FlatList items without explicit enableLayoutAnimations() call — forgetting this causes layout animations to be silently ignored
- ⚠ Expo Go has limited Reanimated support — some advanced Reanimated features require a development build; don't rely on Expo Go for production animation testing
Alternatives
Full Evaluation Report
Detailed scoring breakdown, competitive positioning, security analysis, and improvement recommendations for React Native Reanimated.
Scores are editorial opinions as of 2026-03-06.