用途:审查 Next.js App Router 代码,优化 Partial Prerendering(PPR)、缓存策略、Suspense 边界与 React Query 集成,确保符合 Next.js 16+ Cache Components 最佳实践。文档基于 Next.js 16.0.4,更新于 2025-11-25。
适用时机:创建含 Next.js 组件的 PR 前、实现新数据获取功能时、性能优化审查中、新增或修改 Suspense 边界时、实现缓存策略后。
前提:Next.js 16+ 且 next.config 中 cacheComponents: true;使用 App Router;理解 Server/Client Components。
主要能力:区分 React cache()(同请求去重)与 'use cache'(跨请求缓存);指导三层架构(静态外壳、Suspense 内动态鉴权、以 token 为键的缓存数据);提供鉴权与缓存实现示例;给出缓存决策矩阵与审查清单。
关键要点:布局保持静态,不在 layout 中调用 cookies();鉴权放在页面 Suspense 内;数据获取移入带 'use cache' 的内层组件;cacheLife() 设置时长;缓存键包含所有变化参数;使用处必须包 Suspense。个性化数据用 'use cache: private',stale 至少 30 秒。
Next.js 15+ 变更:params 与 searchParams 为 Promise,Server Component 用 await,Client Component 用 use();可用 PageProps<'/route/[param]'> 辅助类型。访问 searchParams 触发动态渲染,需包 Suspense。
Next.js 16 变更:middleware.ts 改为 proxy.ts,运行于 Node.js 运行时,可用 codemod:npx @next/codemod@latest middleware-to-proxy .
限制:资料未提供安装命令、收费、价格、平台与效果信息。