vercel-react-best-practices

Optimize React and Next.js performance by applying 57 rules across 8 categories, including eliminating data waterfalls, reducing bundle size, and improving server-side rendering. Audit your codebase and apply the highest-impact patterns first.

Prevent waterfall data fetching in Next.js by applying specific rules for eliminating waterfalls and optimizing client-side data fetching. These patterns guide refactoring sequential requests into parallelized or server-side data structures.

Reduce React bundle size by applying bundle size optimization rules that guide automated refactoring and code generation. This improves perceived performance metrics by minimizing JavaScript shipped to the client.

Yes, you can use these React best practices for automated code refactoring. The rules are designed for developers, code reviewers, and AI-assisted tooling to enforce consistent performance patterns across components, pages, and data fetching.

React re-render optimization and rendering performance are addressed through dedicated rule categories that guide code generation. These patterns target component rendering efficiency and general JavaScript performance tuning.

Yes, this skill covers advanced React patterns for Next.js performance tuning. It encompasses an advanced patterns category alongside seven other categories to guide comprehensive refactoring and code generation.