callstackincubator avatar

React Native Best Practices

The react-native-best-practices skill provides React Native developers with performance optimization guidelines covering JavaScript, native code, and bundling across FPS, time-to-interactive, bundle size, memory leaks, and animation issues. It applies to tasks involving Hermes optimization, JS thread blocking, native modules, and debugging frame drops or jank. The skill solves performance problems by offering quick patterns, commands, and configurations with impact ratings, organized by priority from critical rendering issues to medium-priority animations.

install copies · 90 days. Times the install command was copied on this site in the last 90 days, bots filtered.
11
skills.sh installs
32K
GitHub stars
1.7K
last updated
Aug 21, 2026

Install

$ npx -y skills add callstackincubator/agent-skills --skill react-native-best-practices --agent claude-code

Installs into .claude/skills of the current project.

Files

React Native Best Practices

Overview

Performance optimization guide for React Native applications, covering JavaScript/React, Native (iOS/Android), and bundling optimizations. Based on Callstack's "Ultimate Guide to React Native Optimization".

When to Apply

Reference these guidelines when:

  • Debugging slow/janky UI or animations
  • Investigating memory leaks (JS or native)
  • Optimizing app startup time (TTI)
  • Reducing bundle or app size
  • Writing native modules (Turbo Modules)
  • Profiling React Native performance
  • Reviewing React Native code for performance

Security Notes

Sponsors

Details

Repository
github.com/callstackincubator/agent-skills
Categories
Frontend Development, AI & Agent Building, Debugging, Mobile Development

More from callstackincubator/agent-skills

All 10
1software-mansion avatarargent-react-native-optimizationsoftware-mansion/argentOptimizes a React Native app by profiling first to find real bottlenecks, then sweeping for mechanical issues. Entry-point for all performance work. Use when th30.2Kskills.sh installs
2software-mansion avatarargent-react-native-app-workflowsoftware-mansion/argentStep-by-step workflows for developing or debugging React Native apps on iOS simulator or Android emulator. Use when starting the app, debugging Metro, fixing bu30Kskills.sh installs
3software-mansion avatarargent-react-native-profilersoftware-mansion/argentProfile a React Native Hermes app to measure re-render and CPU performance using argent profiler tools. Use when optimizing for performance, measuring before/af30Kskills.sh installs
4pbakaus avatarlayoutpbakaus/impeccableImprove layout, spacing, and visual rhythm. Fixes monotonous grids, inconsistent spacing, and weak visual hierarchy. Use when the user mentions layout feeling o26.4Kskills.sh installs
5flutter avatarflutter-add-widget-testflutter/skillsflutter add widget test21.8Kskills.sh installs
6millionco avatarreact-doctormillionco/react-doctorUse when finishing a feature, fixing a bug, before committing React code, or when the user types `/doctor`, asks to scan, triage, or clean up React diagnostics.21.4Kskills.sh installs