vercel-react-best-practices

To optimize React and Next.js performance, apply targeted rules across eight categories including code splitting, data fetching, and SSR. This skill provides 70 prioritized guidelines to identify bottlenecks, reduce bundle size, and speed up rendering.

Best practices to reduce bundle size involve applying specific bundle optimization rules that target code splitting and eliminate waterfalls. These guidelines help identify critical bottlenecks and reduce waterfalls to improve load times and TTI.

To eliminate data fetching waterfalls in React, apply rules from the client-side data fetching and eliminating waterfalls categories. These guidelines guide automated refactoring to optimize data fetching patterns and speed up rendering.

Yes, you can use these React performance rules for automated code refactoring. The 70 rules across eight categories have defined priorities specifically designed to guide automated refactoring and code generation workflows for production-grade optimization.

Server-side rendering affects Next.js performance by impacting server-side execution and client rendering strategies. Applying targeted SSR rules helps optimize these rendering paths to reduce bottlenecks and speed up overall web app rendering.