react-native
Layer 2 — Framework Pack
React Native patterns for the New Architecture era (0.76+). Fabric, TurboModules,
Expo, navigation, and the mistakes agents make from old Bridge-era training data.
Philosophy
React Native underwent a fundamental architectural shift. The old Bridge
(async JSON serialization between JS and native) is replaced by JSI (direct
synchronous C++ references). Fabric replaces the old UI Manager. TurboModules
replace legacy Native Modules. Starting from RN 0.82, the New Architecture
is always-on and can't be disabled.
LLMs trained on 2018-2023 content produce Bridge-era patterns: old lifecycle
methods, legacy navigation libraries, manual native module boilerplate. This
pack establishes New Architecture as the baseline and corrects stale patterns.
What's Included
| Type |
Files |
Coverage |
| Patterns |
7 |
New Architecture, Expo workflow, navigation, state management, native modules, lists, styling |
| Anti-patterns |
5 |
Bridge-era patterns, wrong navigation library, blocking JS thread, inline styles everywhere, unnecessary native modules |
| Constitution |
1 |
5 React Native-specific principles |
| Gate |
1 |
RN pattern compliance check |
Stack Integrations (detection-gated)
When expo is detected, read integration/expo-integration.md for the Expo +
React Navigation + Zustand + MMKV + TanStack Query seams — navigation guards,
store hydration, offline cache, and Expo Router auth flows — that the individual
docs don't cover together. This folds in the former stack-react-native-expo
skill; the content is unchanged.
Constitution: constitution/expo.constitution-additions.md ·
anti-patterns: anti-patterns/expo-anti-patterns.md.
1---2name: react-native3description: React Native patterns — New Architecture (Fabric/TurboModules), Expo, navigation, performance4---56# react-native78**Layer 2 — Framework Pack**910React Native patterns for the New Architecture era (0.76+). Fabric, TurboModules,11Expo, navigation, and the mistakes agents make from old Bridge-era training data.1213## Philosophy1415React Native underwent a fundamental architectural shift. The old Bridge16(async JSON serialization between JS and native) is replaced by JSI (direct17synchronous C++ references). Fabric replaces the old UI Manager. TurboModules18replace legacy Native Modules. Starting from RN 0.82, the New Architecture19is always-on and can't be disabled.2021LLMs trained on 2018-2023 content produce Bridge-era patterns: old lifecycle22methods, legacy navigation libraries, manual native module boilerplate. This23pack establishes New Architecture as the baseline and corrects stale patterns.2425## What's Included2627| Type | Files | Coverage |28|------|-------|----------|29| Patterns | 7 | New Architecture, Expo workflow, navigation, state management, native modules, lists, styling |30| Anti-patterns | 5 | Bridge-era patterns, wrong navigation library, blocking JS thread, inline styles everywhere, unnecessary native modules |31| Constitution | 1 | 5 React Native-specific principles |32| Gate | 1 | RN pattern compliance check |3334## Stack Integrations (detection-gated)3536When `expo` is detected, read `integration/expo-integration.md` for the Expo +37React Navigation + Zustand + MMKV + TanStack Query seams — navigation guards,38store hydration, offline cache, and Expo Router auth flows — that the individual39docs don't cover together. This folds in the former `stack-react-native-expo`40skill; the content is unchanged.41Constitution: `constitution/expo.constitution-additions.md` ·42anti-patterns: `anti-patterns/expo-anti-patterns.md`.
xoai