vercel-react-best-practices

To optimize React and Next.js performance, apply Vercel's best practices by enforcing 57 rules across 8 priority categories that prevent data fetching waterfalls and improve server/client data handling. This process guides automated refactoring and component design.

Vercel's best practices for reducing bundle size involve applying specific rules during component creation and build optimizations. The guidelines provide clear examples and decision criteria to optimize load times and guide performance-focused refactoring.

Refactor legacy React codebases for better server-side rendering performance by applying consolidated Vercel guidelines during code reviews. These rules target rendering optimizations and server-side performance to improve runtime speed and scalability.

Yes, you can use these React performance guidelines for both starting new Next.js projects and refactoring legacy codebases. The rules apply to component design, data fetching strategies, and bundle optimization to ensure performance best practices are followed.

Next.js apps have slow load times due to data waterfalls and large bundles. These rules fix load times by guiding page design, data fetching strategies, and build optimizations to reduce waterfalls and optimize bundle size.

No specific dependencies are required to apply these Next.js bundle optimization rules. The guidelines act as actionable rules for code reviews and automated generation, requiring only your existing React and Next.js environment to implement.