mobile_react_native

Implements React Native best practices for navigation, state management, and performance optimization.

Updated Jan 14, 2026
One-click install
npx skills add https://github.com/jvsandhu/agentic-skills --skill mobile-react-native-jvsandhu
Or copy as Structured Prompt for Agent
Please help me install this Agent Skill.
Skill: mobile_react_native
Source: https://github.com/jvsandhu/agentic-skills/tree/main/skills/mobile_react_native
Command: npx skills add https://github.com/jvsandhu/agentic-skills --skill mobile-react-native-jvsandhu

SYSTEM DOCUMENTATION & REQUIREMENTS

What problem does it solve? Building performant and maintainable React Native apps requires navigating many decisions around project structure, list rendering, secure storage, navigation typing, and state management, and mistakes in these areas cause slow UIs and security issues. ## Core Features & Use Cases - Performance Optimization: Provides FlatList tuning patterns (windowSize, getItemLayout, memoization) and recommends FlashList, expo-image caching, and the Hermes engine. - Architecture Guidance: Defines a standard src/ project structure with typed React Navigation, Zustand state with persistence, and platform-specific file conventions. - Secure Storage: Shows how to replace insecure AsyncStorage with expo-secure-store for tokens and credentials. - Use Case: When building a cross-platform mobile app with Expo, use this Skill to scaffold the folder structure, configure typed navigation, and optimize list rendering before release. ## Quick Start Use the mobile React Native skill to review my Expo app's FlatList performance and set up secure token storage with Zustand state management.

Frequently Asked Questions about mobile_react_native

High-intent search queries and answers about installing and using this skill.

FAQPage Schema
How do I optimize FlatList performance in React Native?

Optimize FlatList by setting removeClippedSubviews, maxToRenderPerBatch, windowSize, and getItemLayout with fixed item heights. For larger gains, switch to Shopify's FlashList, which the skill notes delivers roughly 5x better performance.

How to store tokens securely in React Native apps?

Use expo-secure-store instead of AsyncStorage, which is not secure for sensitive data. Call SecureStore.setItemAsync to save tokens and SecureStore.getItemAsync to retrieve them.

Zustand vs Redux for React Native state management?

The skill uses Zustand with the persist middleware for lightweight client state, separating server state with TanStack Query. Zustand requires less boilerplate than Redux and integrates persistence via a simple storage name option.

Does React Navigation support TypeScript typed routes?

Yes, define a RootStackParamList type mapping screen names to their params, then pass it to createNativeStackNavigator. This gives type-safe navigation props and route parameters across the app.

When should I use platform-specific files in React Native?

Use Platform.select for small style or value differences between iOS and Android. For larger behavioral differences, create platform-specific files like Button.ios.tsx and Button.android.tsx, which the bundler resolves automatically.