Performance

Handle $ARGUMENTS.

Use this when a Plate plan claims speed, responsiveness, large-document readiness, or production performance. This skill owns the review shape around cohorts, repeated-unit budgets, p95/p99 interactions, memory/DOM tags, degradation contracts, native editor behavior, trace proof, and RUM gaps. It delegates React/Next micro-tactics, effect law, and complexity analysis to the skills that already own them.

Owner Map

Source	Owns	Use in this pass
`vercel-react-best-practices`	React/Next waterfalls, bundles, server/client fetching, rerenders, rendering, JS micro-opts, React runtime primitives	Load exact rule files for local micro-tactics. Do not paste the whole Vercel catalog into the plan.
`react-useeffect`	Effect law, subscriptions, event/effect alternatives	Use when repeated units attach effects, listeners, observers, or store subscriptions.
`performance-oracle`	Big-O, cache shape, memory pressure, 10x/100x/1000x projections	Use when the hot path needs bounded complexity proof.
Chrome DevTools, Lighthouse, web.dev docs	Browser traces, Core Web Vitals, network chains, layout shifts, long tasks	Use when load, hydration, layout, or input latency needs browser proof.
`performance`	Cohorts, repeated-unit budgets, p95/p99 interactions, memory tags, degradation, native behavior proof, RUM/dashboard gaps	Record the final performance-lane verdict.

Rule: if the plan only says "use React best practices", "avoid O(n)", or "seems fast locally", it is not done.

Required Output

Record this in the active plan or review:

### Performance

- applicability: applied | skipped
- Vercel rules used:
- extra rules used:
- repeated unit:
- cohorts:
- budgets:
- React/runtime primitives:
- interaction metrics:
- trace/CWV proof:
- memory tags:
- degradation contract:
- dashboard/RUM gap:
- plan delta:

Keep it short. If this pass cannot change the plan, write the no-change defense with evidence.

Quick Pass

Segment the workload into normal, large, stress, and pathological cohorts.
Name the repeated unit: block, row, cell, leaf, decoration, overlay, island, listener, or subscription.
Set current and target budgets for DOM nodes, components, handlers, effects, subscriptions, allocations, layout reads/writes, and memory per repeated unit.
Simplify the normal path before adding special modes.
Move rare state out of the repeated unit: comments, menus, hover chrome, selection tools, debug panels, context actions.
Add O(1) indexes or cached lookups only where the hot path proves repeated scans.
Choose the degradation contract for aggressive modes: native, DOM-present staged, shell island, virtualized, or model-backed.
Instrument p50/p75/p95/p99 interaction rows by cohort and mode.
Record browser trace proof and production/RUM tags when the claim matters outside the lab.

Done. The review has a workload, a unit budget, an interaction matrix, and a proof path.

Blockers

Stop the performance claim or mark the plan incomplete when any required answer is missing:

Missing answer	Why it blocks
Cohorts	"Large document" has no testable meaning.
Repeated-unit budget	The plan can make one block cheap while making 10,000 blocks impossible.
p95/p99 interaction row	Averages hide input stalls.
Memory/DOM/component tag	Latency wins can explode heap, subscriptions, or mounted DOM.
Degradation contract	Faster modes can silently break browser-native editing behavior.
Native behavior proof	Editor perf is not good if find, copy, paste, selection, IME, undo, or collaboration regress.
Trace or RUM proof	Production-facing claims need browser evidence or dashboard tags.

If a blocker does not apply, say why in one line. Silence is not a pass.

Vercel Rule Selection

Load exact Vercel rule files only when the code or plan needs them:

Symptom	Rule family
Sequential fetches, blocked route work, slow server setup	`async-`, `server-`
Heavy optional UI or package barrels in client bundles	`bundle-*`
Repeated browser listeners, storage reads, duplicate client fetches	`client-*`
Hot editor rows rerender from broad subscriptions or unstable props	`rerender-*`
Long DOM lists, hydration flicker, hidden panels, resource hints	`rendering-*`
Repeated scans, chained array passes, membership checks, cacheable pure work	`js-*`
Stable callbacks, app-wide init, effect event dependency law	`advanced-*`

Use the Vercel rule name in Vercel rules used:. Do not copy its explanation unless the plan needs a specific quote-level constraint.

