Does it support list virtualization?

Absolutely. The skill identifies lists rendering more than 100 items and provides implementation patterns using libraries like @tanstack/react-virtual.

Can it help reduce my application's bundle size?

Yes, it can run bundle analysis tools to identify large dependencies and suggest smaller alternatives or code-splitting opportunities using dynamic imports.

How does this skill detect React re-render issues?

It scans component code for anti-patterns such as inline function definitions, object recreation within the render body, and missing React.memo on expensive components.

Will it fix my useEffect dependency array warnings?

The skill analyzes hook dependencies to ensure they are complete and optimized, preventing both stale closures and unnecessary effect executions.

React Performance Optimizer

Name: React Performance Optimizer
Author: solrac97gr

bysolrac97gr

•

Developer Tools

Analyzes and optimizes React application performance through comprehensive audits of rendering logic, bundle sizes, and memoization patterns.

The React Performance Optimizer skill provides a specialized diagnostic and optimization suite for React applications, helping developers identify and resolve bottlenecks that degrade user experience. It performs deep-code scans to detect unnecessary re-renders, evaluates React hook usage for proper memoization, and conducts production bundle analysis to find dependency bloat. By offering actionable refactoring advice for list virtualization, image optimization, and strategic code splitting with React.lazy, it ensures your frontend remains fast, lean, and scalable across all devices.

Key Features

012 GitHub stars

02Automated re-render detection and React.memo optimization patterns

03Code splitting implementation for routes and heavy components

04Detailed performance reporting with side-by-side code refactoring examples

05Production bundle analysis to identify large dependencies and bloat

06List virtualization strategies for high-performance rendering of large datasets

Use Cases

01Reducing initial application load times by optimizing bundle chunks and implementing lazy loading

02Eliminating UI lag and stutter in complex dashboards by resolving expensive re-render cycles

03Auditing legacy React codebases for modern performance anti-patterns and incorrect hook dependencies

What are Skills?·How to Install

Install with 🐟 Skill.Fish

npx skillfish add solrac97gr/marketplace-plugins optimize-performance

For use in Claude.ai and ChatGPT

Download Skill