vercel-react-native-skills

Analyze React Native and Expo projects for performance bottlenecks in lists, animations, images, and navigation.

Updated Dec 8, 2025
One-click install
npx skills add https://github.com/Yahia89/meditrans --skill vercel-react-native-skills-yahia89
Or copy as Structured Prompt for Agent
Please help me install this Agent Skill.
Skill: vercel-react-native-skills
Source: https://github.com/Yahia89/meditrans/tree/main/.agents/skills/vercel-react-native-skills
Command: npx skills add https://github.com/Yahia89/meditrans --skill vercel-react-native-skills-yahia89

SYSTEM DOCUMENTATION & REQUIREMENTS

What problem does it solve?

Consolidates React Native and Expo best practices to help teams build faster, more reliable mobile apps.

Core Features & Use Cases

  • List optimization: guidelines for virtualization, memoization, and stable item rendering to prevent jank.
  • Animation & UI: best practices for GPU-friendly animations with Reanimated and GestureDetector.
  • Platform integration: native navigators, expo-image, and native modals to improve UX and perf.

Quick Start

Analyze a baseline RN/Expo project, identify bottlenecks in lists, animations, images, and navigation, and apply the guidelines to improve performance.

Frequently Asked Questions about vercel-react-native-skills

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

FAQPage Schema
What causes React Native list scrolling jank and how do I optimize it?

React Native list scrolling jank is typically caused by inefficient virtualization and unstable item rendering. You can optimize list performance by applying strict virtualization guidelines, using stable item rendering, and enforcing memoization rules.

How do I create GPU-friendly animations in Expo?

To create GPU-friendly animations in Expo, use Reanimated and GestureDetector to push animation execution off the JavaScript thread. This approach ensures smooth, GPU-accelerated animations that prevent UI jank.

What is the best way to improve React Native navigation and image performance?

The best way to improve React Native navigation and image performance is using native navigators and expo-image. Integrating native modals and native navigation components improves both user experience and overall app performance.

Does this React Native performance skill work for monorepo architectures?

Yes, this React Native performance skill works for monorepo architectures by enforcing monorepo consistency. It provides best practices to ensure performance rules are applied uniformly across all shared packages and components.

How do I identify and fix React Native performance bottlenecks?

To identify and fix React Native performance bottlenecks, analyze your baseline project to find issues in lists, animations, images, and navigation. Then apply consolidated best practices covering virtualization, memoization, and native modules.