← Back to Skills
Software EngineeringEngineeringPlatinum

Your React app is slow or has janky interactions.

React Performance Optimizer

React, Performance, Optimization Tools

intermediatev6.0

Best for

  • Diagnosing excessive re-renders causing janky user interactions
  • Optimizing bundle size for slow initial page loads
  • Implementing code splitting strategies for large React applications
  • Reducing memory leaks from component subscriptions and event listeners

What you'll get

  • Detailed analysis of profiling data with specific component optimization recommendations using React.memo, useMemo, and state architecture changes
  • Step-by-step bundle analysis results with webpack-bundle-analyzer insights and specific code splitting implementation using React.lazy
  • Core Web Vitals improvement plan with before/after metrics, specific rendering optimizations, and measurement tracking setup
Expects

Specific performance symptoms, profiling data from React DevTools or Chrome Performance panel, and current application architecture details.

Returns

Targeted optimization recommendations with specific implementation code examples, measurement strategies, and expected performance impact metrics.

What's inside

You are a React Performance Optimization Specialist. You diagnose and fix React performance bottlenecks using measurement-driven, evidence-based methodology. - **Measure first, always.** You refuse to recommend optimizations without profiling data or described symptoms. Profiling in production mode ...

Covers

What You Do DifferentlyMethodologyWatch For
Not designed for ↓
  • ×General JavaScript performance optimization unrelated to React
  • ×Backend API performance tuning or database optimization
  • ×SEO optimization beyond Core Web Vitals metrics
  • ×React Native mobile app performance issues

SupaScore

89.08
Research Quality (15%)
9.1
Prompt Engineering (25%)
9
Practical Utility (15%)
8.65
Completeness (10%)
8.85
User Satisfaction (20%)
8.95
Decision Usefulness (15%)
8.8

Evidence Policy

Standard: no explicit evidence policy.

reactperformanceoptimizationmemoizationcode-splittingcore-web-vitalsreact-profilerbundle-sizevirtualizationstate-managementrenderinginp

Research Foundation: 8 sources (3 official docs, 2 industry frameworks, 2 web, 1 books)

This skill was developed through independent research and synthesis. SupaSkills is not affiliated with or endorsed by any cited author or organisation.

Version History

v6.06/12/2026

v6.0 wave-1 repair: re-distilled from masterfile/v2 (truncation incident 2026-06, delta-first rules)

v5.03/25/2026

v5.5 distilled from v2 via Claude Sonnet

v2.02/26/2026

Pipeline v4: rebuilt with 3 helper skills

v1.0.02/16/2026

Initial release

Works well with

Need more depth?

Specialist skills that go deeper in areas this skill touches.

Common Workflows

Frontend Performance Optimization Pipeline

Complete frontend performance optimization workflow from React-specific issues to production monitoring and Core Web Vitals compliance

© 2026 Kill The Dragon GmbH. This skill and its system prompt are protected by copyright. Unauthorised redistribution is prohibited. Terms of Service · Legal Notice