CWV Superpowers: How to Fix Core Web Vitals with an AI Coding Agent and Real User Data

Most Core Web Vitals workflows have the same structural flaw: developers fix what Lighthouse reports, not what real users actually experience. Lighthouse runs a synthetic test on a simulated device with a simulated network. Your actual audience is on an iPhone 13 in Munich on a congested LTE connection. The agent does not know this — and until recently, neither did your tooling.

CWV Superpowers changes that. It is an open-source Claude Code plugin that connects your AI coding agent directly to real user monitoring (RUM) data from CoreDash, then uses Chrome tracing to confirm the root cause in the browser, and finally writes the minimal code fix — all in a single conversation. This article explains exactly how it works, why the field-data-first approach matters, and how to install it in under five minutes.

Why Synthetic Lab Scores Produce Wrong Fixes

The fundamental problem with AI-assisted Core Web Vitals work is the data source. An AI agent optimizing from Lighthouse scores will improve a number that does not appear in your Google Search Console report. Google evaluates LCP, INP, and CLS at the 75th percentile of real visitor data collected by the Chrome User Experience Report (CrUX). A synthetic audit tells you what might be slow. Your CrUX field data tells you what is actually slow for the users Google measures.

The consequence is systematic misdiagnosis. An agent might preload a hero image that is not your actual LCP element on mobile. It might defer a script that is fine, while ignoring the third-party tag responsible for a 400ms INP spike on your checkout page. Field data resolves this. When an AI agent receives RUM data filtered by device type, URL path, and LCP element attribution, it is working with the same reality Google measures — not a lab approximation.

As of early 2026, only 48% of mobile site visits pass all three Core Web Vitals thresholds according to CrUX data. INP is the most commonly failed metric, with 43% of sites still missing the 200ms threshold. The gap between sites that pass and those that do not is increasingly a gap between teams with structured, data-driven optimization workflows and those chasing Lighthouse scores.

What CWV Superpowers Actually Does

CWV Superpowers is a Claude Code plugin that orchestrates a five-step diagnostic and remediation workflow:

Step 1 — Automated discovery. The agent queries CoreDash via MCP to find your worst-performing pages and metrics across real page loads. It surfaces which URLs are failing, which metric is the bottleneck, and what the p75 values look like on mobile versus desktop.

Step 2 — Phase-level diagnosis. Each metric is broken into its contributing phases. LCP is split into TTFB, Load Delay, Load Time, and Render Delay — and the plugin names which phase is responsible. INP attribution identifies the slow interaction element, the responsible script (using Long Animation Frame data), and the load state at interaction time. CLS cause matching detects images without explicit dimensions, font swaps, injected content, and late-loading resources.

Step 3 — Chrome tracing. The agent visits the page under mobile emulation (Fast 3G network, 4× CPU throttle) and runs a Chrome DevTools Protocol trace. Critically, it investigates only the bottleneck phase identified in Step 2 — not a generic performance audit that produces noise. This lab trace either confirms or refines the RUM diagnosis.

Step 4 — Root cause attribution. The plugin synthesizes evidence from both sources. A root cause statement names the specific element, the specific cause, and the evidence from both field data and the Chrome trace. For example: the LCP image div.hero-banner > img.product-main is discovered 1,980ms late because it lacks a preload hint and carries no fetchpriority="high" — confirmed by both CoreDash RUM (LOADDELAY bottleneck at p75) and a Chrome waterfall showing a 1,940ms gap between HTML first byte and the image request.

Step 5 — Output. The agent either makes the minimal code change directly (naming the file, the line, the element), generates an interactive HTML report with filmstrip, waterfall, and breakdown charts, or both.

The Field Data Advantage: Real Users to Code in Minutes

The Model Context Protocol (MCP), introduced by Anthropic in November 2024 and donated to the Linux Foundation’s Agentic AI Foundation in December 2025, standardizes how AI tools connect to external data sources. CoreDash ships with a built-in MCP server that exposes live field data to any MCP-compatible coding agent through two tools: get_metrics (filtered by 25+ dimensions including LCP element, INP interaction target, device type, country, and URL path) and get_timeseries (trends over time with automatic regression detection).

When Claude Code connects to this server, the investigation chain becomes: field data identifies the symptom → Chrome trace explains the mechanism → agent writes the fix → field data confirms it worked. In one documented case using this workflow, real-user p75 LCP dropped from 4.2s to 2.1s on mobile, with poor page loads falling from 38% to 9%. The trend was classified as “improving” with a 50% reduction — verified against actual users, not a Lighthouse simulation.

This is the compounding organic equity argument for performance work applied to tooling: fixing the right issue once, confirmed in real user data, delivers durable ranking signal. Chasing synthetic scores delivers temporary number movement.

Installation: Five Minutes to Full Analysis

Requirements

• A CoreDash account with real user data flowing (the free tier works)
• Claude Code installed: npm install -g @anthropic-ai/claude-code
• Chrome installed (optional but recommended for full trace capability)

Install the plugin

# Add the marketplace
/plugin marketplace add corewebvitals/cwv-superpowers

# Install the plugin
/plugin install cwv-superpowers@cwv-superpower

Connect CoreDash MCP

claude mcp add --transport http coredash https://app.coredash.app/api/mcp \
  --header "Authorization: Bearer cdk_YOUR_API_KEY"

