Ready to supercharge your AI agents?

Install any skill in seconds. Free to start, no credit card required.

Get Started Free →

React Native & Expo Best Practices · dokhacgiakhoa | DecimalAI

frontendby dokhacgiakhoa

React Native & Expo Best Practices

dokhacgiakhoa/react-native-best-practices

Source dokhacgiakhoa/agent-skills-4-vibe-coding-cli ↗License NOASSERTION

React Native & Expo engineering standards.

SkillScore91Maintained

Automatic

Frontend / UI pack

Last verified 8/30/2026

What it changes

Passed 21 of 23 test cases with the skill, and 20 of 23 without it.

Without skill87%

With skill91%

Checks it passed that the model alone missed

Uses NativeWind utility classes for styling components
Uses NativeWind Tailwind classes for component styling instead of StyleSheet.create

2 fixed19 passed either way1 still failing1 broke

Pass-rate lift: +4 pp
Tokens: -1%
Agent turns: 0%
Response time: -16%

Model gemini-3.6-flashMeasured 8/30/2026v121 of 23 cases passed with skill

Tokens, turns and time describe resource use, not a dollar price.

Use this skill

Save it into your project's skills folder. Claude Code picks it up in its next session.

curl -fsSL --create-dirs -o .claude/skills/dokhacgiakhoa-react-native-best-practices/SKILL.md https://app.decimal.ai/s/dokhacgiakhoa-react-native-best-practices/SKILL.md

Want it pinned and updatable? pip install "decimalai>=0.15", then decimalai skills add dokhacgiakhoa-react-native-best-practices, and start Claude Code with claude --plugin-dir "$(git rev-parse --show-toplevel)/.agents"

1 · One-time — install the CLI (docs ↗)

pip install "decimalai>=0.15"

2 · Get the skill — writes .agents/skills/dokhacgiakhoa-react-native-best-practices/ and pins it in .decimal/skills.lock

decimalai skills add dokhacgiakhoa-react-native-best-practices

No CLI? Get the same file — curl · raw file

curl -fsSL --create-dirs -o .claude/skills/dokhacgiakhoa-react-native-best-practices/SKILL.md https://app.decimal.ai/s/dokhacgiakhoa-react-native-best-practices/SKILL.md

Raw file: /s/dokhacgiakhoa-react-native-best-practices/SKILL.md ↗ · machine-readable summary at /s/dokhacgiakhoa-react-native-best-practices.json ↗

Safety checks: 3 of 3 passed

Code scan CleanIntent PassedContent Clean

See it in action

One of 2 test cases the skill fixed. Same model, same prompt, with and without the skill.

1 of 2

Prompt

I'm building a social feed screen in my React Native app that renders a long list of user posts with images, and I also need to save user settings locally. Below is my current component using standard core components and basic storage. Could you refactor this file to align with modern high-performance Expo standards and explain the structural changes?

What was checked, without and with the skill
Checked	Without skill	With skill
Replaces FlatList with FlashList for list rendering	Passed	Passed
Replaces AsyncStorage with react-native-mmkv for local storage	Passed	Passed
Uses NativeWind Tailwind classes for component styling instead of StyleSheet.create	Missed	Passed

case-01 · gemini-3.6-flash · 8/30/2026 · answers are capped and redacted

What's inside

The instructions your model reads when the skill loads.

SKILL.md40 linessingle file

React Native & Expo Best Practices

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

1. Architecture: Expo Router

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

2. UI & Styling

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

3. Performance Optimization

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.

4. Data Management

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.

5. Debugging & Dev Experience

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:

Is Hermes enabled?
Are images using expo-image?
Is navigation handled by Expo Router?
Are heavy computations moved off the JS thread?

Track record

Benchmark

21 / 23

test cases passed, vs 20 / 23 without

Adoption

Users: 0
Times used: 0

Safety and source details

SkillSafety

✓ 3 of 3 passed

Code scan15 of 15 checks clean

0 critical · 0 warning · 0 info — scanner v4 — 8/10/2026

View 15 scanner checks

live_secretremote_code_executionreverse_shelldata_exfiltrationssrf_metadataagent_snoopinganti_refusaldestructive_commandsobfuscated_unicodeunicode_homoglyphopaque_blobsuspicious_urltool_overreachtrigger_abuseprompt_injection_phrasing

IntentSafe

LLM judge · does the skill do what it claims

ContentClean

LLM judge · policy & harmful-content review

Source

Imported

dokhacgiakhoa / agent-skills-4-vibe-coding-cli

.agent/skills/react-native-best-practices/SKILL.md

View on GitHub ↗

License NOASSERTIONImported 8/10/2026Version v1

Other skills for the same job

Published skills whose descriptions closely match this one, with their headline benchmark lift.

More skills from the same source and nearby in the registry, with their headline benchmark lift.

Ready to supercharge your AI agents?

See it in action

What's inside

React Native & Expo Best Practices

1. Architecture: Expo Router

2. UI & Styling

3. Performance Optimization

4. Data Management

5. Debugging & Dev Experience

Track record

Benchmark

Adoption

SkillSafety

Source

Other skills for the same job

Related skills