用途：为 Next.js App Router 开发提供一套实践原则，指导组件类型选择、数据获取、路由组织、缓存与性能优化等决策。
主要能力：
- 组件划分：默认使用服务端组件；需要 useState、useEffect 或事件处理时用客户端组件（'use client'）；两者都需要时拆分为服务端父组件加客户端子组件。
- 数据获取：默认静态缓存，revalidate 实现 ISR，no-store 为动态请求；数据库走服务端组件，API 用带缓存的 fetch，用户输入用客户端状态加 Server Action。
- 路由约定：page.tsx、layout.tsx、loading.tsx、error.tsx、not-found.tsx；支持路由组 (name)、并行路由 @slot、拦截路由 (.)。
- API 路由：Route Handlers 支持 GET、POST、PUT/PATCH、DELETE；建议用 Zod 校验输入、返回正确状态码、优雅处理错误、尽量使用 Edge runtime。
- 性能：使用 next/image 并设置 priority、blur 占位与响应式尺寸；重组件用动态导入，路由级代码分割自动生效，可用 bundle analyzer 分析。
- 元数据：静态导出或 generateMetadata 动态生成；title 建议 50-60 字符，description 150-160 字符，并配置 Open Graph 图片与 canonical URL。
- 缓存：请求层用 fetch 选项，数据层用 revalidate/tags，整路由用 route config；支持基于时间、按需（revalidatePath/Tag）与不缓存。
- Server Actions：用于表单提交、数据变更与触发重新验证；需标记 'use server'、校验输入、返回类型化响应并处理错误。
- 反模式：避免到处 'use client'、在客户端组件中获取数据、忽略 loading 与 error 边界、产生过大的客户端包。
- 项目结构：app/ 下按路由组、layout、api/[resource]/route.ts 与 components/ui 组织。
使用方式：资料未提供具体安装命令或调用步骤，仅说明该技能适用于执行上述工作流或操作。
适用场景：Next.js App Router 项目的架构设计、代码审查与性能优化。
限制：资料未提供版本要求、依赖、收费与平台信息。