Generate your API key from CoreDash → Project Settings → API Keys (MCP). The plugin also works with Cursor (/plugin-add cwv-superpowers) and any other MCP-compatible client including Claude Desktop, Windsurf, and Gemini CLI.

Verify the connection

Ask your agent: “What are my Core Web Vitals?”

If CoreDash is connected, it returns your real LCP, INP, CLS, FCP, and TTFB data immediately.

Launch with Chrome for full tracing

claude --chrome

The plugin handles capability detection automatically. If Chrome is unavailable, it delivers RUM-only diagnosis with element attribution, bottleneck phase, trend data, and code fix. If CoreDash is unavailable, it falls back to Chrome-only lab auditing with a setup guide.

What the Workflow Looks Like in Practice

The natural language interface is intentionally minimal. Three prompts cover most use cases:

• "Find my biggest CWV issue and fix it" — runs the full discovery, diagnosis, and fix loop automatically
• "My product pages are slow" — runs targeted diagnosis on a page group
• "Generate a report" — produces an interactive HTML report with filmstrip, waterfall, breakdown charts, and root cause analysis

The plugin’s skill structure separates concerns cleanly: lcp.md, inp.md, and cls.md each contain phase-specific attribution logic, while chrome.md handles trace interpretation. SKILL.md is the orchestrator that decides which modules to invoke based on which metric the field data flags as the bottleneck. This architecture means the agent does not run generic audits — it executes a targeted investigation designed around information architecture built for diagnostic efficiency.

Why This Approach Scales

The technical SEO work that compounds is work done once, correctly, verified in field data. A preload hint on the correct LCP image, confirmed by a p75 improvement in CrUX, continues delivering ranking signal for months without maintenance. An agent-assisted fix loop that takes hours of manual trace analysis down to minutes changes the economics of performance optimization: teams can address more URLs, more frequently, with higher confidence that each fix moves the metric Google measures.

Sites that pass all three Core Web Vitals thresholds see 24% lower bounce rates on average and measurably better organic rankings in competitive SERPs where content quality is otherwise matched. With Google AI Mode increasingly favoring fast-loading pages — one analysis found sites with load times under one second receiving three times more Googlebot requests than sites over three seconds — the performance-ranking relationship in 2026 is more direct than it has ever been.

CWV Superpowers is not an autonomous performance agent. Every fix is reviewed before merging. But it replaces the investigation that used to take hours — segmenting RUM data, building a Chrome trace, correlating field evidence with lab evidence — with a conversation that takes minutes. The developers who get the most value from it are the ones who understand Core Web Vitals deeply enough to evaluate whether an AI-generated fix is correct. It removes the legwork. The judgment stays human.

Frequently Asked Questions

Q: Does CWV Superpowers work without a CoreDash account? CWV Superpowers works in a reduced mode without CoreDash: it runs Chrome DevTools traces and produces lab-only diagnoses. The full RUM-to-code workflow — where the agent traces a field data symptom to a specific file in your repository — requires CoreDash MCP to be connected. CoreDash offers a free tier that works with the plugin.

Q: Why does field data matter more than Lighthouse scores for Core Web Vitals fixes? Google evaluates Core Web Vitals using the Chrome User Experience Report (CrUX), which collects real user data at the 75th percentile. Lighthouse produces synthetic lab scores from a simulated device and network. An AI agent optimizing from Lighthouse scores can improve a number that does not affect your CrUX report or your rankings. Field data tells the agent what is actually slow for the users Google measures, which produces fixes that move the metric that matters.

Q: Which MCP-compatible clients work with CWV Superpowers beyond Claude Code? The CoreDash MCP server works with any client that supports HTTP MCP servers, including Cursor, Claude Desktop, Windsurf, Gemini CLI, and JetBrains IDEs. The installation path differs slightly per client — the plugin’s setup.md module includes configuration instructions for each. Claude Code with the --chrome flag gives the fullest experience because it enables Chrome DevTools Protocol tracing alongside the RUM diagnosis.

Q: How does INP attribution work in the plugin? INP diagnosis in CWV Superpowers uses Long Animation Frame (LOAF) data from CoreDash RUM to identify the responsible script — not just the slow interaction element. The inp.md module splits INP into its three phases: Input Delay, Processing Time, and Presentation Delay. Knowing which phase dominates changes the fix: Input Delay points to main thread contention from third-party scripts, while Presentation Delay points to rendering bottlenecks. This phase breakdown is why agent-generated INP fixes are more targeted than generic “reduce JavaScript” recommendations.

Q: How long before a Core Web Vitals fix appears in Google Search Console? Google Search Console uses a rolling 28-day window of CrUX field data. After deploying a fix, the improvement gradually replaces older data over the following 28 days. The CWV Superpowers workflow uses CoreDash’s get_timeseries tool to detect improving trends in real user data before the Search Console window has fully updated — so you can confirm a fix is working in days rather than waiting a full month for the report to reflect it.

Next Steps

The plugin is open source at github.com/corewebvitals/cwv-superpowers with an MIT license. Issues and pull requests are welcome. If you are starting from scratch, the fastest path to field data is the CoreDash free tier — once real user data is flowing, install the plugin and run: "Find my biggest CWV issue and fix it." The agent handles the rest.

For teams that want to understand the underlying diagnostic framework before deploying it, Google’s Core Web Vitals documentation on web.dev and the Chrome User Experience Report documentation are the authoritative references the plugin’s modules are built around.