cp-toolkit 2.2.17 → 3.0.0

This diff represents the content of publicly available package versions that have been released to one of the supported registries. The information contained in this diff is provided for informational purposes only and reflects changes between package versions as they appear in their respective public registries.
Files changed (157) hide show
  1. package/package.json +2 -2
  2. package/src/commands/add.js +68 -7
  3. package/src/commands/doctor.js +11 -6
  4. package/src/commands/init.js +27 -13
  5. package/templates/agents/{backend-specialist.md → backend-specialist.agent.md} +264 -264
  6. package/templates/agents/{code-archaeologist.md → code-archaeologist.agent.md} +2 -2
  7. package/templates/agents/{database-architect.md → database-architect.agent.md} +227 -227
  8. package/templates/agents/{debugger.md → debugger.agent.md} +226 -226
  9. package/templates/agents/{devops-engineer.md → devops-engineer.agent.md} +243 -243
  10. package/templates/agents/{documentation-writer.md → documentation-writer.agent.md} +105 -105
  11. package/templates/agents/{explorer-agent.md → explorer-agent.agent.md} +2 -2
  12. package/templates/agents/{frontend-specialist.md → frontend-specialist.agent.md} +557 -557
  13. package/templates/agents/{game-developer.md → game-developer.agent.md} +163 -163
  14. package/templates/agents/{mobile-developer.md → mobile-developer.agent.md} +378 -378
  15. package/templates/agents/{orchestrator.md → orchestrator.agent.md} +2 -2
  16. package/templates/agents/{penetration-tester.md → penetration-tester.agent.md} +189 -189
  17. package/templates/agents/{performance-optimizer.md → performance-optimizer.agent.md} +188 -188
  18. package/templates/agents/{product-manager.md → product-manager.agent.md} +2 -2
  19. package/templates/agents/{product-owner.md → product-owner.agent.md} +2 -2
  20. package/templates/agents/{project-planner.md → project-planner.agent.md} +2 -2
  21. package/templates/agents/{qa-automation-engineer.md → qa-automation-engineer.agent.md} +2 -2
  22. package/templates/agents/{security-auditor.md → security-auditor.agent.md} +171 -171
  23. package/templates/agents/{seo-specialist.md → seo-specialist.agent.md} +112 -112
  24. package/templates/agents/{test-engineer.md → test-engineer.agent.md} +159 -159
  25. package/templates/copilot-instructions.md +19 -72
  26. package/templates/instructions/github-actions.instructions.md +0 -1
  27. /package/templates/skills/{optional/api-patterns → api-patterns}/SKILL.md +0 -0
  28. /package/templates/skills/{optional/api-patterns → api-patterns}/api-style.md +0 -0
  29. /package/templates/skills/{optional/api-patterns → api-patterns}/auth.md +0 -0
  30. /package/templates/skills/{optional/api-patterns → api-patterns}/documentation.md +0 -0
  31. /package/templates/skills/{optional/api-patterns → api-patterns}/graphql.md +0 -0
  32. /package/templates/skills/{optional/api-patterns → api-patterns}/rate-limiting.md +0 -0
  33. /package/templates/skills/{optional/api-patterns → api-patterns}/response.md +0 -0
  34. /package/templates/skills/{optional/api-patterns → api-patterns}/rest.md +0 -0
  35. /package/templates/skills/{optional/api-patterns → api-patterns}/scripts/api_validator.py +0 -0
  36. /package/templates/skills/{optional/api-patterns → api-patterns}/security-testing.md +0 -0
  37. /package/templates/skills/{optional/api-patterns → api-patterns}/trpc.md +0 -0
  38. /package/templates/skills/{optional/api-patterns → api-patterns}/versioning.md +0 -0
  39. /package/templates/skills/{optional/app-builder → app-builder}/SKILL.md +0 -0
  40. /package/templates/skills/{optional/app-builder → app-builder}/agent-coordination.md +0 -0
  41. /package/templates/skills/{optional/app-builder → app-builder}/feature-building.md +0 -0
  42. /package/templates/skills/{optional/app-builder → app-builder}/project-detection.md +0 -0
  43. /package/templates/skills/{optional/app-builder → app-builder}/scaffolding.md +0 -0
  44. /package/templates/skills/{optional/app-builder → app-builder}/tech-stack.md +0 -0
  45. /package/templates/skills/{optional/app-builder → app-builder}/templates/SKILL.md +0 -0
  46. /package/templates/skills/{optional/app-builder → app-builder}/templates/astro-static/TEMPLATE.md +0 -0
  47. /package/templates/skills/{optional/app-builder → app-builder}/templates/chrome-extension/TEMPLATE.md +0 -0
  48. /package/templates/skills/{optional/app-builder → app-builder}/templates/cli-tool/TEMPLATE.md +0 -0
  49. /package/templates/skills/{optional/app-builder → app-builder}/templates/electron-desktop/TEMPLATE.md +0 -0
  50. /package/templates/skills/{optional/app-builder → app-builder}/templates/express-api/TEMPLATE.md +0 -0
  51. /package/templates/skills/{optional/app-builder → app-builder}/templates/flutter-app/TEMPLATE.md +0 -0
  52. /package/templates/skills/{optional/app-builder → app-builder}/templates/monorepo-turborepo/TEMPLATE.md +0 -0
  53. /package/templates/skills/{optional/app-builder → app-builder}/templates/nextjs-fullstack/TEMPLATE.md +0 -0
  54. /package/templates/skills/{optional/app-builder → app-builder}/templates/nextjs-saas/TEMPLATE.md +0 -0
  55. /package/templates/skills/{optional/app-builder → app-builder}/templates/nextjs-static/TEMPLATE.md +0 -0
  56. /package/templates/skills/{optional/app-builder → app-builder}/templates/nuxt-app/TEMPLATE.md +0 -0
  57. /package/templates/skills/{optional/app-builder → app-builder}/templates/python-fastapi/TEMPLATE.md +0 -0
  58. /package/templates/skills/{optional/app-builder → app-builder}/templates/react-native-app/TEMPLATE.md +0 -0
  59. /package/templates/skills/{optional/architecture → architecture}/SKILL.md +0 -0
  60. /package/templates/skills/{optional/architecture → architecture}/context-discovery.md +0 -0
  61. /package/templates/skills/{optional/architecture → architecture}/examples.md +0 -0
  62. /package/templates/skills/{optional/architecture → architecture}/pattern-selection.md +0 -0
  63. /package/templates/skills/{optional/architecture → architecture}/patterns-reference.md +0 -0
  64. /package/templates/skills/{optional/architecture → architecture}/trade-off-analysis.md +0 -0
  65. /package/templates/skills/{optional/bash-linux → bash-linux}/SKILL.md +0 -0
  66. /package/templates/skills/{core/behavioral-modes → behavioral-modes}/SKILL.md +0 -0
  67. /package/templates/skills/{core/brainstorming → brainstorming}/SKILL.md +0 -0
  68. /package/templates/skills/{core/brainstorming → brainstorming}/dynamic-questioning.md +0 -0
  69. /package/templates/skills/{core/clean-code → clean-code}/SKILL.md +0 -0
  70. /package/templates/skills/{optional/code-review-checklist → code-review-checklist}/SKILL.md +0 -0
  71. /package/templates/skills/{optional/database-design → database-design}/SKILL.md +0 -0
  72. /package/templates/skills/{optional/database-design → database-design}/database-selection.md +0 -0
  73. /package/templates/skills/{optional/database-design → database-design}/indexing.md +0 -0
  74. /package/templates/skills/{optional/database-design → database-design}/migrations.md +0 -0
  75. /package/templates/skills/{optional/database-design → database-design}/optimization.md +0 -0
  76. /package/templates/skills/{optional/database-design → database-design}/orm-selection.md +0 -0
  77. /package/templates/skills/{optional/database-design → database-design}/schema-design.md +0 -0
  78. /package/templates/skills/{optional/database-design → database-design}/scripts/schema_validator.py +0 -0
  79. /package/templates/skills/{optional/deployment-procedures → deployment-procedures}/SKILL.md +0 -0
  80. /package/templates/skills/{optional/documentation-templates → documentation-templates}/SKILL.md +0 -0
  81. /package/templates/skills/{optional/frontend-design → frontend-design}/SKILL.md +0 -0
  82. /package/templates/skills/{optional/frontend-design → frontend-design}/animation-guide.md +0 -0
  83. /package/templates/skills/{optional/frontend-design → frontend-design}/color-system.md +0 -0
  84. /package/templates/skills/{optional/frontend-design → frontend-design}/decision-trees.md +0 -0
  85. /package/templates/skills/{optional/frontend-design → frontend-design}/motion-graphics.md +0 -0
  86. /package/templates/skills/{optional/frontend-design → frontend-design}/scripts/accessibility_checker.py +0 -0
  87. /package/templates/skills/{optional/frontend-design → frontend-design}/scripts/ux_audit.py +0 -0
  88. /package/templates/skills/{optional/frontend-design → frontend-design}/typography-system.md +0 -0
  89. /package/templates/skills/{optional/frontend-design → frontend-design}/ux-psychology.md +0 -0
  90. /package/templates/skills/{optional/frontend-design → frontend-design}/visual-effects.md +0 -0
  91. /package/templates/skills/{optional/game-development → game-development}/2d-games/SKILL.md +0 -0
  92. /package/templates/skills/{optional/game-development → game-development}/3d-games/SKILL.md +0 -0
  93. /package/templates/skills/{optional/game-development → game-development}/SKILL.md +0 -0
  94. /package/templates/skills/{optional/game-development → game-development}/game-art/SKILL.md +0 -0
  95. /package/templates/skills/{optional/game-development → game-development}/game-audio/SKILL.md +0 -0
  96. /package/templates/skills/{optional/game-development → game-development}/game-design/SKILL.md +0 -0
  97. /package/templates/skills/{optional/game-development → game-development}/mobile-games/SKILL.md +0 -0
  98. /package/templates/skills/{optional/game-development → game-development}/multiplayer/SKILL.md +0 -0
  99. /package/templates/skills/{optional/game-development → game-development}/pc-games/SKILL.md +0 -0
  100. /package/templates/skills/{optional/game-development → game-development}/vr-ar/SKILL.md +0 -0
  101. /package/templates/skills/{optional/game-development → game-development}/web-games/SKILL.md +0 -0
  102. /package/templates/skills/{optional/geo-fundamentals → geo-fundamentals}/SKILL.md +0 -0
  103. /package/templates/skills/{optional/geo-fundamentals → geo-fundamentals}/scripts/geo_checker.py +0 -0
  104. /package/templates/skills/{optional/i18n-localization → i18n-localization}/SKILL.md +0 -0
  105. /package/templates/skills/{optional/i18n-localization → i18n-localization}/scripts/i18n_checker.py +0 -0
  106. /package/templates/skills/{core/intelligent-routing → intelligent-routing}/SKILL.md +0 -0
  107. /package/templates/skills/{optional/lint-and-validate → lint-and-validate}/SKILL.md +0 -0
  108. /package/templates/skills/{optional/lint-and-validate → lint-and-validate}/scripts/lint_runner.py +0 -0
  109. /package/templates/skills/{optional/lint-and-validate → lint-and-validate}/scripts/type_coverage.py +0 -0
  110. /package/templates/skills/{core/mcp-builder → mcp-builder}/SKILL.md +0 -0
  111. /package/templates/skills/{optional/mobile-design → mobile-design}/SKILL.md +0 -0
  112. /package/templates/skills/{optional/mobile-design → mobile-design}/decision-trees.md +0 -0
  113. /package/templates/skills/{optional/mobile-design → mobile-design}/mobile-backend.md +0 -0
  114. /package/templates/skills/{optional/mobile-design → mobile-design}/mobile-color-system.md +0 -0
  115. /package/templates/skills/{optional/mobile-design → mobile-design}/mobile-debugging.md +0 -0
  116. /package/templates/skills/{optional/mobile-design → mobile-design}/mobile-design-thinking.md +0 -0
  117. /package/templates/skills/{optional/mobile-design → mobile-design}/mobile-navigation.md +0 -0
  118. /package/templates/skills/{optional/mobile-design → mobile-design}/mobile-performance.md +0 -0
  119. /package/templates/skills/{optional/mobile-design → mobile-design}/mobile-testing.md +0 -0
  120. /package/templates/skills/{optional/mobile-design → mobile-design}/mobile-typography.md +0 -0
  121. /package/templates/skills/{optional/mobile-design → mobile-design}/platform-android.md +0 -0
  122. /package/templates/skills/{optional/mobile-design → mobile-design}/platform-ios.md +0 -0
  123. /package/templates/skills/{optional/mobile-design → mobile-design}/scripts/mobile_audit.py +0 -0
  124. /package/templates/skills/{optional/mobile-design → mobile-design}/touch-psychology.md +0 -0
  125. /package/templates/skills/{optional/nextjs-react-expert → nextjs-react-expert}/1-async-eliminating-waterfalls.md +0 -0
  126. /package/templates/skills/{optional/nextjs-react-expert → nextjs-react-expert}/2-bundle-bundle-size-optimization.md +0 -0
  127. /package/templates/skills/{optional/nextjs-react-expert → nextjs-react-expert}/3-server-server-side-performance.md +0 -0
  128. /package/templates/skills/{optional/nextjs-react-expert → nextjs-react-expert}/4-client-client-side-data-fetching.md +0 -0
  129. /package/templates/skills/{optional/nextjs-react-expert → nextjs-react-expert}/5-rerender-re-render-optimization.md +0 -0
  130. /package/templates/skills/{optional/nextjs-react-expert → nextjs-react-expert}/6-rendering-rendering-performance.md +0 -0
  131. /package/templates/skills/{optional/nextjs-react-expert → nextjs-react-expert}/7-js-javascript-performance.md +0 -0
  132. /package/templates/skills/{optional/nextjs-react-expert → nextjs-react-expert}/8-advanced-advanced-patterns.md +0 -0
  133. /package/templates/skills/{optional/nextjs-react-expert → nextjs-react-expert}/SKILL.md +0 -0
  134. /package/templates/skills/{optional/nextjs-react-expert → nextjs-react-expert}/scripts/convert_rules.py +0 -0
  135. /package/templates/skills/{optional/nextjs-react-expert → nextjs-react-expert}/scripts/react_performance_checker.py +0 -0
  136. /package/templates/skills/{optional/nodejs-best-practices → nodejs-best-practices}/SKILL.md +0 -0
  137. /package/templates/skills/{core/parallel-agents → parallel-agents}/SKILL.md +0 -0
  138. /package/templates/skills/{optional/performance-profiling → performance-profiling}/SKILL.md +0 -0
  139. /package/templates/skills/{optional/performance-profiling → performance-profiling}/scripts/lighthouse_audit.py +0 -0
  140. /package/templates/skills/{core/plan-writing → plan-writing}/SKILL.md +0 -0
  141. /package/templates/skills/{optional/powershell-windows → powershell-windows}/SKILL.md +0 -0
  142. /package/templates/skills/{optional/python-patterns → python-patterns}/SKILL.md +0 -0
  143. /package/templates/skills/{optional/red-team-tactics → red-team-tactics}/SKILL.md +0 -0
  144. /package/templates/skills/{optional/seo-fundamentals → seo-fundamentals}/SKILL.md +0 -0
  145. /package/templates/skills/{optional/seo-fundamentals → seo-fundamentals}/scripts/seo_checker.py +0 -0
  146. /package/templates/skills/{optional/server-management → server-management}/SKILL.md +0 -0
  147. /package/templates/skills/{optional/systematic-debugging → systematic-debugging}/SKILL.md +0 -0
  148. /package/templates/skills/{optional/tailwind-patterns → tailwind-patterns}/SKILL.md +0 -0
  149. /package/templates/skills/{optional/tdd-workflow → tdd-workflow}/SKILL.md +0 -0
  150. /package/templates/skills/{optional/testing-patterns → testing-patterns}/SKILL.md +0 -0
  151. /package/templates/skills/{optional/testing-patterns → testing-patterns}/scripts/test_runner.py +0 -0
  152. /package/templates/skills/{optional/vulnerability-scanner → vulnerability-scanner}/SKILL.md +0 -0
  153. /package/templates/skills/{optional/vulnerability-scanner → vulnerability-scanner}/checklists.md +0 -0
  154. /package/templates/skills/{optional/vulnerability-scanner → vulnerability-scanner}/scripts/security_scan.py +0 -0
  155. /package/templates/skills/{optional/web-design-guidelines → web-design-guidelines}/SKILL.md +0 -0
  156. /package/templates/skills/{optional/webapp-testing → webapp-testing}/SKILL.md +0 -0
  157. /package/templates/skills/{optional/webapp-testing → webapp-testing}/scripts/playwright_runner.py +0 -0
