vercel-react-best-practices

React and Next.js performance optimization involves eliminating data fetching waterfalls, minimizing bundle size, and improving re-render efficiency. This Skill provides over 45 rules across 8 categories to guide AI agents in applying Vercel engineering standards.

Best practices for Next.js server-side data fetching include parallelizing requests to eliminate waterfalls and using Vercel engineering standards. This Skill provides concrete examples to improve both server-side and client-side data fetching efficiency.

You can reduce React bundle size by applying the concrete optimization examples and best practices in this Skill. It enforces Vercel engineering standards to help developers and AI agents minimize JavaScript payload and refine rendering performance.

Yes, this Skill is designed for AI-assisted development, allowing agents and LLMs to consistently apply Vercel's engineering standards to React and Next.js codebases for automated code generation and performance refactoring.

Use React performance optimization rules when developing new Next.js features to ensure data fetching is parallelized, bundle sizes are minimized, and components re-render efficiently, leading to a significantly faster user-facing application.

The best way to eliminate data waterfalls in Next.js is to parallelize server-side and client-side data fetching. This Skill provides categorized rules and concrete examples to identify and fix these performance bottlenecks.