react-native-best-practices

Original：🇺🇸 English

Translated

React Native & Expo engineering standards.

1installs

Added on2026-02-10

NPX Install

npx skill4agent add dokhacgiakhoa/antigravity-ide react-native-best-practices

Goal: Build "Write Once, Run Everywhere" mobile apps that feel 100% native.

File-based Routing: Use
```
app/
```
directory similar to Next.js.
Linking: Define schemes in
```
app.json
```
for deep linking.
Layouts: Use
```
_layout.tsx
```
for shared navigation wrappers (Stack, Tabs).

NativeWind: Use
```
nativewind
```
(Tailwind for RN) for styling. It's faster and more familiar.
FlashList: Replace
```
FlatList
```
with Shopify's
```
FlashList
```
for 5x performance on long lists.
Safe Area: Always wrap screen content in
```
SafeAreaView
```
(or use spacing tokens that account for insets).

Image Caching: Use
```
expo-image
```
instead of React Native's
```
<Image />
```
.
- Features: Blurhash, caching, preloading.
Reanimated: Use
```
react-native-reanimated
```
for 60fps animations (runs on UI thread), avoiding the JS bridge.
Hermes: Ensure Hermes engine is enabled in
```
app.json
```
for faster startup and smaller bundle size.

TanStack Query (React Query): Standard for async server state. Handle
```
offline
```
status gracefully.
MMKV: Use
```
react-native-mmkv
```
for synchronous local storage (replacing Async Storage). It is ~30x faster.

EAS Build: Use Expo Application Services (EAS) for cloud builds.
Expo Go: Use for rapid prototyping, but switch to "Development Build" (Prebuild) if adding native modules.

Checklist: