react-compiler-aware

What problem does it solve?

Manually memoizing components and functions for performance (useMemo, useCallback) can be tedious, error-prone, and often unnecessary with the advent of the React Compiler. This Skill clarifies when and how to optimize.

Core Features & Use Cases

• Automatic Memoization: Understand what React Compiler handles automatically, reducing the need for manual optimization.
• When Manual Memoization is Needed: Identify specific scenarios where useMemo, useCallback, or React.memo still provide significant benefits.
• Performance Best Practices: Learn general guidelines for building performant React applications, trusting the compiler for most optimizations.
• Use Case: Review the ProductList component to remove unnecessary useMemo and useCallback calls, relying on the React Compiler for automatic optimization and simplifying the code.

Quick Start

Analyze the src/components/ExpensiveComponent.js file and suggest where useMemo or useCallback can be removed due to React Compiler.