skills.rest
truongnat
truongnatCOMMUNITY
Explore all skills by this author →
WebsiteGitHub

vercel-react-native-skills

Enforce React Native rendering and virtualization practices to prevent runtime crashes.

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

SYSTEM DOCUMENTATION & REQUIREMENTS

💡 This Skill includes references (resource) components.

What problem does it solve?

It prevents common React Native performance bottlenecks and runtime crashes by enforcing best practices for rendering, lists, animations, navigation, and native modules.

Core Features & Use Cases

  • Performance-safe React Native patterns: Avoid render thrashing by stabilizing list item props and references, using virtualized lists, and keeping list items lightweight.
  • Crash-proof rendering rules: Ensure strings are rendered inside <Text> and avoid falsy JSX patterns that can break production.
  • Native-grade UI behavior: Improve animation smoothness with GPU-friendly properties and Reanimated patterns, and use platform-native navigators and menus.

Use case: You’re building an Expo app with feed-like screens; this Skill helps you refactor list rendering to remove jank (virtualization, memo-friendly props) and update animations to stay on the UI thread (transform/opacity, GestureDetector patterns) while preventing Text/layout crashes.

Quick Start

Use the vercel-react-native-skills guidelines when refactoring a React Native screen for performance and correctness, especially one that renders lists and uses Reanimated animations.

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 prevent React Native list rendering crashes and scroll jank in Expo apps?▼

Prevent React Native list rendering crashes by enforcing safe rendering practices: stabilize list item props, use virtualized lists, keep items lightweight, and ensure strings are always wrapped inside <Text> components to avoid runtime breaks.

Why does my Reanimated animation cause performance regressions on the UI thread?▼

Reanimated animation performance regressions often occur when using non-GPU-friendly properties. Improve smoothness by constraining animations to GPU-friendly properties like transform and opacity, and apply GestureDetector patterns to keep execution on the UI thread.

What is the best way to refactor React Native feed screens for smooth virtualization?▼

The best way to refactor React Native feed screens for smooth virtualization is to replace standard lists with virtualized lists, stabilize props to prevent render thrashing, and keep list components lightweight to maintain smooth mobile experiences.

Does this approach work with native navigation and platform-native UI integrations?▼

Yes, this approach works with native navigation by enforcing the use of platform-native navigators and menus, ensuring that your React Native components integrate smoothly with native platform APIs for correct UI behavior.

When should I worry about falsy JSX patterns breaking my React Native production app?▼

You should worry about falsy JSX patterns breaking your React Native production app when rendering lists or dynamic content, as incorrect Text rendering and unstable references can trigger runtime crashes during scroll or component mounting.

Related Skills

Explore More Software Engineering Skills→
cloudbro-kube-aicloudbro-kube-ai
14

vercel-react-native-skills

Enforce React Native and Expo performance guidelines for lists, animations, and UI patterns.

Official
Advanced
takayatomosetakayatomose

vercel-react-native-skills

Audit React Native and Expo code for rendering and runtime performance issues.

Community
Intermediate
harsh-m-patilharsh-m-patil

vercel-react-native-skills

Standardize React Native and Expo performance best practices for mobile apps.

Community
Advanced
freekmurzefreekmurze
997

react-native-best-practices

Identify and reduce performance bottlenecks in React Native apps.

Community
Advanced