What problem does it solve? React and Next.js codebases often suffer from slow load times, unnecessary re-renders, bloated bundles, and data-fetching waterfalls that are hard to spot during development. This Skill gives AI agents and developers a prioritized, rule-based checklist of 57 performance patterns so generated and refactored code follows proven optimization practices from the start. ## Core Features & Use Cases - Prioritized Rule Catalog: 57 rules across 8 categories ranked by impact, from critical waterfall elimination and bundle size reduction to advanced hook patterns. - Incorrect vs. Correct Examples: Every rule includes side-by-side code comparisons with explanations, making it easy to apply during code review or refactoring. - Granular Rule Files: Individual rule documents under rules/ let you load only the guidance relevant to the current task, plus a full compiled reference in AGENTS.md. - Use Case: While building a Next.js dashboard, an agent consults the skill to parallelize data fetching with Promise.all(), replace barrel imports from icon libraries with direct imports, and wrap slow sections in Suspense boundaries. ## Quick Start Review my React component and Next.js page for performance issues using the Vercel best practices rules and suggest concrete fixes.
