react-native-best-practices

Optimize React Native app performance with profiling and bundle size reduction.

Updated Aug 23, 2026
One-click install
npx skills add https://github.com/EverHouse/everclubapp --skill react-native-best-practices-everhouse
Or copy as Structured Prompt for Agent
Please help me install this Agent Skill.
Skill: react-native-best-practices
Source: https://github.com/EverHouse/everclubapp/tree/main/.agents/skills/react-native-best-practices
Command: npx skills add https://github.com/EverHouse/everclubapp --skill react-native-best-practices-everhouse

SYSTEM DOCUMENTATION & REQUIREMENTS

💡 This Skill includes references (resource) components.

What problem does it solve?

This Skill addresses performance bottlenecks in React Native applications, ensuring smooth animations, fast startup times, and reduced memory usage.

Core Features & Use Cases

  • Performance Profiling: Identifies slow components, re-renders, and frame drops.
  • Optimization Guidance: Provides actionable steps for improving FPS, TTI, and bundle size.
  • Native Module Optimization: Offers best practices for threading and memory management.
  • Use Case: Debugging a janky scrolling list by identifying it needs FlashList and applying getItemLayout for optimal performance.

Quick Start

Use the react-native-best-practices skill to analyze and improve the startup performance of my React Native app.

Frequently Asked Questions about react-native-best-practices

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

FAQPage Schema
How do I fix frame drops and slow scrolling in React Native lists?

Fix React Native frame drops by identifying inefficient list rendering and applying components like FlashList with getItemLayout to optimize scrolling performance and prevent jank.

What is the best way to reduce Time to Interactive (TTI) for a React Native app?

Reduce React Native Time to Interactive (TTI) through JavaScript performance tuning, bundle size reduction strategies, and profiling slow components to speed up application startup.

How does profiling identify memory leaks and re-renders in React Native?

Profiling identifies React Native memory leaks and unnecessary re-renders by tracking component lifecycle bottlenecks, exposing slow JavaScript execution, and highlighting frame drops during runtime.

Can I optimize native module threading and memory management in React Native?

Optimize React Native native modules by applying specific best practices for thread management and memory allocation, preventing bottlenecks that cause slow interactions and application crashes.

What steps should I take to reduce my React Native JavaScript bundle size?

Reduce React Native bundle size by analyzing JavaScript payloads, removing unused dependencies, and applying optimization strategies that minimize code footprint and improve load times.