vercel-react-best-practices

To optimize React and Next.js performance during code reviews, reference established best practices to identify bottlenecks and suggest refactors that improve Time to Interactive and startup time.

The best way to reduce bundle size and eliminate waterfalls is by splitting bundles, avoiding barrel imports, and enabling parallel data fetching across server and client boundaries.

Suspense boundaries and server components improve Next.js data fetching by enforcing patterns that enable parallel data retrieval and reduce waterfalls across server and client boundaries.

You should apply React bundle optimization patterns when writing, reviewing, or refactoring components and pages to ensure your codebase loads faster, scales better, and remains maintainable.

Yes, these performance patterns apply to data fetching across both server and client boundaries, ensuring parallel retrieval and eliminating waterfalls in Next.js applications.

You should avoid barrel imports when optimizing React bundle size because they can prevent effective bundle splitting, increasing startup time and degrading overall application performance.