vercel-react-best-practices

To optimize React and Next.js performance bottlenecks, apply a structured set of 45 best-practice rules across 8 categories. These rules target rendering, data fetching, bundling, and server-client interactions to guide automated refactoring and improve web performance.

Best practices for React component design and server-client data flows include applying prioritized rules with concrete examples. This structured approach ensures consistent performance improvements during code creation, architecture reviews, and safer refactors.

Yes, you can use these performance guidelines to review and refactor existing Next.js code. The 45 prioritized rules provide concrete examples and references that enable faster code reviews, safer refactors, and consistent performance improvements across your project.

The most effective way to start applying web performance optimizations is to review the 45 prioritized rules and select a high-impact rule to implement immediately. This targets critical rendering, data fetching, or bundling bottlenecks right away.

This approach handles frontend optimization for bundling and data fetching by enforcing enterprise-grade guidelines across 8 distinct categories. It provides prioritized prefixes and concrete examples to directly guide code generation and resolve specific bottlenecks.