vercel-react-best-practices

To identify React and Next.js performance bottlenecks, audit your project against a catalog of 57 rules across 8 categories, targeting critical patterns like data waterfalls, bundle imports, and server actions.

The best way to eliminate Next.js data fetching waterfalls is streaming data and parallelizing fetches to reduce latency, applying Vercel-engineered best practices for responsive backends and optimized server actions.

Optimize React bundle size through selective imports and dynamic loading to improve build times and runtime performance, directly addressing bundle optimization rules within the performance catalog.

Yes, these React and Next.js best practices apply across both development and production environments, optimizing components, pages, data fetching, and the server/client boundary.

Use suspense boundaries and server actions for per-route optimizations when applying critical performance patterns to streamline server/client boundary behavior and improve runtime response.

Limitations involve strictly adhering to the 57 verified rules across 8 categories, meaning patterns outside this catalog may require separate evaluation for your specific React and Next.js optimization needs.