vercel-react-best-practices

To optimize React and Next.js performance, apply a structured catalog of rules targeting bundle size, server-side execution, and client rendering. This approach enforces best practices across eight priority categories to guide automated code refactoring and data-fetching strategies.

Eliminating data fetching waterfalls in Next.js requires restructuring sequential client requests into parallel or server-side data fetching strategies. This skill provides specific guardrails and examples to refactor these patterns for faster load times.

Reducing bundle size and improving client-side rendering in React involves applying specific JavaScript performance and re-render optimization rules. This skill enforces these patterns during code generation to minimize unnecessary client-side computation.

Yes, you can use these React performance rules for automated code review. The guidelines are designed with clear examples and guardrails specifically to help engineers review existing components and enforce best practices during code generation.

Yes, this approach covers both server-side performance and client-side data fetching. It enforces optimization guidelines across eight categories, ensuring both backend execution efficiency and frontend data retrieval are addressed.