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 等工具中的觸發用法，以及適用場景與名稱/版本注意事項。
閱讀全文