vercel-react-best-practices

Fix async waterfalls by restructuring data fetching logic and deferring non-critical work until it is needed. This prevents sequential fetches from blocking rendering and eliminates server-side performance bottlenecks.

Reduce React bundle size by improving import paths, splitting heavy components, and loading non-critical code later. Applying these rules during development ensures smaller bundles and faster load times.

Excessive re-renders are optimized by enforcing render discipline, using transitions, and applying deferred values. These techniques improve interaction responsiveness and prevent unnecessary component updates.

Minimize RSC serialization overhead by controlling Suspense boundaries and optimizing server/client rendering boundaries. This prevents hydration issues and reduces the payload transferred between server and client.

Yes, you can apply these guidelines during Server Action implementation to optimize API route responses. The rules provide prioritized incorrect versus correct patterns for deterministic refactors across server boundaries.

Review React code for performance regressions when you suspect slow API responses, excessive re-rendering, or oversized bundles. Use these guidelines to identify and fix inefficient data fetching and rendering patterns.