Din AI-agent har lige fået Core Web Vitals-superkræfter
Forbind Claude Code til dine CoreDash-feltdata. Den finder din værste flaskehals på tværs af millioner af sidevisninger, sporer årsagen i Chrome og skriver rettelsen. Agentbaseret web performance – ikke en rapport, men den faktiske kodelinje, der skal ændres.
Installer på 2 minutter Start gratis CoreDash-prøveperiode »Trusted by market leaders · Client results
AI Performance-værktøjer har et dataproblem
De fleste AI-agenter optimerer mod Lighthouse. En syntetisk score på en simuleret enhed, som Google ikke bruger til rangering. En nyttig AI-agent til web performance starter med de samme data som Google: rigtige brugere på budgettelefoner, ustabile forbindelser og kontinenter, din udviklermaskine aldrig har set.
Lighthouse er ikke dit rangeringssignal
Google rangerer ud fra CrUX-feltdata fra rigtige Chrome-brugere over 28 dage. En perfekt Lighthouse-score og en dumpende feltscore forekommer hele tiden. 52 % af mobilsites dumper mindst én Core Web Vital i felten.
Blinde agenter laver blinde rettelser
Uden data fra rigtige brugere ved en AI-agent ikke, hvilken side der er langsom, hvilket element der er flaskehalsen, eller om dens rettelse hjalp. Den optimerer en simulering og kalder det en dag. Dine faktiske brugere er uenige.
Manuel undersøgelse tager timer
Segmentér dataene. Opstil en hypotese. Kør en trace. Bekræft. Udkast til rettelsen. En senior performance engineer bruger 2 til 4 timer pr. problem. Gang det med hver eneste langsomme side på dit site.
INP kan slet ikke simuleres i et laboratoriemiljø Interaction to Next Paint måler, hvordan rigtige brugere interagerer med din side. Intet syntetisk værktøj kan genskabe rigtig brugeradfærd: hvor de tapper, hvor hurtigt de scroller, hvilken enhed de holder. Lighthouse rapporterer ikke engang INP. Hvis din AI-agent kører Lighthouse, er den blind for dine værste interaktivitetsproblemer. Feltdata er den eneste kilde.
To kilder til sandhed: Feltdata møder browserbeviser
CWV Superpowers kombinerer CoreDash-data fra rigtige brugere med målrettede Chrome-traces. Feltdataene fortæller den, hvad der er langsomt. Chrome fortæller den hvorfor.
CoreDash fortæller agenten, hvad der er langsomt
CoreDash sporer hver eneste sideindlæsning fra hver eneste rigtig bruger. Hver metrik tillægges det præcise element, der forårsager problemet. Ingen sampling, ingen begrænsninger.
Når CoreDash rapporterer en LCP på 4,2 sekunder, hvor Load Delay forbruger 52 % af den samlede tid på div.hero > img.main, ved agenten præcis, hvor den skal lede. Ikke et gæt. En måling fra millioner af rigtige sessioner.
Denne skill forespørger 25+ CoreDash-dimensioner: LCP-element, elementtype, prioritetstilstand, faseopdeling, INP-interaktionsmål, LOAF-scripts, CLS-forskydningselement, enhedstype, besøgstype, netværkshastighed, 7-dages tendenser.
Chrome fortæller agenten, hvorfor det er langsomt
CWV Superpowers besøger siden med mobilemulering: Fast 3G, 4x CPU-throttling. Den sporer kun den flaskehalsfase, som CoreDash identificerede.
Er Load Delay flaskehalsen? Agenten undersøger netværksvandfaldet for forsinkelser i opdagelsen (discovery gaps). Render Delay? Den leder efter blokerende scripts og forsinkelser ved indlæsning af skrifttyper.
Resultatet: filmstrip-skærmbilleder, netværksvandfald og målrettede beviser, der forklarer den grundlæggende årsag, som dine feltdata afslørede.
Proportional logik, ikke absolutte grænseværdier
Lighthouse fortæller dig "Render Delay er 350ms". Er det problemet? Ingen anelse. CWV Superpowers identificerer flaskehalsen som den fase, der forbruger den største procentdel af den samlede tid.
INP er 350ms. Input Delay 70ms (20 %), Processing 80ms (23 %), Presentation 200ms (57 %). Presentation er flaskehalsen, selvom 200ms lyder fint isoleret set. At fikse dette flytter nålen. At optimere Input Delay kan knap nok mærkes.
Dette forhindrer den mest almindelige fejl i performance-arbejde: at fikse det forkerte.
Fem trin: Fra "noget er langsomt" til kode-rettelse
Stil den et spørgsmål. Fem trin senere har du en rettelse bakket op af beviser fra rigtige brugere.
1. Opdagelse
Scanner dine CoreDash-data for de værste sider og metrikker. Prioriterer dårlige bedømmelser, mobil, sider med høj trafik og p75-scores, der skjuler en lang hale af dårlige resultater.
2. Diagnose
Opdeler metrikken i faser. LCP: TTFB, Load Delay, Load Time, Render Delay. INP: Input Delay, Processing, Presentation. Navngiver flaskehalsen ud fra procentdel.
3. Chrome Trace
Besøger siden med mobilemulering. Sporer kun flaskehalsfasen fra trin 2. Fanger netværksvandfald, filmstrip og beviser for blokerende ressourcer.
4. Grundlæggende årsag
Kombinerer begge kilder til beviser i én udtalelse: elementet, årsagen, CoreDash-metrikkerne, og hvad Chrome bekræftede. Ingen tvetydighed.
5. Rettelse eller rapport
Dit valg. Anvend kode-rettelsen med fil, linje, element, før/efter. Generer en selvstændig HTML-rapport med grafer og beviser. Eller begge dele.
25+ dimensioner: Hver eneste vinkel dine feltdata dækker
Dette er de faktiske CoreDash-dimensioner, agenten forespørger. Ikke et resumé. Det fulde billede.
LCP (Largest Contentful Paint)
LCP-element Elementtype Prioritetstilstand TTFB-fase Load Delay Load Time Render DelayINP (Interaction to Next Paint)
INP-mål Input Delay Processing Presentation LOAF-scripts IndlæsningstilstandCLS (Cumulative Layout Shift)
Forskydende element Forskydningsårsag ForskydningstidspunktSegmenter
Enhedstype Land Browser OS Forbindelse Besøgstype SidestiTendenser
7-dages delta 28-dages baseline RegressionsdetektionDiagnose: Faseopdeling for hver Core Web Vital
Ikke kun scores. Hver metrik opdelt i faser ved hjælp af tilskrivning fra rigtige brugere via CoreDash.
Fiks LCP med AI: Largest Contentful Paint-diagnose
4-fase opdeling: TTFB, Load Delay, Load Time, Render Delay. Identificerer hvilken fase der forbruger den største del af den samlede tid.
Element-tilskrivning: det nøjagtige LCP-element, dets type (billede, tekst, baggrundsbillede, video) og prioritetstilstand (fetchpriority, lazy loading).
Typiske rettelser: tilføj preload-hint, fjern lazy loading fra hero, optimér billedformat, fiks render-blokerende script.
Fiks INP med AI: Interaction to Next Paint-diagnose
3-fase opdeling: Input Delay, Processing, Presentation. Den eneste metrik, du ikke kan simulere i et laboratoriemiljø. Feltdata er den eneste kilde.
Script-tilskrivning: Long Animation Frames (LOAF) navngiver den nøjagtige JavaScript-fil og varighed. Plus sidens indlæsningstilstand, da interaktionen fandt sted.
Typiske rettelser: yield til main thread, udskyd evaluering, opsplit event handlers, content-visibility for store DOMs.
CLS: Cumulative Layout Shift
5 årsagsmønstre: billeder uden dimensioner, font-swaps, dynamisk indsat indhold, sent indlæste ressourcer, CSS-animationer på layout-egenskaber.
Tværgående dimensioner: sammenligner mobil vs. desktop, nye vs. tilbagevendende besøgende, hurtige vs. langsomme netværk for at indsnævre årsagen.
Typiske rettelser: tilføj width/height, font-display: optional, min-height reservation, brug transform i stedet for top/left.
Sådan ser en udtalelse om grundlæggende årsag ud
Ikke "overvej at optimere dine billeder". Dette er det faktiske output. Specifikt nok til at gennemgå og merge.
Grundlæggende årsag:
LCP-billedet div.hero-banner > img.product-main på /product/running-shoes-42 opdages 1.980ms for sent, fordi det mangler et preload-hint og ikke har fetchpriority="high".
CoreDash-beviser:
LCP er 3.820ms (dårlig) på mobil, p75. Load Delay er flaskehalsen ved 1.980ms (52 % af det samlede). Prioritetstilstand: 3 (ikke preloaded). Tendens: forværret +340ms over 7 dage.
Chrome-beviser:
Netværksvandfaldet viser et hul på 1.940ms mellem HTML first byte og billedforespørgslen. Billedet refereres kun i CSS, usynligt for preload-scanneren.
Rettelse:
Tilføj <link rel="preload" href="/images/hero.jpg" as="image" fetchpriority="high"> til templates/product.html linje 12. Sæt fetchpriority="high" på img-elementet på linje 47.
Generisk AI-råd:
"Overvej at tilføje fetchpriority til dit LCP-billede og sørg for korrekt preloading af kritiske ressourcer."
CWV Superpowers:
Element: div.hero-banner > img.product-main
Fil: templates/product.html, linje 47
Bevis: 52 % af LCP-tiden i Load Delay (CoreDash p75). 1.940ms opdagelseshul (Chrome-vandfald).
Rettelse: 2-linjers kodeændring med før/efter-diff.
Sammenlign: Sådan klarer CWV Superpowers sig
Forskellige værktøjer løser forskellige problemer. Her er, hvad hver enkelt rent faktisk gør.
| Egenskab | CoreDash + CWV Superpowers | Chrome DevTools MCP | PSI / Lighthouse MCP |
|---|---|---|---|
| Datakilde | Rigtige brugere (28 dages feltdata) | Enkelt lab-session | Simuleret enkeltindlæsning |
| INP-måling | ✓ Rigtige interaktioner | ✗ Ingen rigtige brugere | ✗ Ikke målt |
| Faseopdeling | ✓ LCP, INP, CLS faser | ~ Manuel analyse | ✗ Kun score |
| Element-tilskrivning | ✓ Nøjagtigt element + prioritet | ~ Hvis du ved, hvor du skal lede | ~ Generiske forslag |
| Proportional logik | ✓ Flaskehals i % | ✗ Absolutte værdier | ✗ Absolutte værdier |
| Segment-sammenligning | ✓ Enhed, land, browser | ✗ Enkelt konfiguration | ✗ Enkelt konfiguration |
| Tendensdetektion | ✓ 7-dages delta | ✗ Øjebliksbillede | ✗ Øjebliksbillede |
| Chrome-tracing | ✓ Målrettet efter fase | ✓ Fuld adgang | ✗ Ingen browser |
| Kode-rettelser | ✓ Fil + linje + diff | ~ Agent-afhængig | ~ Generisk rådgivning |
Bemærk: Chrome DevTools MCP er supplerende. CWV Superpowers bruger det til målrettet tracing, efter at feltdata har identificeret flaskehalsen. De fungerer bedst sammen.
Rapporter: Smid dem i Slack, vedhæft dem i Jira
Selvstændig HTML. Ingen afhængigheder. Intet build-trin. Én fil med alt indlejret.
Fuld rapport (med Chrome)
Farvekodede metrik-kort, diagrammer over faseopdeling, filmstrip-skærmbilleder på nøgletidspunkter (first paint, LCP, loaded), netværksvandfald-SVG, analyse af grundlæggende årsag og den anbefalede rettelse med før/efter-kode.
RUM-Only rapport
Samme metrik-kort og faseopdeling plus element-tilskrivning og analyse af grundlæggende årsag. Ingen filmstrip eller vandfald, men diagnosekvaliteten er identisk, fordi feltdata er sandhedskilden.
Fungerer med enhver MCP-klient
Claude Code: Fuld skill med automatiseret workflow. Opdagelse, diagnose, Chrome-tracing, kode-rettelser og rapporter. Anbefales.
Cursor: Plugin-installation med CoreDash MCP. Fuld diagnose og kode-rettelser inde i din editor.
VS Code, Windsurf, Gemini CLI: Enhver klient, der understøtter HTTP MCP-servere, forbinder til CoreDash. Samme feltdata, samme tilskrivning.
Client Success
Don't just take my word for it
Head of Digital, Rituals
"We used to break performance every other sprint. He set up budgets in our pipeline. Haven't had a regression since."
Head of Engineering, Swift
"Layout shift on checkout eliminated entirely. Went from 0.4 to 0.02 CLS across mobile and desktop."
Lead Developer, Alza
"Transferred knowledge to our engineering team. We can now diagnose and resolve performance issues independently."
Engineering Manager, Zalando
"Every other audit we've had gave us a list of problems. This one told us exactly what to fix first and why."
Product Lead, Miro
"Our dashboards were choking on main-thread work. 25% reduction in CPU usage. Users noticed immediately."
CTO, DPG Media
"He found bottlenecks in our component library that we'd missed for two years. Performance gains were visible within days."
VP Product, Expedia Group
"We had 80+ third-party scripts and were failing CWV on every major property. Arjen got us passing without touching our ad revenue."
VP Engineering, People Inc
"Seven brands, seven different stacks. Every single one got faster. No compromises on what makes each property unique."
VP Engineering, Loop
"Mobile load time down 800ms. 7% lift in checkout conversion. The ROI justified the investment immediately."
Head of Platform, Adevinta
45% reduction in blocking time across 15 marketplaces. INP from 440ms to 64ms on Fotocasa alone. Google wrote up the results on web.dev.
Klar på 2 minutter
Automatiseret Core Web Vitals-diagnosticering i din terminal. Du skal bruge en CoreDash-konto med indgående data. Den gratis version virker.
Claude Code
claude mcp add --transport http coredash \
https://app.coredash.app/api/mcp \
--header "Authorization: Bearer cdk_YOUR_API_KEY"
/plugin marketplace add corewebvitals/cwv-superpowers
/plugin install cwv-superpowers@cwv-superpowers
claude --chrome
Find mit største CWV-problem og ret det. Hent din API-nøgle fra CoreDash → Project Settings → API Keys (MCP). Vises kun én gang. Gemmes som SHA-256-hash. Read-only.
Cursor
/plugin-add cwv-superpowers
Tilføj CoreDash til .cursor/mcp.json:
{
"mcpServers": {
"coredash": {
"url": "https://app.coredash.app/api/mcp",
"headers": {
"Authorization": "Bearer cdk_YOUR_API_KEY"
}
}
}
} Andre MCP-klienter
Endpoint: https://app.coredash.app/api/mcp
Header: Authorization: Bearer cdk_YOUR_API_KEY
Fungerer med VS Code (Copilot-agenttilstand), Windsurf, Gemini CLI, Claude Desktop og enhver HTTP MCP-klient. Ét MCP web performance-endpoint, alle agenter.
Ofte stillede spørgsmål
Skal jeg have Chrome kørende for at bruge CWV Superpowers?
Nej. Chrome-tracing er valgfrit. Uden det får du fuld diagnose af feltdata, faseopdelinger, element-tilskrivning og forslag til kode-rettelser baseret udelukkende på CoreDash-data. Chrome tilføjer filmstrip-skærmbilleder, netværksvandfald og visuel bekræftelse af den grundlæggende årsag. Begge tilstande genererer rapporter.
Hvordan adskiller dette sig fra at køre Lighthouse i min AI-agent?
Lighthouse kører en enkelt syntetisk indlæsning på din maskine. CWV Superpowers bruger 28 dages data fra rigtige brugere via CoreDash: faktiske enheder, faktiske netværk, faktiske interaktioner. Det måler INP fra rigtige bruger-taps (det kan Lighthouse ikke). Det sammenligner segmenter (mobil vs. desktop, Indien vs. USA). Og det bruger proportional logik til at finde flaskehalsfasen, ikke blot absolutte scores.
Hvilke AI-kodningsagenter understøttes?
Enhver AI-kodningsagent til web performance, der understøtter MCP-servere (Model Context Protocol). Claude Code har en dedikeret skill med et automatiseret 5-trins workflow. Cursor, VS Code (Copilot-agenttilstand), Windsurf, Gemini CLI og Claude Desktop forbinder via CoreDash HTTP MCP-endpointet. Feltdataene og tilskrivningen er identisk på tværs af alle klienter.
Er CoreDash gratis?
CoreDash har en gratis version, der fungerer med CWV Superpowers. Du skal have indgående data fra dit site (tilføj CoreDash-script-tagget). Den gratis version har ingen sampling og ingen begrænsninger på sidevisninger. API-nøgler til MCP-adgang er tilgængelige på alle planer.
Kan jeg bruge dette til kundesider?
Ja. For hvert CoreDash-projekt kan du oprette ubegrænsede dedikerede MVP API-nøgler . Tilføj CoreDash til hver kundeside, generer en read-only API-nøgle, og konfigurer din MCP-klient. Agenten ser kun data for det specifikke projekt. CWV Superpowers er MIT-licenseret, så der er ingen begrænsninger for kommerciel brug.
Open Source. Ingen lock-in.
Core Web Vitals-automatisering du kan inspicere og udvide. Orchestratoren, diagnosemodulerne, logikken for Chrome-tracing og rapportskabelonerne findes alle på GitHub. Læs, hvordan det virker. Fork det. Udvid det. Bidrag.
Start din gratis prøveperiode Se på GitHub