skills.rest
benaor
benaorCOMMUNITY
Explore all skills by this author →
GitHub

react-performance

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

Updated Feb 5, 2026
Search Tags:#performance#profiling#react-native#memoization#flatlist#reanimated#concurrent-react
One-click install
npx skills add https://github.com/benaor/Virtus --skill react-performance-benaor
Or copy as Structured Prompt for Agent▼
Please help me install this Agent Skill.
Skill: react-performance
Source: https://github.com/benaor/Virtus/tree/main/.claude/skills/react-performance
Command: npx skills add https://github.com/benaor/Virtus --skill react-performance-benaor

SYSTEM DOCUMENTATION & REQUIREMENTS

💡 This Skill includes references (resource) components.

What problem does it solve?

React Native performance optimization guide. Use when working on performance issues, optimizing renders, improving startup time, debugging memory leaks, optimizing lists/animations, or analyzing bundle size. Covers profiling, memoization, React Compiler, Concurrent React, state patterns, FlatList optimization, Reanimated, native threading, and bundle optimization.

Core Features & Use Cases

  • Profiling strategies for identifying bottlenecks
  • Memoization and patterns to reduce re-renders
  • Concurrent React and practical optimization patterns
  • List optimization, animations, and native threading considerations
  • Real-world usage across startup, rendering, and scrolling scenarios
  • Guidance on bundle optimization and native integrations

Quick Start

Run a focused profiling session on a representative screen, identify the top bottleneck with the Profiler, and apply the most relevant optimization reference.

Frequently Asked Questions about react-performance

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

FAQPage Schema
How do I identify React Native performance bottlenecks during UI rendering?▼

Reduce React Native re-renders by applying memoization techniques and leveraging the React Compiler to automatically prevent unnecessary component updates. These patterns minimize wasted renders and improve overall scrolling and UI responsiveness.

What is the best way to optimize FlatList scrolling performance in React Native?▼

Optimize FlatList scrolling performance by employing list virtualization techniques to render only visible items, reducing memory overhead. This ensures smoother scrolling experiences and prevents frame drops in large lists.

Does Reanimated handle animation performance through native threading in React Native?▼

Concurrent React improves React Native applications by enabling practical optimization patterns that keep the UI responsive during heavy rendering tasks. It allows rendering to be interruptible, prioritizing user interactions over background updates.

How do I reduce React Native app startup time and bundle size?▼

Reduce React Native app startup time and bundle size through targeted bundle optimization strategies and native integrations. Analyzing bundle composition removes dead code and prioritizes critical resources for faster initial load execution.

Related Skills

Explore More Software Engineering Skills→
JubaKitiashviliJubaKitiashvili
41

perf

Diagnose and fix React Native performance issues using the performance-profiler agent.

Community
Advanced
yeohj0710yeohj0710

capacitor-performance

Identify and implement Capacitor performance improvements for mobile apps.

Community
Intermediate
Chai-UnChai-Un

vercel-react-native-skills

Audit React Native and Expo projects for performance and maintainability improvements.

Community
Basic
CJHarmathCJHarmath

react-performance

Reduce unnecessary React re-renders with memoization and list virtualization.

Community
Intermediate