vercel-react-best-practices

To optimize React and Next.js performance, you should minimize component re-renders, eliminate data fetching waterfalls, and reduce client-side bundle size using established engineering guidelines for code maintenance and refactoring.

Best practices for reducing bundle size in Next.js involve optimizing server-side rendering, managing client-side data fetching efficiently, and applying advanced JavaScript performance patterns to ensure the final bundle remains as small as possible.

An AI agent refactors React components for optimal rendering performance by applying curated rules that minimize unnecessary re-renders, eliminate waterfalls, and optimize both server-side and client-side data fetching operations.

You need to optimize server-side rendering in React when your application experiences slow load times, allowing you to apply targeted performance rules that improve data fetching efficiency and overall server response times.

Yes, you can use these React optimization rules for both new feature generation and existing codebase maintenance, as the guidelines are specifically designed to aid AI agents in generating and refactoring code for optimal efficiency.

Data fetching waterfalls occur when requests are sequenced inefficiently; you fix them by applying performance optimization guidelines that restructure data fetching logic to run in parallel and minimize server-side rendering bottlenecks.