react-best-practices

React and Next.js performance optimization involves applying 70+ rules across eight categories, including async optimizations, bundle size reduction, and re-render optimization, to eliminate bottlenecks and ensure fast load times.

The best way to reduce bundle size in a Next.js application is to follow specific code optimization rules that provide correct code snippets, targeting JavaScript performance and rendering efficiency to minimize the final output.

To eliminate data fetching waterfalls in React, apply the provided async optimization and client-side data fetching rules, which demonstrate incorrect vs. correct patterns for structuring asynchronous requests efficiently.

Yes, you can use these rules to refactor an existing Next.js codebase. The guidelines are designed to identify and resolve performance bottlenecks, offering real-world examples for improving server-side performance and rendering efficiency.

Yes, you need existing React and Next.js knowledge to implement these performance optimizations. The Skill provides advanced patterns and optimization rules rather than foundational framework tutorials.

React components re-render excessively due to unoptimized state and props handling. You can resolve this by applying the specific re-render optimization and rendering performance rules provided in the guidelines.