performance
Audits web performance against Lighthouse metrics and a fixed resource budget, then returns concrete fixes for loading, rendering, and runtime bottlenecks.
Setup & Installation
What This Skill Does
Audits web performance against Lighthouse metrics and a fixed resource budget, then returns concrete fixes for loading, rendering, and runtime bottlenecks. Covers critical rendering path, image and font delivery, caching headers, and third-party script strategies.
Ties each fix to a specific Core Web Vital and gives ready-to-paste HTML, CSS, and JS snippets instead of abstract advice.
When to use it
- Cutting LCP on a hero image by switching to AVIF with fetchpriority high
- Replacing a full lodash import with per-function imports to shrink the JS bundle
- Setting Cache-Control immutable on hashed static assets and no-cache on HTML
- Deferring a chat widget until the user scrolls near the footer
- Batching DOM reads and writes to stop layout thrashing in a scroll handler
Similar Skills
ios-application-dev
A reference guide for building iOS apps with UIKit, SnapKit, and SwiftUI.
fullstack-dev
A workflow guide for building full-stack applications, covering backend architecture, frontend-backend integration, auth, real-time features, and production hardening.
android-native-dev
A reference guide for Android native development covering Kotlin/Compose patterns, Material Design 3 specs, Gradle project setup, and build troubleshooting.
frontend-dev
Builds complete frontend pages by combining UI design, scroll animations, AI-generated media assets, and copywriting into a single workflow.