What problem does it solve?
This Skill documents targeted fixes and patterns to eliminate common Next.js 15 performance regressions such as data-fetching waterfalls, oversized client bundles, and insecure Server Actions, enabling faster page loads and safer server-side mutations.
Core Features & Use Cases
- Waterfall prevention: Use Promise.all for independent fetches, defer awaits into branches, and wrap slow data in Suspense boundaries to avoid sequential blocking.
- Bundle size reduction: Prefer direct icon and component imports, use next/dynamic to lazy-load heavy components, and defer analytics to client-only loads.
- Server Actions safety: Enforce auth and resource-ownership checks inside Server Actions rather than relying solely on middleware.
- Production readiness: Ensure builds run with production commands and that containerized deployments use standalone output instead of dev mode.
- Use Case: During a PR review of a Next.js frontend, apply these checks to convert sequential awaits to parallel fetches, replace barrel imports with direct icon imports, and add Suspense or dynamic imports around heavy UI components.
Quick Start
Audit the frontend for sequential awaits, direct barrel imports, heavy components without dynamic loading, and Server Actions missing internal auth checks and propose concrete code changes.