Extra Rules Owned Here

Load only the relevant rule files. These are the unique performance-lane questions.

Rule	Use when
cohort-segmentation	A plan says "large document", "big list", "stress case", or "performance mode" without normal/large/stress/pathological cohorts.
repeated-unit-budget	Blocks, lines, rows, leaves, groups, decorations, or islands repeat at scale.
rare-state-isolation	Rare UI state is carried by every repeated unit.
event-delegation-budget	Thousands of repeated units attach pointer, hover, keyboard, drag, resize, selection, or scroll handlers.
effect-subscription-budget	Repeated units run effects, subscribe to runtime stores, or resubscribe from unstable callbacks.
css-layout-hotpath	Selectors, layout reads/writes, drag/resize, overlays, or geometry may cause interaction latency.
interaction-inp-matrix	A plan claims responsiveness from averages, startup time, or one smoke benchmark.
memory-dom-tagging	A mode may improve latency by increasing heap, DOM nodes, components, listeners, subscriptions, caches, or mounted groups.
degradation-contract	Performance requires virtualization, shell islands, model-backed selection, staged mounting, or any less-native mode.
staged-readiness	Startup, hydration, full-doc replace, insert-fragment, or staged DOM-present mounting is part of the plan.
react-19-runtime-proof	React 19.2 primitives are proposed for editor/app performance.
browser-trace-cwv-proof	Claims involve load, hydration, network chains, layout shifts, long tasks, LCP/FCP/TBT/CLS, or trace evidence.
production-rum-dashboard	The claim matters beyond local benchmarks and needs release/browser/mobile/IME/document-size tags.
editor-native-behavior-proof	Editor performance changes DOM presence, selection mapping, materialization, shells, hidden content, or model-backed behavior.

Plate Example: Huge Document 10k

Use this shape for a large-document Plate review:

### Performance

- applicability: applied
- Vercel rules used: rerender-derived-state, rerender-defer-reads, js-set-map-lookups
- extra rules used: cohort-segmentation, repeated-unit-budget, interaction-inp-matrix, memory-dom-tagging, editor-native-behavior-proof
- repeated unit: block
- cohorts: normal 100 blocks; large 1,000 blocks; stress 10,000 blocks; pathological 50,000 nested/mixed blocks
- budgets: per block <= 1 element component, 0 per-block global listeners, 0 per-block effects unless scoped by id/range, O(1) id/path lookup for hot interactions
- React/runtime primitives: fast render path and derived subscriptions; transitions only for non-urgent side panels, not editor typing
- interaction metrics: startup, first type, middle type, range select, paste, undo, table range select by p50/p75/p95/p99
- trace/CWV proof: Browser trace for load/hydration if route claim is included; editor interaction trace for typing/select/paste latency
- memory tags: heap, DOM nodes, mounted block count, listener count, subscription count, node-id/cache size
- degradation contract: native DOM-present editing for normal/large; any staged or virtualized mode must list browser find/copy/paste/select-all/IME/undo/collab behavior
- dashboard/RUM gap: tag interaction name, cohort, document size, mode, browser, mobile, IME, release, heap/DOM sample when available
- plan delta: add missing rows before claiming the 10k path is ready

That is enough to review a huge-document claim without rereading the entire performance rule set.

Slate Plan Performance Pass

When used inside slate-plan, record this lens in the implementation review matrix.

Must answer:

Which Vercel rules cover the micro-tactics?
Which extra rule files from this skill apply?
What is the repeated unit and current/target budget?
Which cohorts are normal, large, stress, and pathological?
Which interaction-level INP rows or lab proxies prove responsiveness?
Which memory tags prove heap/DOM/component/listener/subscription counts stay bounded?
Which degradation mode applies only to which cohort?
Which native browser behaviors are preserved or intentionally degraded?
Which React 19.2 primitive applies, and what does it explicitly not solve?
Which Chrome trace or Core Web Vitals proof is relevant, and which load metrics are out of scope?
What Datadog/RUM view would catch the regression?

No-Change Defense

If the performance pass changes nothing, write:

### Performance

- applicability: skipped
- reason:
- evidence:
- residual risk:

The reason must cite current plan evidence. "No obvious perf issue" is not evidence.