vercel-react-best-practices

To optimize React and Next.js performance, apply high-performance patterns that reduce async waterfalls, bundle size, and rendering overhead. This involves enforcing guidelines across eight priority categories, including server-side performance and client-side data fetching, during refactoring workflows.

Best practices for reducing Next.js bundle size involve applying specific cataloged guidelines targeting bundle optimization. These rules provide actionable steps and real-world examples to refactor code, aligning components with patterns that minimize heavyweight bundles and improve load times.

Review React code for async waterfalls and re-render overhead by applying a catalog of 69 rules across eight priority areas. This identifies slow renders and enforces actionable patterns for component design, data-fetching strategies, and rendering performance.

Yes, you can use these React performance guidelines for server actions and data-fetching. The catalog covers client-side data fetching and server-side performance, providing real-world examples to optimize load times and user experience in production Next.js applications.

Yes, this approach supports AI-assisted refactoring and code generation workflows for React components. It enforces guideline categories that AI tools can apply to consistently reduce slow renders and heavyweight bundles across development tasks.