animation-performance

What problem does it solve?

This Skill provides a structured, practical guide to eliminating animation jank and frame drops in React Native Reanimated by addressing common pitfalls and performance bottlenecks.

Core Features & Use Cases

• Guidelines for shared values and worklets: strategies to minimize frame drops and jank.
• Greed-free re-renders: techniques to avoid unnecessary React renders during animations.
• Performance references: curated checks and examples to apply across gestures, lists, and complex scenes.
• Use Case: When implementing a smooth-scrolling list or a complex animated UI, apply these guidelines to maintain 60fps.

Quick Start

To begin, review the prioritized guideline sections and open the references to implement the recommended patterns in your animations.