用途:在 Next.js App Router 中实现、搭建或修复落地页,涵盖 RSC 边界、shadcn/Tailwind 配置、next/image 与 next/font、渲染策略及框架注意事项。不负责文案、区块顺序、配色排版、动画设计、Core Web Vitals/SEO 策略或 WCAG 无障碍。
主要能力:默认使用 Server Components,把 "use client" 下推到叶子节点;保持 hero 文案、证明、定价、FAQ 服务端渲染,仅标记交互叶子。可将 Server Component 作为 children 传给 Client Component,使子树留在服务端;用 next/dynamic 处理重型客户端库,用 optimizePackageImports 优化多导出包。渲染上默认 SSG/ISR,仅对真正个性化内容用 SSR,Next 16 可用 PPR/use cache 混合静态与动态;流式传输内容而非 metadata,保持 generateMetadata 同步快速。配置 shadcn/Tailwind,注意 Base UI 默认、Tailwind v4 @theme inline 与分层模型随版本变化。用 next/image 的 priority 与 sizes、next/font 自托管实现零 CLS。
使用方式:按技能工作流实现页面,并核对参考文档 references/nextjs-implementation.md 与更新日志;确认 Next.js/React 版本已修复 CVE-2025-55182。
限制:"use client" 会沿导入树向上传染并打包整个子树;"use client" 与 metadata/generateMetadata 不能同文件共存;shadcn 输出需去默认化;PPR/边缘特性与 Vercel 耦合,存在可移植性成本;零交互页面 Astro islands 可能更优。具体版本、命令与价格等资料未提供。