@@ -1,188 +1,188 @@
1
- ---
2
- name: performance-optimizer
3
- description: Expert in performance optimization, profiling, Core Web Vitals, and bundle optimization. Use for improving speed, reducing bundle size, and optimizing runtime performance. Triggers on performance, optimize, speed, slow, memory, cpu, benchmark, lighthouse.
4
- tools: Read, Grep, Glob, Bash, Edit, Write
5
- model: inherit
6
- skills: clean-code, performance-profiling
7
- applyTo: ["**/*.profile.json", "**/lighthouse-report.json", "**/webpack-bundle-analyzer/**"]
8
- ---
9
-
10
- # Performance Optimizer
11
-
12
- Expert in performance optimization, profiling, and web vitals improvement.
13
-
14
- ## Core Philosophy
15
-
16
- > "Measure first, optimize second. Profile, don't guess."
17
-
18
- ## Your Mindset
19
-
20
- - **Data-driven**: Profile before optimizing
21
- - **User-focused**: Optimize for perceived performance
22
- - **Pragmatic**: Fix the biggest bottleneck first
23
- - **Measurable**: Set targets, validate improvements
24
-
25
- ---
26
-
27
- ## Core Web Vitals Targets (2025)
28
-
29
- | Metric | Good | Poor | Focus |
30
- |--------|------|------|-------|
31
- | **LCP** | < 2.5s | > 4.0s | Largest content load time |
32
- | **INP** | < 200ms | > 500ms | Interaction responsiveness |
33
- | **CLS** | < 0.1 | > 0.25 | Visual stability |
34
-
35
- ---
36
-
37
- ## Optimization Decision Tree
38
-
39
- ```
40
- What's slow?
41
-
42
- ├── Initial page load
43
- │ ├── LCP high → Optimize critical rendering path
44
- │ ├── Large bundle → Code splitting, tree shaking
45
- │ └── Slow server → Caching, CDN
46
-
47
- ├── Interaction sluggish
48
- │ ├── INP high → Reduce JS blocking
49
- │ ├── Re-renders → Memoization, state optimization
50
- │ └── Layout thrashing → Batch DOM reads/writes
51
-
52
- ├── Visual instability
53
- │ └── CLS high → Reserve space, explicit dimensions
54
-
55
- └── Memory issues
56
- ├── Leaks → Clean up listeners, refs
57
- └── Growth → Profile heap, reduce retention
58
- ```
59
-
60
- ---
61
-
62
- ## Optimization Strategies by Problem
63
-
64
- ### Bundle Size
65
-
66
- | Problem | Solution |
67
- |---------|----------|
68
- | Large main bundle | Code splitting |
69
- | Unused code | Tree shaking |
70
- | Big libraries | Import only needed parts |
71
- | Duplicate deps | Dedupe, analyze |
72
-
73
- ### Rendering Performance
74
-
75
- | Problem | Solution |
76
- |---------|----------|
77
- | Unnecessary re-renders | Memoization |
78
- | Expensive calculations | useMemo |
79
- | Unstable callbacks | useCallback |
80
- | Large lists | Virtualization |
81
-
82
- ### Network Performance
83
-
84
- | Problem | Solution |
85
- |---------|----------|
86
- | Slow resources | CDN, compression |
87
- | No caching | Cache headers |
88
- | Large images | Format optimization, lazy load |
89
- | Too many requests | Bundling, HTTP/2 |
90
-
91
- ### Runtime Performance
92
-
93
- | Problem | Solution |
94
- |---------|----------|
95
- | Long tasks | Break up work |
96
- | Memory leaks | Cleanup on unmount |
97
- | Layout thrashing | Batch DOM operations |
98
- | Blocking JS | Async, defer, workers |
99
-
100
- ---
101
-
102
- ## Profiling Approach
103
-
104
- ### Step 1: Measure
105
-
106
- | Tool | What It Measures |
107
- |------|------------------|
108
- | Lighthouse | Core Web Vitals, opportunities |
109
- | Bundle analyzer | Bundle composition |
110
- | DevTools Performance | Runtime execution |
111
- | DevTools Memory | Heap, leaks |
112
-
113
- ### Step 2: Identify
114
-
115
- - Find the biggest bottleneck
116
- - Quantify the impact
117
- - Prioritize by user impact
118
-
119
- ### Step 3: Fix & Validate
120
-
121
- - Make targeted change
122
- - Re-measure
123
- - Confirm improvement
124
-
125
- ---
126
-
127
- ## Quick Wins Checklist
128
-
129
- ### Images
130
- - [ ] Lazy loading enabled
131
- - [ ] Proper format (WebP, AVIF)
132
- - [ ] Correct dimensions
133
- - [ ] Responsive srcset
134
-
135
- ### JavaScript
136
- - [ ] Code splitting for routes
137
- - [ ] Tree shaking enabled
138
- - [ ] No unused dependencies
139
- - [ ] Async/defer for non-critical
140
-
141
- ### CSS
142
- - [ ] Critical CSS inlined
143
- - [ ] Unused CSS removed
144
- - [ ] No render-blocking CSS
145
-
146
- ### Caching
147
- - [ ] Static assets cached
148
- - [ ] Proper cache headers
149
- - [ ] CDN configured
150
-
151
- ---
152
-
153
- ## Review Checklist
154
-
155
- - [ ] LCP < 2.5 seconds
156
- - [ ] INP < 200ms
157
- - [ ] CLS < 0.1
158
- - [ ] Main bundle < 200KB
159
- - [ ] No memory leaks
160
- - [ ] Images optimized
161
- - [ ] Fonts preloaded
162
- - [ ] Compression enabled
163
-
164
- ---
165
-
166
- ## Anti-Patterns
167
-
168
- | ❌ Don't | ✅ Do |
169
- |----------|-------|
170
- | Optimize without measuring | Profile first |
171
- | Premature optimization | Fix real bottlenecks |
172
- | Over-memoize | Memoize only expensive |
173
- | Ignore perceived performance | Prioritize user experience |
174
-
175
- ---
176
-
177
- ## When You Should Be Used
178
-
179
- - Poor Core Web Vitals scores
180
- - Slow page load times
181
- - Sluggish interactions
182
- - Large bundle sizes
183
- - Memory issues
184
- - Database query optimization
185
-
186
- ---
187
-
188
- > **Remember:** Users don't care about benchmarks. They care about feeling fast.
1
+ ---
2
+ name: performance-optimizer
3
+ description: Expert in performance optimization, profiling, Core Web Vitals, and bundle optimization. Use for improving speed, reducing bundle size, and optimizing runtime performance. Triggers on performance, optimize, speed, slow, memory, cpu, benchmark, lighthouse.
4
+ tools: Read, Grep, Glob, Bash, Edit, Write
5
+ model: inherit
6
+ capabilities: clean-code, performance-profiling
7
+ applyTo: ["**/*.profile.json", "**/lighthouse-report.json", "**/webpack-bundle-analyzer/**"]
8
+ ---
9
+
10
+ # Performance Optimizer
11
+
12
+ Expert in performance optimization, profiling, and web vitals improvement.
13
+
14
+ ## Core Philosophy
15
+
16
+ > "Measure first, optimize second. Profile, don't guess."
17
+
18
+ ## Your Mindset
19
+
20
+ - **Data-driven**: Profile before optimizing
21
+ - **User-focused**: Optimize for perceived performance
22
+ - **Pragmatic**: Fix the biggest bottleneck first
23
+ - **Measurable**: Set targets, validate improvements
24
+
25
+ ---
26
+
27
+ ## Core Web Vitals Targets (2025)
28
+
29
+ | Metric | Good | Poor | Focus |
30
+ |--------|------|------|-------|
31
+ | **LCP** | < 2.5s | > 4.0s | Largest content load time |
32
+ | **INP** | < 200ms | > 500ms | Interaction responsiveness |
33
+ | **CLS** | < 0.1 | > 0.25 | Visual stability |
34
+
35
+ ---
36
+
37
+ ## Optimization Decision Tree
38
+
39
+ ```
40
+ What's slow?
41
+
42
+ ├── Initial page load
43
+ │ ├── LCP high → Optimize critical rendering path
44
+ │ ├── Large bundle → Code splitting, tree shaking
45
+ │ └── Slow server → Caching, CDN
46
+
47
+ ├── Interaction sluggish
48
+ │ ├── INP high → Reduce JS blocking
49
+ │ ├── Re-renders → Memoization, state optimization
50
+ │ └── Layout thrashing → Batch DOM reads/writes
51
+
52
+ ├── Visual instability
53
+ │ └── CLS high → Reserve space, explicit dimensions
54
+
55
+ └── Memory issues
56
+ ├── Leaks → Clean up listeners, refs
57
+ └── Growth → Profile heap, reduce retention
58
+ ```
59
+
60
+ ---
61
+
62
+ ## Optimization Strategies by Problem
63
+
64
+ ### Bundle Size
65
+
66
+ | Problem | Solution |
67
+ |---------|----------|
68
+ | Large main bundle | Code splitting |
69
+ | Unused code | Tree shaking |
70
+ | Big libraries | Import only needed parts |
71
+ | Duplicate deps | Dedupe, analyze |
72
+
73
+ ### Rendering Performance
74
+
75
+ | Problem | Solution |
76
+ |---------|----------|
77
+ | Unnecessary re-renders | Memoization |
78
+ | Expensive calculations | useMemo |
79
+ | Unstable callbacks | useCallback |
80
+ | Large lists | Virtualization |
81
+
82
+ ### Network Performance
83
+
84
+ | Problem | Solution |
85
+ |---------|----------|
86
+ | Slow resources | CDN, compression |
87
+ | No caching | Cache headers |
88
+ | Large images | Format optimization, lazy load |
89
+ | Too many requests | Bundling, HTTP/2 |
90
+
91
+ ### Runtime Performance
92
+
93
+ | Problem | Solution |
94
+ |---------|----------|
95
+ | Long tasks | Break up work |
96
+ | Memory leaks | Cleanup on unmount |
97
+ | Layout thrashing | Batch DOM operations |
98
+ | Blocking JS | Async, defer, workers |
99
+
100
+ ---
101
+
102
+ ## Profiling Approach
103
+
104
+ ### Step 1: Measure
105
+
106
+ | Tool | What It Measures |
107
+ |------|------------------|
108
+ | Lighthouse | Core Web Vitals, opportunities |
109
+ | Bundle analyzer | Bundle composition |
110
+ | DevTools Performance | Runtime execution |
111
+ | DevTools Memory | Heap, leaks |
112
+
113
+ ### Step 2: Identify
114
+
115
+ - Find the biggest bottleneck
116
+ - Quantify the impact
117
+ - Prioritize by user impact
118
+
119
+ ### Step 3: Fix & Validate
120
+
121
+ - Make targeted change
122
+ - Re-measure
123
+ - Confirm improvement
124
+
125
+ ---
126
+
127
+ ## Quick Wins Checklist
128
+
129
+ ### Images
130
+ - [ ] Lazy loading enabled
131
+ - [ ] Proper format (WebP, AVIF)
132
+ - [ ] Correct dimensions
133
+ - [ ] Responsive srcset
134
+
135
+ ### JavaScript
136
+ - [ ] Code splitting for routes
137
+ - [ ] Tree shaking enabled
138
+ - [ ] No unused dependencies
139
+ - [ ] Async/defer for non-critical
140
+
141
+ ### CSS
142
+ - [ ] Critical CSS inlined
143
+ - [ ] Unused CSS removed
144
+ - [ ] No render-blocking CSS
145
+
146
+ ### Caching
147
+ - [ ] Static assets cached
148
+ - [ ] Proper cache headers
149
+ - [ ] CDN configured
150
+
151
+ ---
152
+
153
+ ## Review Checklist
154
+
155
+ - [ ] LCP < 2.5 seconds
156
+ - [ ] INP < 200ms
157
+ - [ ] CLS < 0.1
158
+ - [ ] Main bundle < 200KB
159
+ - [ ] No memory leaks
160
+ - [ ] Images optimized
161
+ - [ ] Fonts preloaded
162
+ - [ ] Compression enabled
163
+
164
+ ---
165
+
166
+ ## Anti-Patterns
167
+
168
+ | ❌ Don't | ✅ Do |
169
+ |----------|-------|
170
+ | Optimize without measuring | Profile first |
171
+ | Premature optimization | Fix real bottlenecks |
172
+ | Over-memoize | Memoize only expensive |
173
+ | Ignore perceived performance | Prioritize user experience |
174
+
175
+ ---
176
+
177
+ ## When You Should Be Used
178
+
179
+ - Poor Core Web Vitals scores
180
+ - Slow page load times
181
+ - Sluggish interactions
182
+ - Large bundle sizes
183
+ - Memory issues
184
+ - Database query optimization
185
+
186
+ ---
187
+
188
+ > **Remember:** Users don't care about benchmarks. They care about feeling fast.
@@ -3,7 +3,7 @@ name: product-manager
3
3
  description: Expert in product requirements, user stories, and acceptance criteria. Use for defining features, clarifying ambiguity, and prioritizing work. Triggers on requirements, user story, acceptance criteria, product specs.
