What problem does it solve? React and Next.js codebases often suffer from slow load times, unnecessary re-renders, and data-fetching waterfalls that are hard to spot during development. This Skill provides a structured, prioritized rule set so AI-assisted code generation and review consistently follows proven performance patterns. ## Core Features & Use Cases - 70 Prioritized Rules Across 8 Categories: Covers eliminating waterfalls, bundle size optimization, server-side performance, client-side data fetching, re-render optimization, rendering performance, JavaScript micro-optimizations, and advanced patterns. - Incorrect vs. Correct Examples: Each rule includes concrete code comparisons with impact metrics (e.g., 2-10x improvement from parallelizing fetches, 200-800ms savings from avoiding barrel imports). - Use Case: When refactoring a Next.js page that fetches user, posts, and comments sequentially, apply the async rules to convert them into a single Promise.all() call and wrap slow sections in Suspense boundaries for faster initial paint. ## Quick Start Review my React component and Next.js data fetching code against the Vercel best practices rules and refactor any performance issues you find.
