skills.rest
NoManPlay
NoManPlayCOMMUNITY
Explore all skills by this author →
GitHub

vercel-react-native-skills

Enforce React Native rendering, list virtualization, and animation best practices.

Updated Mar 27, 2026
Search Tags:#performance#react native#expo#list virtualization#ui patterns#reanimated#crash prevention
One-click install
npx skills add https://github.com/NoManPlay/my-skills --skill vercel-react-native-skills-nomanplay
Or copy as Structured Prompt for Agent▼
Please help me install this Agent Skill.
Skill: vercel-react-native-skills
Source: https://github.com/NoManPlay/my-skills/tree/main/skills/vercel-react-native-skills
Command: npx skills add https://github.com/NoManPlay/my-skills --skill vercel-react-native-skills-nomanplay

SYSTEM DOCUMENTATION & REQUIREMENTS

What problem does it solve?

It prevents common React Native crashes and performance regressions by codifying best practices for rendering, list virtualization, animations, and native integration.

Core Features & Use Cases

  • Crash-proof rendering rules: ensures strings and conditionals render safely in React Native to avoid production runtime errors.
  • High-performance list guidance: improves scroll performance by stabilizing references, hoisting callbacks, minimizing item work, and using virtualizers.
  • Smooth native animations & UX patterns: guides GPU-friendly animation properties, correct Reanimated patterns, and native navigation/menu/modal choices for better responsiveness.

Quick Start

Use the vercel-react-native-skills skill to refactor your React Native components by applying the listed rules from AGENTS.md and the individual rule files for guidance.

Frequently Asked Questions about vercel-react-native-skills

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

FAQPage Schema
How do I fix React Native crashes caused by conditional rendering?▼

Prevent React Native rendering crashes by enforcing rules that ensure strings and conditionals evaluate safely, avoiding common production runtime errors in components.

What's the best way to improve React Native FlatList scroll performance?▼

Improve React Native list scroll performance by stabilizing references, hoisting callbacks, minimizing item render work, and properly implementing list virtualization techniques.

How do I use Reanimated for smooth native animations in Expo?▼

Use Reanimated for smooth Expo animations by guiding GPU-friendly properties and applying correct native-optimized UI patterns to ensure better responsiveness.

Can I use this to refactor existing React Native navigation and modal components?▼

Yes, you can refactor existing React Native components by applying rules for native navigation, menus, and modals to improve both platform API integration and overall UX responsiveness.

Why does my Expo app still lag during scroll handling despite using a virtualized list?▼

Expo app scroll lag persists when list virtualization lacks reference stabilization and hoisted callbacks, causing excessive render work that destabilizes scroll handling performance.

Related Skills

Explore More Software Engineering Skills→
yashs33244yashs33244
1

vercel-react-native-skills

Enforce React Native and Expo best practices for rendering, lists, animations, and state.

Community
Intermediate
achmfachmf

sentry-react-native-sdk

Integrate Sentry error monitoring and performance tracing into React Native and Expo apps.

Community
Advanced
benaorbenaor

react-performance

Profile React Native apps to identify and optimize rendering, startup, and memory bottlenecks.

Community
Advanced
mrsknetworkmrsknetwork

vercel-react-native-skills

Optimize React Native apps with rendering, list, animation, and navigation rules.

Community
Intermediate