← ClaudeAtlas

frontend-performance-remediationlisted

Reproduce, diagnose, repair, and verify a concrete web or app frontend runtime performance problem and produce a Frontend Runtime Performance Remediation Record. Use when the primary job is jank, long-task latency, animation or scrolling cost, offscreen work, memory or listener growth, idle CPU/GPU use, or degradation after repeated navigation. Do not use for general interface design, backend throughput or load testing, product-wide observability design, or speculative optimization without a reproducible frontend symptom or budget.
SylphxAI/skills · ★ 1 · Web & Frontend · score 74
Install: claude install-skill SylphxAI/skills
# Frontend Performance Remediation Repair a measured frontend runtime failure at its owning lifecycle, rendering, or data-flow boundary. Produce one **Frontend Runtime Performance Remediation Record** with comparable before-and-after evidence. Read [references/frontend-runtime-performance-method.md](references/frontend-runtime-performance-method.md) before choosing instrumentation or a fix. ## Method 1. Freeze the exact candidate, runtime, device and viewport class, route and state, input sequence, data fixture, performance budget or user-visible symptom, and non-goals. 2. Reproduce before editing. Record a repeatable baseline for the failing path and enough control paths to distinguish local cost from application-wide or environmental noise. 3. Inventory every plausible producer of work on the path: rendering and layout, CSS animation, `requestAnimationFrame`, timers, listeners, observers, async work, network and decoding, workers, canvas/WebGL, retained objects, and third-party code. 4. Isolate the mechanism with source inspection plus runtime evidence. Test competing hypotheses; a profiler hotspot without ownership or a code smell without measured impact is not yet a diagnosis. 5. Correct the owning mechanism. Prefer eliminating unnecessary work, bounding lifetime and frequency, moving computation out of the critical path, and making visibility, cancellation, cleanup, and reduced-motion behavior explicit over adding throttling patche