react-native-best-practices

Structured performance optimization reference for React Native apps covering FPS, bundle size, TTI, and memory.

- Organized into 9 JavaScript/React guides (profiling, lists, animations, memory), 9 native optimization guides (Turbo Modules, threading, profiling), and 9 bundling guides (tree shaking, code splitting, size analysis)

- Each reference follows a hybrid format with quick patterns/commands, impact ratings (CRITICAL/HIGH/MEDIUM), and deep-dive explanations with prerequisites and common pitfalls

- Includes problem-to-skill mapping table for fast lookup: app jank points to FPS measurement, slow startup points to TTI measurement, large bundles point to analysis tools

- Measurement-first workflow: baseline metrics before optimization, re-measure after applying fixes, validate improvement (e.g., FPS 45→60, TTI 3.2s→1.8s, bundle 2.1MB→1.6MB)

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".

Skill Format

Each reference file follows a hybrid format for fast lookup and deep understanding:

- Quick Pattern: Incorrect/Correct code snippets for immediate pattern matching

- Quick Command: Shell commands for process/measurement skills

- Quick Config: Configuration snippets for setup-focused skills

- Quick Reference: Summary tables for conceptual skills

- Deep Dive: Full context with When to Use, Prerequisites, Step-by-Step, Common Pitfalls

Impact ratings: CRITICAL (fix immediately), HIGH (significant improvement), MEDIUM (worthwhile optimization)

When to Apply