vercel-react-best-practices

React and Next.js performance optimization involves enforcing best practices across data fetching, bundle optimization, and rendering. Apply a catalog of 57 rules to eliminate waterfalls, reduce bundle size, and improve SSR and client-side fetching.

Data fetching and suspense best practices in Next.js involve avoiding request waterfalls and applying advanced patterns. Use structured rules to optimize SSR and CSR trade-offs, ensuring safe and auditable changes to your components.

Reduce React bundle size by enforcing bundle optimization rules like avoiding barrel imports. This prevents unnecessary JavaScript from being shipped to the client, accelerating UI responsiveness and improving loading performance.

Yes, this Next.js performance guideline covers server actions and dynamic imports. It provides prioritized guidance across 8 categories including advanced patterns for suspense, dynamic imports, and server-side performance optimization.

Refactor React components to improve re-rendering performance when you encounter client-side fetching inefficiencies or JavaScript performance bottlenecks. Apply structured rules to optimize rendering and support automated refactoring for safe, auditable changes.