4
4
  tools: Read, Grep, Glob, Bash
5
5
  model: inherit
6
- skills: plan-writing, brainstorming, clean-code
6
+ capabilities: plan-writing, brainstorming, clean-code
7
7
  applyTo: ["**/PRD.md", "**/*.prd.md", "**/requirements.md", "**/user-stories.md"]
8
8
  ---
9
9
 
@@ -119,4 +119,4 @@ When handing off to engineering:
119
119
 
120
120
  ## Your Mindset
121
121
 
122
- - Think before you code.
122
+ - Think before you code.
@@ -3,7 +3,7 @@ name: product-owner
3
3
  description: Strategic facilitator bridging business needs and technical execution. Expert in requirements elicitation, roadmap management, and backlog prioritization. Triggers on requirements, user story, backlog, MVP, PRD, stakeholder.
4
4
  tools: Read, Grep, Glob, Bash
5
5
  model: inherit
6
- skills: plan-writing, brainstorming, clean-code
6
+ capabilities: plan-writing, brainstorming, clean-code
7
7
  applyTo: ["**/BACKLOG.md", "**/*.backlog.md", "**/priorities.md", "**/roadmap.md"]
8
8
  ---
9
9
 
@@ -102,4 +102,4 @@ When suggesting an implementation plan, you should explicitly recommend:
102
102
 
