1---
2tagline: "Diagnose and fix UI performance from LCP to bundle size."
3---
4
5## When to use it
6
7`/optimize` is for interfaces that feel slow. First paint takes forever, scrolling janks, images pop in late, interactions feel laggy, the bundle ships 800KB of JavaScript. Use it when the Web Vitals are bad or when users are complaining that things are sluggish.
8
9Do not use it as premature optimization. If LCP is 1.1s and INP is 80ms, stop. The design work matters more.
10
11## How it works
12
13The skill works through five perf dimensions:
14
151. **Loading and Web Vitals**: LCP, INP, CLS. Identify what is blocking the first paint, what is delaying interaction, what is shifting layout.
162. **Rendering**: unnecessary re-renders, missing memoization, expensive reconciliation, layout thrash in loops.
173. **Animations**: is anything animating layout properties, are transforms and opacity the only thing touched, does `will-change` help or hurt here.
184. **Images and assets**: lazy loading, responsive images (`srcset`, `sizes`), modern formats (WebP, AVIF), dimensions set to prevent CLS.
195. **Bundle size**: unused imports, oversized dependencies, missing code-splitting, dead code.
20
21The skill measures before and after. Every fix gets quantified. If a change does not move a metric, it gets rolled back.
22
23## Try it
24
25```
26/optimize the homepage
27```
28
29Expected shape:
30
31```
32LCP: 3.2s → 1.4s
33 - Hero image preloaded (-800ms)
34 - Removed render-blocking font stylesheet (-240ms)
35 - Deferred analytics script (-180ms)
36
37INP: 240ms → 90ms
38 - Debounced scroll handler
39 - Memoized expensive list render
40 - Removed synchronous layout read in event loop
41
42CLS: 0.18 → 0.02
43 - Set dimensions on hero image and logo
44 - Reserved space for async header badge
45
46Bundle: 340KB → 180KB
47 - Removed unused lodash import (52KB)
48 - Code-split the playground route (78KB)
49 - Dropped deprecated icon set (30KB)
50```
51
52## Pitfalls
53
54- **Optimizing before measuring.** Without baseline metrics, you cannot tell what helped. Run `/optimize` with specific Web Vitals numbers, not vibes.
55- **Chasing tiny wins.** A 20ms improvement in INP that takes a week is rarely worth it. Optimize has diminishing returns; know when to stop.
56- **Forgetting to re-measure after every change.** The build could have made things worse in a way the skill did not predict. Verify.