vercel-react-best-practices

To optimize React and Next.js performance, apply over 40 prioritized rules across eight categories including eliminating waterfalls, bundle size optimization, and improving server-side rendering. Each rule provides detailed explanations with incorrect versus correct code examples.

The most impactful areas for React performance optimization include eliminating waterfalls, reducing bundle size, improving server-side performance, and optimizing client-side data fetching. Rules are prioritized by their overall performance impact.

Yes, you can use these rules to refactor existing Next.js components. The guide provides incorrect versus correct code examples for each rule, enabling AI agents and LLMs to systematically maintain, generate, or refactor code for improved performance.

The best way to eliminate data fetching waterfalls in React is to apply the specific rules within the eliminating waterfalls category. This category provides prioritized patterns and code examples to resolve sequential data loading bottlenecks effectively.

Yes, this guide covers advanced rendering patterns for React. It includes a dedicated category for advanced patterns alongside rendering performance and server-side performance to ensure comprehensive optimization for complex Next.js applications.