vercel-react-best-practices

To optimize React and Next.js performance during code reviews, apply 57 codified rules across 8 categories covering bundle size, server-side performance, and data fetching. It provides concrete guidance for automated refactoring and code generation.

The best way to eliminate data fetching waterfalls in Next.js is to enforce Vercel's best practices for server-client boundaries. This approach restructures data fetching patterns to prevent sequential blocking and improve rendering speeds.

You can reduce bundle size in React applications by applying structured rules for bundle optimization. This provides concrete guidance for automated refactoring to eliminate large bundles and suboptimal component patterns.

Yes, this approach to React re-render optimization works with existing codebases by guiding reviews and automated refactoring. It codifies guidelines to help teams build faster interfaces without requiring a complete rewrite.

You should apply Vercel's best practices for server-client boundaries when your React and Next.js codebase suffers from performance regressions due to suboptimal patterns, large bundles, or inefficient client-side data fetching.