vercel-react-best-practices

Optimize React and Next.js performance by applying 57 rules across 8 categories, covering waterfall elimination, bundle size reduction, server-side performance, and re-render optimization. The guidelines provide concrete incorrect vs. correct code examples for automated refactoring.

Reduce bundle size in Next.js by applying Vercel engineering standards for code generation and refactoring. The Skill provides actionable examples of correct implementation patterns to minimize bundle sizes and improve application speed.

Re-render optimization in React works by identifying performance bottlenecks and applying concrete code refactoring patterns. The Skill offers correct implementations to ensure smoother user experiences and more efficient code execution.

Eliminate waterfalls in Next.js data fetching when developing new features to ensure data is parallelized. This Skill provides guidelines to parallelize data fetching, minimizing load times for a faster and more responsive application.

No specific dependencies are required to improve React code quality. The Skill provides reference components with comprehensive performance optimization guidelines and code refactoring guidance based on Vercel Engineering standards.

Use Vercel React Best Practices for server-side performance to address common bottlenecks in React and Next.js applications. It targets software engineers seeking to enhance application speed and efficiency through actionable best practices.