What problem does it solve?
This Skill provides a structured, battle-tested set of guidelines to optimize React and Next.js apps for performance, helping teams reduce waterfalls, cut bundle sizes, and improve SSR/CSR efficiency.
Core Features & Use Cases
- Rule-based improvements: 45+ rules across categories including Eliminating Waterfalls, Bundle Size Optimization, Server-Side Performance, Client-Side Data Fetching, Re-render Optimization, Rendering Performance, JavaScript Performance, and Advanced Patterns.
- Practical guidance: Clear explanations, code examples, and decision criteria for when to apply each pattern in real projects.
- Adoption guidance: Ready-to-apply patterns for code reviews, architecture reviews, and automated code generation.
Quick Start
Use this skill to review a React/Next.js codebase for perf issues and apply the recommended patterns across server and client boundaries.
- Audit the codebase for performance issues and apply the top CRITICAL rules (e.g., Defer Await, Dependency-Based Parallelization, Suspense boundaries).
- Use AGENTS.md and rules/ as reference to guide refactors and ensure server/client data flow is optimized.
- Integrate automated checks to enforce guidelines during code reviews and CI.
