react-performance

Fix unnecessary re-renders by applying memoization strategies like React.memo, useMemo, and useCallback to prevent expensive components from re-rendering. This Skill analyzes your React app and provides actionable guidance on exactly where to apply these optimizations.

The best way to reduce initial bundle size is through code splitting and lazy loading. This Skill identifies performance bottlenecks and outputs actionable steps with JSX examples to implement code splitting effectively across your React project.

Profile React components and monitor Web Vitals by using React DevTools Profiler alongside the web-vitals library. This Skill requires web-vitals >=3.0.0 and provides configuration notes and best practices for data-driven optimizations.

No, this optimization guidance requires React >=18. It is designed to analyze performance bottlenecks and provide memoization, code splitting, and Web Vitals improvements specifically for modern React projects.

High latency in a large data dashboard is often caused by unoptimized component renders and large bundle sizes. This Skill helps by profiling renders and applying memoization to expensive components to reduce latency and improve user experience.

Memoization prevents unnecessary re-renders but adds memory overhead and does not solve initial load latency. This Skill helps balance memoization with code splitting, lazy loading, and Web Vitals monitoring for comprehensive optimization.