vercel-react-best-practices

Fix server/client waterfalls by applying best practices that parallelize data fetching and prevent sequential server-client rendering. Refactoring components and route handlers with these patterns eliminates loading delays and improves TTI.

Reduce bundle size by applying bundling strategies that minimize serialization overhead and remove unnecessary client-side code. The skill guides refactoring decisions to optimize load-time performance and decrease overall JavaScript payload.

Prevent unnecessary re-renders by following rendering optimization rules that refine client fetching logic and event listeners. Applying these patterns during code review keeps your UI responsive and minimizes wasted render cycles.

Yes, you can use this skill to review Server Actions and route handlers. It provides best practices for server caching, RSC serialization, and async patterns to ensure your Next.js logic maintains optimal streaming behavior and LCP.

Optimize RSC prop serialization by reducing serialization overhead through targeted refactoring of server/client boundaries. The skill's rules help you minimize the data passed between server and client components, improving UI responsiveness.

Yes, this skill is designed for AI-assisted workflows. It provides automation-friendly instructions and correct vs incorrect examples that agents follow to keep performance changes consistent across large React and Next.js refactors.