vercel-react-best-practices

Prevent React performance bottlenecks by consolidating production-grade guidelines that enforce rules for server actions, parallel data fetching, and per-request caching across your components and pages.

The best way to use Suspense and server actions is to follow concrete patterns that enforce security and reliability while improving TTI and LCP through parallel data fetching and per-request caching.

Optimize bundle size and reduce render waterfalls by applying concrete rules across your components and data flows, targeting scenarios across pages and data-fetching layers to improve overall UX.

You can use these React best practices for code reviews, architecture decisions, and engineering onboarding to enforce consistent performance discipline and maintainable refactors across projects.

Slow LCP and TTI metrics often result from data waterfalls and unoptimized bundles; applying targeted best practices for server actions, Suspense, and parallel data fetching improves these rendering times.