用途
本技能为 AI 智能体与 LLM 提供 Next.js 应用的性能优化与最佳实践指导，适用于编写、重构和审查 Next.js 代码（App Router 或 Pages Router）。
主要能力
技能覆盖以下任务类型：
- 编写 Next.js 代码：创建 Server Components 或 Client Components、使用 "use server" 实现 Server Actions、编写 API 路由处理器、在 RSC（React Server Components）中设置数据获取、实现 Suspense 边界、使用 Next.js 专有 API（headers()、cookies()、after()）。
- 重构 Next.js 代码：优化服务端数据获取、减少 RSC 序列化开销、将串行操作转为并行、重构组件组合以提升性能、在 Server 与 Client Components 之间迁移。
- 性能优化：消除服务端瀑布、降低 API 路由与 Server Actions 的响应时间、最小化 RSC 边界的数据传输、用 React.cache() 实现请求去重、用 after() 处理非阻塞操作。
- Next.js 专有问题：Server Actions 中的认证/授权、RSC 序列化重复问题、导入优化（barrel 文件问题）、Server 与 Client Component 的决策、并行数据获取模式。
- 代码审查：审查 Next.js 代码中的性能反模式、识别 Server Actions 的安全问题、检查 Server/Client Component 边界、确保正确的认证模式、验证 Suspense 边界位置。
使用方式
技能采用渐进式披露结构以最小化上下文占用：
- 从概览开始：阅读 AGENTS.md，获取所有规则的一句话摘要。
- 按需加载具体规则：识别相关优化点后，加载对应参考文件获取详细实现指导。参考文件包括：
- 通用模式：prevent-waterfall-chains.md (1.1)、parallelize-independent-operations.md (1.2)、strategic-suspense-boundaries.md (1.3)
- 服务端性能：server-actions-security.md (2.1)、avoid-duplicate-serialization.md (2.2)、minimize-serialization.md (2.3)、parallel-data-fetching.md (2.4)、react-cache-deduplication.md (2.5)、use-after-non-blocking.md (2.6)
- 其他：avoid-barrel-imports.md (3.1)、server-vs-client-component.md (3.2)
- 快速参考：quick-checklist.md、compound-patterns.md
- 自动化脚本：scripts/ 目录下用于检测反模式的辅助脚本
- 应用模式：每个参考文件包含错误示例（反模式）、正确示例（最优实现）、模式重要性说明、性能影响指标以及相关模式与参考。
- 使用报告模板：当技能被用于 Next.js 代码审查时，使用标准化报告格式（模板：assets/output-report-template.md）。报告包含执行摘要与影响评估、严重级别（Critical、High、Medium、Low）、影响分析（性能、安全、数据传输、可维护性）、分类（Server Actions、RSC 序列化、数据获取、组件架构）、指向 references/ 详细指导的模式引用，以及用于跟踪所有问题的汇总表。
报告模板的使用时机：通过 /accelint-nextjs-best-practices <path> 直接调用技能，或用户要求“审查 Next.js 代码”“审计 Next.js 应用”并跨文件隐式调用技能时。
不使用报告模板的时机：用户要求“修复这个 Server Action”（直接实现）、用户问“这段代码有什么问题？”（直接回答问题）、用户请求具体修复（直接应用修复而不生成正式报告）。
适用场景
技能应在以下触发场景激活：
- 性能问题：“这个 Next.js API 路由很慢”“我的 Server Component 阻塞了整个页面”“优化这个 Server Action”“页面加载数据太慢”“我的数据获取存在瀑布”。
- 安全问题：“给这个 Server Action 添加认证”“这个 Server Action 需要授权”“保护这个 API 路由”“在这个 Server Action 中验证输入”。
- 调试问题：“为什么我的 RSC props 这么大？”“这个数据在 HTML 中重复了”“我的导入在开发中很慢”“这应该是 Server 还是 Client Component？”
- 代码审查：“审查这段 Next.js 代码的性能问题”“这个 Server Action 安全吗？”“能优化这个数据获取吗？”“检查这个组件应该是 server 还是 client”。
- 重构：“并行化这些数据获取”“减少序列化大小”“将其转换为使用 Suspense”“优化这个 barrel 导入”。
限制
以下情况不应激活本技能：
- React 专有优化（应使用 accelint-react-best-practices 技能）
- 构建配置（webpack、turbopack），除非是 Next.js 专有内容
- 通用 TypeScript/JavaScript 问题（应使用 accelint-ts-best-practices 技能）
- 部署/托管配置
- 测试设置（应使用 accelint-ts-testing 技能）
示例
示例 1：优化 Server Action 安全 任务：“给这个 Server Action 添加认证” 方法：阅读 AGENTS.md 概览；识别问题：Server Action 需要认证；加载 server-actions-security.md；应用带验证的认证模式。
示例 2：消除瀑布 任务：“这个页面有多个获取请求，加载很慢” 方法：阅读 AGENTS.md 概览；识别问题：串行数据获取；加载 prevent-waterfall-chains.md 和 parallelize-independent-operations.md；立即启动操作并使用 Promise.allSettled()。
示例 3：减少序列化 任务：“HTML 响应中包含用户数据，体积很大” 方法：阅读 AGENTS.md 概览；识别问题：RSC 边界过度序列化；加载 minimize-serialization.md；只传递必要字段，在客户端转换。
附加资源
官方 Next.js 文档：App Router Documentation、Server Components、Server Actions、Authentication Guide、Performance Optimization。