vercel-react-best-practices

To optimize React and Next.js performance, apply over 70 actionable rules targeting network waterfalls, inefficient re-renders, and bloated bundle sizes. These best practices improve component composition and data fetching patterns for high-performance web architecture.

Eliminating network waterfalls in Next.js involves enforcing specific data fetching patterns that prevent sequential API calls. The guidelines provide incorrect versus correct code patterns to help refactor slow-loading pages into parallel fetching architectures.

Auditing a React component library for inefficient re-renders requires applying categorized performance rules across eight critical optimization categories. This process identifies performance bottlenecks and offers automated refactoring guidance to improve component composition.

Yes, these React performance best practices apply directly to automated code review and refactoring tasks. The 70+ specific rules provide clear incorrect versus correct code patterns that AI agents can use to identify and resolve common optimization issues.

Your Next.js page may load slowly due to sequential API calls or large initial bundle sizes overriding standard React best practices. Performance auditing with specialized rules can identify these network waterfalls and data fetching inefficiencies.

This optimization approach works with existing component performance patterns by enforcing 70+ rules across eight categories to resolve data fetching and bundle size issues. It provides clear code patterns to refactor and align current implementations.