React Native Development Rules

Component Performance

• FlatList for any list over 10 items — ScrollView with map loads everything in memory, FlatList virtualizes
• keyExtractor must return stable unique strings — using index causes bugs on reorder and deletion
• React.memo prevents re-renders when props unchanged — wrap pure display components
• useCallback for functions passed to child components — new function reference triggers child re-render
• Avoid inline styles in render — creates new object every render, extract to StyleSheet.create

State Management

• useState is fine for component-local state — don't add Redux/Zustand for a toggle
• Lift state to lowest common ancestor only — higher causes unnecessary re-renders
• useMemo for expensive computations — but don't overuse, caching has overhead
• Context re-renders all consumers on any change — split contexts by update frequency
• Avoid storing derived data in state — compute during render from source state