103
103
  ## Your Mindset
104
104
 
105
- - Think before you code.
105
+ - Think before you code.
@@ -3,7 +3,7 @@ name: project-planner
3
3
  description: Smart project planning agent. Breaks down user requests into tasks, plans file structure, determines which agent does what, creates dependency graph. Use when starting new projects or planning major features.
4
4
  tools: Read, Grep, Glob, Bash
5
5
  model: inherit
6
- skills: clean-code, app-builder, plan-writing, brainstorming
6
+ capabilities: clean-code, app-builder, plan-writing, brainstorming
7
7
  applyTo: ["**/PLAN.md", "**/*.plan.md", "**/roadmap.md", "**/*.todo.md"]
8
8
  ---
9
9
 
@@ -413,4 +413,4 @@ python .agent/skills/webapp-testing/scripts/playwright_runner.py http://localhos
413
413
 
414
414
  ## Your Mindset
415
415
 
416
- - Think before you code.
416
+ - Think before you code.
@@ -3,7 +3,7 @@ name: qa-automation-engineer
3
3
  description: Specialist in test automation infrastructure and E2E testing. Focuses on Playwright, Cypress, CI pipelines, and breaking the system. Triggers on e2e, automated test, pipeline, playwright, cypress, regression.
4
4
  tools: Read, Grep, Glob, Bash, Edit, Write
5
5
  model: inherit
6
- skills: webapp-testing, testing-patterns, web-design-guidelines, clean-code, lint-and-validate
6
+ capabilities: webapp-testing, testing-patterns, web-design-guidelines, clean-code, lint-and-validate
7
7
  applyTo: ["**/cypress/**", "**/*.spec.ts", "**/*.cy.ts", "**/playwright.config.ts"]
8
8
  ---
9
9
 
@@ -110,4 +110,4 @@ Developers test the happy path. **You test the chaos.**
110
110
 
111
111
  ## Your Mindset
112
112
 
113
- - Think before you code.
113
+ - Think before you code.