kozz36/frontend-architect-skill
GitHub: kozz36/frontend-architect-skill
为 AI 编码代理提供经过实时来源验证的前端架构技能定义，解决代理在架构决策中产生技术幻觉和推荐过时方案的问题。
Stars: 0 | Forks: 0
# 🏗️ frontend-architect-skill
[](https://opensource.org/licenses/Apache-2.0)
## 为什么需要这个项目
AI 代理（Cursor、Claude Code、Copilot）如今会直接读取我们的代码库。结构糟糕的 `SKILL.md` 会导致代理产生模式幻觉、推荐已弃用的技术栈，或者完全忽略安全加固。
这项技能是用于前端架构决策的**经过验证、具有明确倾向性的参考资料** —— 涵盖了框架选择、渲染策略、状态管理、测试、可访问性、**OWASP 客户端安全**、**面向 AI 的治理**以及**绿色网络（Green Web）可持续性**。
基于一份分析了 2025-2026 年前端生态系统的 688 行研究文档构建，并随后通过实时来源进行了交叉核对（使用 Playwright + arXiv 验证）。
## 📦 版本
| 版本 | 文件 | 大小 | 适用场景 |
|---------|------|------|-------------|
| **v3.1.1**（当前版本） | [`versions/v3.1.1/SKILL.md`](versions/v3.1.1/SKILL.md) | 精简运行时 + 参考资料 | 针对规范声明、兼容性门控、安全性和来源可追溯性的独立验证精确补丁 |
| **v3.1**（历史版本） | [`versions/v3.1/SKILL.md`](versions/v3.1/SKILL.md) | 精简运行时 + 参考资料 | 2026 年 7 月原生平台和架构更新 |
| **v3.0**（历史版本） | [`versions/v3.0/SKILL.md`](versions/v3.0/SKILL.md) | 约 55 行 + 参考资料 | 2026 年 5 月基于参考资料的运行时技能 |
| **v2.0**（历史版本） | [`versions/v2.0/SKILL.md`](versions/v2.0/SKILL.md) | 约 556 行 | 为向后兼容而保留；在复用前请对照 v3 验证相关声明 |
| **v2.0-lite**（历史版本） | [`versions/v2.0-lite/SKILL.md`](versions/v2.0-lite/SKILL.md) | 约 385 行 | 为向后兼容而保留；v3.1.1 已将其替换为活跃运行时的摄入来源 |
| **v1.0**（原始版本） | [`versions/v1.0/SKILL.md`](versions/v1.0/SKILL.md) | 约 367 行 | 2026 年以前的参考。为向后兼容而保留 |
### v3.1.1 的新增内容（2026 年 7 月）
已根据原始来源进行独立审计：
- 将 CI 实验室预算与通过 RUM/CrUX 测量的生产环境 Core Web Vitals 分开。
- 修正了 WCAG 2.5.8、EAA 范围、MPA View Transitions 资格、浏览器存储和 Cookie 策略。
- 单独记录了规范成熟度和目标浏览器验证情况。
- 移除了针对 SPA、tRPC、TypeScript、ADR、碳足迹、视觉回归和框架的绝对性启发式规则。
- 将所有危险信号与条件架构门控进行了协调统一。
## 🚀 快速开始
### 针对 AI 代理（Cursor、Claude Code 等）
```
# Clone 到你的 skills 目录中
git clone https://github.com/kozz36/frontend-architect-skill.git
# 使用符合你需求的版本：
# - Full → 详细的架构规划
# - Lite → 约束条件下的快速 stack 选择
```
### 针对人类架构师
打开 `versions/v3.1.1/SKILL.md` 查看运行时契约，然后使用 `versions/v3.1.1/references/technical-reference.md` 获取详细的对照表。关键参考领域：
- **第 13 节** — 快速技术栈选择器（决策树）
- **第 9 节** — 安全加固检查清单
- **第 10 节** — 用于您下一个 RFC 的 ADR 模板
## 📁 结构
```
versions/
├── v1.0/
│ └── SKILL.md # Original (pre-2026)
├── v2.0/
│ └── SKILL.md # Historical full reference
├── v2.0-lite/
│ └── SKILL.md # Historical condensed reference
├── v3.0/ # Historical May 2026 runtime
├── v3.1/ # Historical July 2026 runtime
└── v3.1.1/
├── SKILL.md # Current compact runtime contract
└── references/
├── technical-reference.md
└── source-index.md
docs/
├── CHANGELOG.md # Verified version history
└── CONTRIBUTING.md # How to contribute improvements
```
## 🔍 验证方法
每个版本的声明均已通过实时来源验证：
| 来源 | 验证方法 | 状态 |
|--------|---------------------|--------|
| Next.js 16 | Playwright 导航 nextjs.org/blog/next-16 | ✅ 真实（2025 年 10 月） |
| Nuxt 4 | 委托代理 → nuxt.com/docs/4.x | ✅ 真实（2025 年 7 月） |
| Vitest 4.1.5 | Playwright 导航 vitest.dev | ✅ 真实（2026 年 4 月） |
| Vue 3.6 | 委托代理 → vuejs.org + GitHub PRs | ⚠️ 仅为 Beta 版 |
| OWASP 客户端 | 委托代理 → owasp.org | ✅ 真实，活跃 |
| EAA 指令 | 委托代理 → commission.europa.eu | ✅ 真实，已强制执行 |
| Workstream 论文 | Playwright → arxiv.org/abs/2604.17055 | ✅ 真实 |
## 📝 许可证
Apache-2.0
**维护者：** [@kozz36](https://github.com/kozz36)
**研究基础：** "Evaluación y Mejora de Skill"（688 行生态系统分析，2026 年）
标签：Web安全, 前端架构, 可持续计算, 开发规范, 特征检测, 蓝队分析, 防御加固