vercel-react-best-practices

React and Next.js performance optimization involves applying guidelines for component design, data fetching, bundle optimization, and server/client rendering patterns to boost efficiency and user experience. This skill provides 57 rules across 8 categories to guide code generation and review.

Refactor React components by applying categorized performance guidelines with automated refactoring prompts. This process identifies anti-patterns in existing code and aligns component design, data fetching, and rendering patterns with structured best practices.

Yes, these guidelines cover Next.js bundle optimization and server/client rendering patterns. The rules provide structured guidance for building high-performance apps, validating performance targets during QA and CI, and guiding tooling and code generation.

You need automated code generation rules for React and Next.js when scaling high-performance apps across a team. Using 57 categorized rules with explicit naming conventions ensures alignment with best practices during new component creation, refactoring, and QA validation.

Yes, this skill works for validating performance targets during CI by applying a comprehensive set of React and Next.js performance guidelines. The 57 rules across 8 categories are applicable to reviewing code, avoiding anti-patterns, and accelerating delivery with confidence.