What problem does it solve? React and Next.js codebases often ship with hidden performance problems such as async waterfalls, bloated bundles, unnecessary re-renders, and unauthenticated server actions. This Skill gives an AI agent a prioritized, rule-based checklist from Vercel Engineering so generated and refactored code follows proven performance patterns from the start. ## Core Features & Use Cases - 70 prioritized rules across 8 categories: from CRITICAL (eliminating waterfalls, bundle size) down to LOW (advanced hook patterns), each with incorrect vs. correct code examples. - On-demand rule lookup: individual rule files under rules/ (e.g., async-parallel.md, bundle-barrel-imports.md) provide detailed explanations, impact metrics, and references. - Compiled reference document: AGENTS.md contains the full expanded guide for deep review sessions. - Use Case: When asked to optimize a slow Next.js page, the agent consults the waterfall and server-side rules to parallelize data fetching with Promise.all(), add Suspense boundaries, and deduplicate requests with React.cache(). ## Quick Start Review my Next.js page component using the vercel-react-best-practices skill and fix any data fetching waterfalls or bundle size issues.
