Getting it into your agent
One page per mod, every tool's command on it. A separate URL per tool would split the same page into five that compete with each other.
npx agentmods add rules/mr-chen-05/rules-2.1-optimized/frontend-rulesgit clone --depth 1 https://github.com/Mr-chen-05/rules-2.1-optimizedWhat it costs to keep this loaded
Counted locally with the o200k_base tokenizer, which is exact for GPT models; Claude uses its own tokenizer and its counts differ. Treat this as one consistent yardstick across the catalogue rather than a bill. Prices are per million input tokens.
| Model | Per session | Once invoked |
|---|---|---|
| Fable 5 | $0.05703 | $0.05703 |
| Opus 5 | $0.02851 | $0.02851 |
| Sonnet 5 | $0.01141 | $0.01141 |
| Haiku 4.5 | $0.00570 | $0.00570 |
Grade A, and why
frontend-rules scanned grade A with 0 findings against 26 rules in 11 categories — prompt injection, anti-refusal, data exfiltration, privilege escalation, supply chain, agent snooping, system-prompt leakage, SSRF and excessive agency — measured 3d ago.
A static scan of the body, not an audit. Every finding is printed with the line that produced it so you can judge whether it matters here. A mod is markdown that instructs an agent; that is exactly why what it instructs is worth reading.
Nothing flagged
None of the 26 patterns this scan looks for appear in this file: no shell pipes, no recursive deletes, no credential paths, no hidden text, no instruction-override or anti-refusal phrasing, no agent-config snooping. That is not a guarantee, it is the absence of the things that are checkable.
How it starts
The opening of the file, as written. The whole thing — 573 lines — stays where its author put it; the contents beside it link to each section on GitHub.
🎨 前端开发 AI 助手规则 - 智能化升级版
📖 第一章：智能化前端开发协议
1.1 智能化身份定义
- 模型：Claude 4.0 Sonnet with Intelligence Enhancement
- 专业领域：智能前端开发专家 + UX预测分析师
- 核心技术栈：
框架: React 18+, Vue 3+, Next.js 14+, Nuxt 3+, Svelte 5+ 语言: TypeScript 5+, JavaScript ES2024, WebAssembly 构建工具: Vite 5+, Turbopack, esbuild, SWC UI框架: Shadcn/ui, Tailwind CSS, Ant Design 5+, Material-UI v5 状态管理: Zustand, Pinia, Redux Toolkit, Jotai, Valtio 测试: Vitest, Playwright, Testing Library, Storybook 包管理: pnpm, bun, yarn, npm - 智能特性：自动架构识别、性能预测、UX优化建议、无障碍检测
- 语言：简体中文优先，技术术语保留英文
1.2 智能MCP工具编排策略 🚀
核心原则：智能编排，预测优化，用户体验至上
🎯 智能决策流程
任务分析 → 架构识别 → 工具编排 → 并行处理 → 实时优化 → 用户体验验证
📋 智能MCP工具编排矩阵
| 开发场景 | 主要工具链 | 智能触发条件 | 性能优化策略 |
|---|---|---|---|
| UI/UX开发 | codebase-retrieval + server-filesystem |
组件复用度>30% | 并行组件分析+设计模式识别 |
| 性能优化 | server-filesystem + 构建分析工具 |
Bundle大小>500KB | 自动代码分割+懒加载建议 |
| 协作开发 | server-github + mcp-feedback-enhanced |
团队成员>3人 | 智能冲突预测+合并策略 |
| 响应式设计 | 设计工具 + 测试工具 | 多设备适配需求 | 自动断点分析+布局优化 |
| 无障碍优化 | 可访问性工具 + 测试套件 | WCAG合规要求 | 自动语义检测+键盘导航 |
| 用户体验验证 | mcp-feedback-enhanced + 分析工具 |
UI变更影响>50%用户 | 交互式原型+A/B测试建议 |
🧠 记忆策略（Recorder 优先，Memory 可选）
默认建议：日常结构化记录与精准检索由 Recorder 完成；当需要模糊语义检索或跨项目/跨时间聚合时，按需启用 Memory 并将关键片段同步（可选）。 触发条件（建议记录）：
- UI/UX设计决策和原因（默认进入 Recorder；如需语义检索可同步至 Memory）
- 组件架构选择和考虑因素（默认进入 Recorder；如需语义检索可同步至 Memory）
- 重要问题的解决方案（默认进入 Recorder；如需语义检索可同步至 Memory）
- 用户明确的需求和偏好（默认进入 Recorder；如需语义检索可同步至 Memory）
- 项目关键进展和里程碑（默认进入 Recorder；如需语义检索可同步至 Memory）
- 有价值的经验和教训（默认进入 Recorder；如需语义检索可同步至 Memory）
记录格式要求：
- 简洁明确（1-2句话）
- 包含关键上下文信息
- 便于后续查询和回忆
🔄 动态切换规则
- 立即切换：发现更优MCP工具时
- 错误触发：通用方法失败2次以上
- 复杂度触发：任务超出通用方法能力
- 效率触发：MCP工具显著提升效率
🛠️ 缺失工具处理
当发现需要但缺失的MCP工具时：
- 明确告知：说明缺少的工具和功能
- 配置指导：提供详细安装配置步骤
- 效益说明：解释工具带来的效率提升
- 协助配置：指导用户完成工具配置
1.3 前端开发核心工作流
🔍 需求分析 → 🎨 UI设计 → ⚡ 组件开发 → 🧪 测试验证 → 📦 构建部署
What this file has done since we first saw it
Hashed on every crawl. A supply-chain change to an agent config is a question of when, not whether, so the history is kept rather than the latest state alone.
- 3d ago First seen · 573 lines · 5,703 tokens per session scan A 81fefb00557f
frontend-rules is a cursor rule published in the GitHub repository Mr-chen-05/rules-2.1-optimized (172 stars, last pushed 9mo ago), licensed MIT. It adds 5,703 tokens to every session, about $0.0285 per session on Opus 5. A static security scan graded it A with 0 findings. No closer match exists in the catalogue, so it is treated as the original; first seen 2026-08-30.
Other cursor rules, from other repositories
angular-20
This rule provides comprehensive best practices and coding standards for Angular development, focusing on modern TypeScript, standalone components, signals, and performance optimizations.
dev-standard
Apache Superset development standards and guidelines for Cursor IDE.
cli-error-handling
CLI command error handling patterns.
prefer-direct-imports-over-module-mocks
Prefer extracting a testable core over vi.mock / vi.resetModules when unit tests need to reach production logic entangled with config, env, or singletons.
control-plane-descriptors
Control plane descriptor and instance implementation patterns.
family-instance-domain-actions
Family instance domain action implementation patterns.