用 Codex 或 Claude 帮你安装 复制这段 Prompt，粘贴到 Codex、Claude 或其他助手里，让它检查 Skill 页面并帮你完成安装。
直接命令不会经过审查 Prompt；运行前请先检查来源。
npx skills add https://github.com/microwind/ai-skills --skill component-analyzer命令会保持在同一行。复制前请横向滚动并检查完整内容。
想先保存到本地？可下载 SkillsMP 当前能够提供的文件。
基于 SOC 职业分类
正在显示 SKILL.md
| name | component-analyzer |
| description | Enhanced skill for component-analyzer |
| license | MIT |
详细的分析和验证 组件-analyzer.
核心原则: Good 组件 are reusable, tes表, and composable. Bad 组件 are brittle and hard to maintain.
始终:
触发短语:
Problem:
Component hardcoded for one use case, not reusable
Consequence:
- Can't reuse elsewhere
- Code duplication
- Maintenance burden
Solution:
Extract props, make flexible
Problem:
Parent re-renders, all children re-render even unchanged
Consequence:
- Performance degradation
- Slow app
- Bad user experience
Solution:
Use React.memo, useMemo
| 问题 | 解决方案 |
|---|---|
| "Not sure where to start" | 识别 the specific issue using the 常见问题 section above. |
| "性能 is poor" | Profile first to 识别 bottleneck before optimizing. |
| "Not sure about 最佳实践" | 检查 the 验证检查清单 to understand quality standards. |
❌ Over-specific (not reusable) ❌ Prop drilling (too many props passed) ❌ Global state for everything ❌ No 错误 boundaries ❌ Side effects in render ❌ Tightly coupled to parent