Vercel新官方vercel-react-best-practices
Vercel 官方出品。把 Vercel 工程团队的 React 与 Next.js 性能经验整理成规则集:消除请求瀑布、减小包体积、正确使用服务端组件等。写代码、做 Code Review、排查性能问题时自动对照。
安装
skills CLI(多客户端通用)
npx skills add vercel-labs/agent-skills --skill vercel-react-best-practices
也可以手动安装:把仓库里的 skill 目录复制到 ~/.claude/skills/(Claude Code)或对应客户端的 skills 目录。
怎么触发
装好后不用手动调用,对 Agent 说类似的话,它会自动用上这个 Skill:
- 「review 一下这个页面的性能问题」
- 「这个 Next.js 页面首屏很慢,帮我优化」
适用场景
- React / Next.js 代码评审
- 首屏、包体积等性能优化
同类 Skill
frontend-design让 AI 写出的界面有设计感,不再是千篇一律的模板风ui-ux-pro-max可检索的 UI/UX 设计知识库:风格、配色、字体搭配一应俱全web-design-guidelines按 Web 界面规范审查 UI:可访问性、交互、细节vercel-composition-patternsReact 组合模式:告别越加越多的 boolean propsvercel-react-native-skillsReact Native 与 Expo 的性能与工程最佳实践vercel-react-view-transitions用 React View Transition API 做页面切换和共享元素动画