vercel-react-best-practices

Optimize React and Next.js performance by applying a prioritized rule set during code reviews. This covers 58 rules across 8 categories, targeting bundle size optimization, server-side performance, and eliminating data fetching waterfalls.

Best practices for reducing Next.js bundle size involve applying targeted optimization rules to component authoring and data fetching logic. This enforces strict bundle size optimization guidelines to improve overall web vitals and user-perceived speed.

Eliminate data fetching waterfalls in React components by following structured client-side data fetching guidelines. These rules prioritize parallel fetching patterns to significantly reduce rendering times and improve web vitals.

Apply Next.js server-side performance optimizations when building or refactoring Next.js pages and data-fetching logic. These guidelines ensure server-side rendering processes are optimized to improve user-perceived speed across modern web apps.

Yes, these React performance guidelines are suitable for refactoring existing components. They provide a battle-tested framework to systematically evaluate and improve rendering times and bundle size during component refactors.