社区 Skill 能力矩阵
按需加载。仅在 find-skills 触发、用户主动询问"有没有 Skill 能做 X"、或推荐 Skill 时读取。
收录规则
| 规则 | 说明 |
|---|---|
| 收录门槛 | 安装量 ≥ 1K（社区验证过的优质 Skill） |
| 每分类上限 | Top 5（按安装量降序，满 5 个后新增需替换最低的） |
| 收录方式 | 完全自动：find-skills 搜索后自动筛选收录，收录后提醒用户 |
| 去重规则 | 已安装的 Skill 不收录（标记 ✅ 已安装仅供参考）；已收录的不重复添加 |
| 更新时机 | 每次 find-skills 触发搜索后，自动比对并更新 |
自动收录流程
8 大分类
| 编号 | 分类 | 覆盖范围 |
|---|---|---|
| 1 | 🏗️ 前端框架 | React / Vue / Next.js / Nuxt / Svelte 等框架最佳实践 |
| 2 | 🎨 UI 设计 | 设计系统、组件规格、响应式、Tailwind / CSS、无障碍 |
| 3 | 🔍 代码质量 | Code Review、TypeScript 高级类型、Lint 规范、重构 |
| 4 | ⚡ 性能优化 | 渲染性能、资源加载、动画、Lighthouse、Core Web Vitals |
| 5 | 🧪 测试 | 单元测试、E2E、Playwright、Vitest、测试策略 |
| 6 | 🚀 DevOps | CI/CD、部署、容器化、监控、安全审计 |
| 7 | 📄 文档 | 技术文档生成、API 文档、Changelog、架构文档 |
| 8 | 🤖 AI & 工具·其他 | 浏览器自动化、内容抓取、原型生成、领域专项 |
能力矩阵
1. 🏗️ 前端框架
| # | Skill | 安装量 | 解决的问题 | 状态 |
|---|---|---|---|---|
| 1 | vercel-react-best-practices | 358K | 组件边界、副作用位置、渲染方式 | ✅ 已安装 |
| 2 | nextjs-app-router-patterns | — | App Router 目录、SC/CC 职责边界 | 可安装 |
| 3 | antfu/skills | 4.6K⭐ | Vue / Nuxt / Vite / Vitest 全工具链 | 可安装 |
| 4 | react:components | — | 组件拆分规范 | ⚡ 已融入 fe-base-skill |
| 5 | openapi-to-typescript | — | 接口契约自动化 | ⚡ 已融入 fe-engineer-pack S4 |
2. 🎨 UI 设计
| # | Skill | 安装量 | 解决的问题 | 状态 |
|---|---|---|---|---|
| 1 | frontend-design | 349K | 生成高质量界面代码 | ✅ 已安装 |
| 2 | web-design-guidelines | 285K | UI 细节、交互一致性 | ✅ 已安装 |
| 3 | ui-ux-pro-max | 138K | 50 种风格、调色板、字体配对 | ✅ 已安装 |
| 4 | shadcn | 115K | shadcn/ui 组件库最佳实践 | 可安装 |
| 5 | moderncss/skills | — | 容器查询、级联层、原生嵌套等现代 CSS | 可安装 |
3. 🔍 代码质量
| # | Skill | 安装量 | 解决的问题 | 状态 |
|---|---|---|---|---|
| 1 | frontend-code-review | 7.1K | 通用前端改动检查 | 可安装 |
| 2 | typescript-expert | 3.1K | 消灭 any、TS 深水区治理 | 部分融入 fe-base-skill |
| 3 | typescript-react-reviewer | 2.7K | React + TS 项目 Review | 可安装 |
| 4 | typescript-advanced-types | — | 复杂类型、泛型约束 | ⚡ 已融入 fe-base-skill |
| 5 | scss-best-practices | — | SCSS 7-1 架构、BEM 命名 | 可安装 |
4. ⚡ 性能优化
| # | Skill | 安装量 | 解决的问题 | 状态 |
|---|---|---|---|---|
| 1 | fixing-motion-performance | — | 动画性能审计与修复 | ✅ 已安装 |
| 2 | performance-optimization | — | 渲染、资源加载、交互成本 | 可安装 |
| 3 | responsive-design | — | 多端响应式布局 | ⚡ 已融入 fe-base-skill |
| 4 | web-accessibility | — | 语义、焦点、键盘可达性 | 可安装 |
| 5 | — | — | — | — |
5. 🧪 测试
| # | Skill | 安装量 | 解决的问题 | 状态 |
|---|---|---|---|---|
| 1 | playwright-best-practices | — | Playwright E2E 最佳实践 | 可安装 |
| 2 | vitest | — | 轻量级单元测试 | 可安装 |
| 3 | webapp-testing | — | Web 应用层交互验证 | 可安装 |
| 4 | e2e-testing-patterns | — | 关键路径 E2E 测试 | 可安装 |
| 5 | testing-strategies | — | 测试层次规划 | ⚡ 已融入 fe-engineer-pack S4 |
6. 🚀 DevOps
| # | Skill | 安装量 | 解决的问题 | 状态 |
|---|---|---|---|---|
| 1 | hack-skills | — | 安全测试知识库（14 领域 100+ 专题） | 可安装 |
| 2 | — | — | — | — |
| 3 | — | — | — | — |
| 4 | — | — | — | — |
| 5 | — | — | — | — |
7. 📄 文档
| # | Skill | 安装量 | 解决的问题 | 状态 |
|---|---|---|---|---|
| 1 | codeforge-frontend-arch-doc-generator | — | 前端架构文档生成 | ✅ 已安装 |
| 2 | — | — | — | — |
| 3 | — | — | — | — |
| 4 | — | — | — | — |
| 5 | — | — | — | — |
8. 🤖 AI & 工具·其他
| # | Skill | 安装量 | 解决的问题 | 状态 |
|---|---|---|---|---|
| 1 | agent-browser | 221K | 浏览器自动化 CLI | ✅ 已安装 |
| 2 | image2proto | — | 截图 → 可交互 HTML 原型 | 可安装 |
| 3 | PageAgent | — | 纯前端 GUI 智能体（阿里开源） | 可安装 |
| 4 | amap-skills | — | 高德地图 JSAPI v2.0（官方） | 可安装 |
| 5 | threejs-skills | — | Three.js 核心 10 模块 | 可安装 |
安装优先级推荐
📌 核心理念：先稳后快。AI 能帮你把代码写快，但只有底层规范、类型策略和组件模式沉淀下来，"稳"才能被补上。
| 优先级 | 层次 | 推荐 Skill | 说明 |
|---|---|---|---|
| L1 基础规范 | 编码规范 | vercel-react-best-practices（✅ 已安装） | 统一团队写法 |
| L1 基础规范 | TS 类型约束 | typescript-advanced-types（⚡ 已融入） | 复杂泛型约束 |
| L2 组件工程 | 组件拆分 | react:components（⚡ 已融入） | 组件边界判定 |
| L2 组件工程 | UI 模式 | ui-component-patterns（10.5K） | 模式复用 |
| L3 接口契约 | 契约自动化 | openapi-to-typescript（⚡ 已融入 S4） | 接口类型同步 |
| L3 接口契约 | 评审规范 | typescript-react-reviewer（2.7K） | React + TS 评审 |
状态说明
| 标记 | 含义 |
|---|---|
| ✅ 已安装 | 已在本地 Skill 体系中 |
| ⚡ 已融入 | 核心能力已内化到自研 Skill，无需额外安装 |
| 可安装 | 社区可用，按需安装 |
— | 空位，待后续搜索时自动填充 |