Next.js performance optimization and best practices. Use when writing Next.js code (App Router or Pages Router); implementing Server Components, Server Actions, or API routes; optimizing RSC serialization, data fetching, or server-side rendering; reviewing Next.js code for performance issues; fixing authentication in Server Actions; or implementing Suspense boundaries, parallel data fetching, or request deduplication.
Comprehensive performance optimization and best practices for Next.js applications, designed for AI agents and LLMs working with Next.js code.
Use this skill when the task involves:
"use server"headers(), cookies(), after())React.cache()after() for non-blocking operationsDo not activate for:
accelint-react-best-practices skill)accelint-ts-best-practices skill)accelint-ts-testing skill)This skill should activate when users say things like:
Performance Issues:
Security Issues:
Debugging Issues:
Code Review:
Refactoring:
This skill uses a progressive disclosure structure to minimize context usage:
Read AGENTS.md for a concise overview of all rules with one-line summaries.
When you identify a relevant optimization, load the corresponding reference file for detailed implementation guidance:
General Patterns:
Server-Side Performance:
Misc:
Quick References:
Automation Scripts:
Each reference file contains:
When this skill is invoked for Next.js code review, use the standardized report format:
Template: assets/output-report-template.md
The report format provides:
When to use the report template:
/accelint-nextjs-best-practices <path>When NOT to use the report template:
Task: "Add authentication to this Server Action"
Approach:
Task: "This page loads slowly with multiple fetches"
Approach:
Task: "The HTML response is huge with user data"
Approach:
Official Next.js documentation: