vercel-react-view-transitions：按官方工作流给 React 加上原生过渡动画
vercel-react-view-transitions 是 Vercel Labs 官方 Agent Skill，教 Cursor、Claude Code、Codex 用 React 的 ViewTransition 与 addTransitionType 做原生页面过渡。可用 npx skills add 安装。覆盖共享元素、Suspense 揭示、列表重排和路由方向动画，并附 Next.js App Router 说明。ViewTransition 目前在 React Canary 通道；App Router 已内置，不必再装 react@canary。不支持的浏览器只是没有动画。
阅读全文vercel-optimize：先看生产指标，再给 Vercel 项目做成本和性能优化
vercel-optimize 是 vercel-labs/agent-skills 里的官方 Agent Skill（SKILL.md 1.2.0），给已部署项目做成本与性能审计：先收集近 14 天指标，再用确定性脚本圈定路由，最后才改代码。Next.js/SvelteKit 最完整，Nuxt 可用，Astro 有限。安装：npx skills add vercel-labs/agent-skills --skill vercel-optimize。需 Node.js 20+、Vercel CLI v53+ 且已 login/link；路由级排序还要 Observability Plus。
阅读全文用 react-best-practices 给 AI 编程加上 React 性能守门员
介绍 Vercel 官方 Agent Skill「react-best-practices」（正式名 vercel-react-best-practices）：将 React/Next.js 性能经验整理为按影响排序的规则集，当前 SKILL.md 含 70 条、覆盖 8 类，优先消除请求瀑布与 bundle 浪费。说明来源归属、八大类规则、安装命令（npx skills add … --skill vercel-react-best-practices）、在 Cursor/Claude Code/Codex 等工具中的触发用法，以及适用场景与名称/版本注意事项。
阅读全文