Read a Lighthouse or CrUX report and narrate LCP, CLS, and INP scores into a prioritized fix plan with concrete code suggestions.
Reads a Lighthouse JSON report or a CrUX API response for one origin and narrates LCP, CLS, and INP scores into a prioritized fix plan. Each prioritized item names the offending element (when available) and a concrete code-level mitigation.
report_path: path to lighthouse-report.json or crux-response.json.report_kind: lighthouse or crux.device: mobile (default) or desktop.lhr.audits; CrUX has record.metrics.good, needs-improvement, poor per web.dev thresholds (LCP 2.5/4.0s, CLS 0.1/0.25, INP 200/500ms).audits.largest-contentful-paint-element and the layout-shift sources from audits.layout-shift-elements.priority = max(0, p75 - good_threshold) / (poor_threshold - good_threshold).<link rel="preload" as="image">), defer non-critical CSS, lazy-load below-the-fold images, use fetchpriority="high" on the hero.width/height on images, reserve space for ads with min-height, avoid inserting DOM above existing content.requestIdleCallback for non-urgent work, audit third-party scripts.web-vitals-plan.md with an executive header (overall verdict, top metric to fix), a per-metric section with prioritized suggestions and selectors, and a "quick wins" appendix for the top three changes most likely to move scores.
Re-fetch the report after applying suggestions and confirm the targeted metric's p75 dropped by at least 10% (or moved one tier). Cross-check Lighthouse's largest-contentful-paint-element against the suggested selector — if the suggestion mitigates a different element, refine. CrUX data lags by 28 days; document this in the report header so users don't expect immediate movement.
localhost: caching and CDN behavior absent; results are advisory only.Other publishers' experience with this skill. Self-rating is blocked.
Sign in and publish to the registry to leave a rating.
No ratings yet. Be the first.
Same domains or capabilities as amitte/core-web-vitals-narrator.
Write five Google Ads responsive search ad copy variants from a product description and audience — each fits headline length and includes a distinct CTA.
Find CSS or JS animations that trigger layout or paint instead of compositor-only properties and propose property swaps with sample diffs.
Tighten a Content-Security-Policy by stripping wildcards and verifying the result against actual page resource loads observed in browser logs.
Identify unused CSS classes via PurgeCSS and propose a configuration that's safe in the presence of dynamically constructed class names.
Audit a Tailwind config for color contrast in dark mode and flag every text-on-background pair below WCAG AA thresholds.
Walk a React component tree and identify subtrees not covered by an Error Boundary, suggesting placement points for new boundaries.