AI-agenten din fikk nettopp Core Web Vitals-superkrefter
Koble Claude Code til din CoreDash field data. Den finner din verste flaskehals blant millioner av sidevisninger, sporer rotårsaken i Chrome og skriver fiksen. Agentstyrt webytelse er ikke en rapport, men den eksakte kodelinjen som må endres.
Installer på 2 minutter Start gratis CoreDash-prøveperiode »Trusted by market leaders · Client results
AI-verktøy for ytelse har et dataproblem
De fleste AI-agenter optimaliserer for Lighthouse. En syntetisk poengsum på en simulert enhet som Google ikke bruker for rangering. En nyttig AI-agent for webytelse starter med samme data som Google bruker: ekte brukere på billige telefoner, ustabile tilkoblinger og kontinenter utviklermaskinen din aldri har sett.
Lighthouse er ikke rangeringssignalet ditt
Google rangerer basert på CrUX field data fra ekte Chrome-brukere over 28 dager. En perfekt Lighthouse-score og stryk på field data skjer hele tiden. 52 % av mobilsider stryker på minst én Core Web Vital i felten.
Blinde agenter lager blinde fikser
Uten ekte brukerdata vet ikke en AI-agent hvilken side som er treg, hvilket element som er flaskehalsen, eller om fiksen hjalp. Den optimaliserer en simulering og sier seg fornøyd. De faktiske brukerne dine er uenige.
Manuelle undersøkelser tar timer
Segmenter dataene. Lag en hypotese. Kjør en trace. Bekreft. Skriv fiksen. En senior ytelsesingeniør bruker 2 til 4 timer per problem. Multipliser det med hver trege side på nettstedet ditt.
INP kan ikke simuleres i lab i det hele tatt Interaction to Next Paint måler hvordan ekte brukere interagerer med siden din. Ingen syntetiske verktøy kan gjenskape ekte brukeratferd: hvor de trykker, hvor raskt de scroller, hvilken enhet de holder. Lighthouse rapporterer ikke en gang INP. Hvis AI-agenten din kjører Lighthouse, er den blind for de verste interaktivitetsproblemene dine. Field data er den eneste kilden.
To sannhetskilder: Field data møter bevis fra nettleseren
CWV Superpowers kombinerer CoreDash ekte brukerdata med målrettede Chrome-traces. Field data forteller den hva som er tregt. Chrome forteller hvorfor.
CoreDash forteller agenten hva som er tregt
CoreDash sporer hver sidevisning fra hver ekte bruker. Hver måling, tilskrevet nøyaktig det elementet som forårsaker problemet. Ingen sampling, ingen begrensninger.
Når CoreDash rapporterer en LCP på 4,2 sekunder, der Load Delay tar 52 % av den totale tiden på div.hero > img.main, vet agenten nøyaktig hvor den skal lete. Ikke gjetting. En måling fra millioner av ekte sesjoner.
Ferdigheten gjør spørringer mot 25+ CoreDash-dimensjoner: LCP-element, elementtype, prioritetstilstand, fasefordeling, INP interaction target, LOAF-scripts, CLS shifting element, enhetstype, besøkstype, nettverkshastighet, 7-dagers trender.
Chrome forteller agenten hvorfor det er tregt
CWV Superpowers besøker siden med mobilemulering: Fast 3G, 4x CPU-throttling. Den tracer kun flaskehalsfasen som CoreDash identifiserte.
Er Load Delay flaskehalsen? Agenten undersøker network waterfall for discovery-gap. Render Delay? Den ser etter blokkerende scripts og treg skriftinnlasting.
Resultatet: filmstrip-skjermbilder, network waterfall og målrettet bevis som forklarer rotårsaken som field data-en din avslørte.
Proporsjonal resonnering, ikke absolutte terskler
Lighthouse forteller deg «Render Delay er 350 ms». Er det problemet? Aner ikke. CWV Superpowers identifiserer flaskehalsen som den fasen som forbruker den største prosentandelen av den totale tiden.
INP er 350 ms. Input Delay 70 ms (20 %), Processing 80 ms (23 %), Presentation 200 ms (57 %). Presentation er flaskehalsen, selv om 200 ms høres greit ut isolert sett. Å fikse det monner. Å optimalisere Input Delay merkes knapt.
Dette forhindrer den vanligste feilen i ytelsesarbeid: å fikse feil ting.
Fem trinn: Fra «noe er tregt» til kodefiks
Still den et spørsmål. Fem trinn senere har du en fiks støttet av bevis fra ekte brukere.
1. Oppdagelse
Skanner CoreDash-dataene dine for de verste sidene og målingene. Prioriterer dårlige resultater, mobil, sider med mye trafikk, og p75-scorer som skjuler en lang, dårlig hale.
2. Diagnose
Bryter målingen ned i faser. LCP: TTFB, Load Delay, Lastetid, Render Delay. INP: Input Delay, Processing, Presentation. Angir flaskehalsen i prosent.
3. Chrome-trace
Besøker siden med mobilemulering. Tracer kun flaskehalsfasen fra trinn 2. Fanger opp network waterfall, filmstrip og bevis for blokkerende ressurser.
4. Rotårsak
Kombinerer begge beviskildene til én konklusjon: elementet, årsaken, CoreDash-målingene, og hva Chrome bekreftet. Ingen tvetydighet.
5. Fiks eller rapport
Ditt valg. Påfør kodefiksen med fil, linje, element, før/etter. Generer en frittstående HTML-rapport med grafer og bevis. Eller begge deler.
25+ dimensjoner: Alle vinkler field data-en din dekker
Dette er de faktiske CoreDash-dimensjonene agenten forespør. Ikke et sammendrag. Hele bildet.
LCP (Largest Contentful Paint)
LCP-element Elementtype Prioritetstilstand TTFB-fase Load Delay Lastetid Render DelayINP (Interaction to Next Paint)
INP-mål Input Delay Processing Presentation LOAF-scripts LastestatusCLS (Cumulative Layout Shift)
Skiftende element Skiftårsak SkifttimingSegmenter
Enhetstype Land Nettleser OS Tilkobling Besøkstype SidestiTrender
7-dagers delta 28-dagers grunnlinje RegresjonsdeteksjonDiagnose: Fasenivå-fordeling for hver Core Web Vital
Ikke bare poengsummer. Hver måling er brutt ned i faser ved hjelp av attribuering fra ekte brukere i CoreDash.
Fiks LCP med AI: Largest Contentful Paint-diagnose
4-fase fordeling: TTFB, Load Delay, Lastetid, Render Delay. Identifiserer hvilken fase som tar størst andel av den totale tiden.
Elementattribuering: det eksakte LCP-elementet, dets type (bilde, tekst, bakgrunnsbilde, video), og prioritetstilstand (fetchpriority, lazy loading).
Typiske fikser: legg til preload-hint, fjern lazy loading fra hero, optimaliser bildeformat, fiks render-blocking script.
Fiks INP med AI: Interaction to Next Paint-diagnose
3-fase fordeling: Input Delay, Processing, Presentation. Den eneste målingen du ikke kan simulere i en lab. Field data er den eneste kilden.
Scriptattribuering: Long Animation Frames (LOAF) navngir den eksakte JavaScript-filen og varigheten. Pluss lastestatusen til siden da interaksjonen skjedde.
Typiske fikser: yield til main thread, utsett evaluering, splitt hendelseshåndterere, content-visibility for store DOM-er.
CLS: Cumulative Layout Shift
5 årsaksmønstre: bilder uten dimensjoner, font-bytter, dynamisk injisert innhold, sent lastede ressurser, CSS-animasjoner på layout-egenskaper.
Kryssdimensjonal: sammenligner mobil vs. desktop, nye vs. tilbakevendende besøkende, raske vs. trege nettverk for å snevre inn årsaken.
Typiske fikser: legg til width/height, font-display: optional, min-height-reservasjon, bruk transform i stedet for top/left.
Hvordan en rotårsak-konklusjon ser ut
Ikke «vurder å optimalisere bildene dine». Dette er det faktiske resultatet. Spesifikt nok til å gjennomgå og merge.
Rotårsak:
LCP-bildet div.hero-banner > img.product-main på /product/running-shoes-42 oppdages 1980 ms for sent fordi det mangler et preload-hint og ikke har fetchpriority="high".
CoreDash-bevis:
LCP er 3820 ms (dårlig) på mobil, p75. Load Delay er flaskehalsen på 1980 ms (52 % av totalen). Prioritetstilstand: 3 (ikke preloadet). Trend: forverret med +340 ms over 7 dager.
Chrome-bevis:
Network waterfall viser et gap på 1940 ms mellom HTML first byte og bilde-forespørselen. Bildet er bare referert til i CSS, og er usynlig for preload-skanneren.
Fiks:
Legg til <link rel="preload" href="/images/hero.jpg" as="image" fetchpriority="high"> i templates/product.html på linje 12. Sett fetchpriority="high" på img-elementet på linje 47.
Generiske AI-råd:
«Vurder å legge til fetchpriority på LCP-bildet ditt og sørg for riktig preloading av kritiske ressurser.»
CWV Superpowers:
Element: div.hero-banner > img.product-main
Fil: templates/product.html, linje 47
Bevis: 52 % av LCP-tiden i Load Delay (CoreDash p75). 1940 ms oppdagelsesgap (Chrome waterfall).
Fiks: 2-linjers kodeendring med før/etter-diff.
Sammenlign: Hvordan CWV Superpowers hevder seg
Ulike verktøy løser ulike problemer. Her er hva hvert av dem faktisk gjør.
| Funksjon | CoreDash + CWV Superpowers | Chrome DevTools MCP | PSI / Lighthouse MCP |
|---|---|---|---|
| Datakilde | Ekte brukere (28 dagers field data) | Enkelt lab-sesjon | Simulert enkeltinnlasting |
| INP-måling | ✓ Ekte interaksjoner | ✗ Ingen ekte brukere | ✗ Ikke målt |
| Fasefordeling | ✓ LCP-, INP-, CLS-faser | ~ Manuell analyse | ✗ Kun poengsum |
| Elementattribuering | ✓ Eksakt element + prioritet | ~ Hvis du vet hvor du skal lete | ~ Generiske forslag |
| Proporsjonal resonnering | ✓ Flaskehals i % | ✗ Absolutte verdier | ✗ Absolutte verdier |
| Segmentsammenligning | ✓ Enhet, land, nettleser | ✗ Enkeltkonfigurasjon | ✗ Enkeltkonfigurasjon |
| Trenddeteksjon | ✓ 7-dagers delta | ✗ Øyeblikksbilde | ✗ Øyeblikksbilde |
| Chrome-tracing | ✓ Målrettet etter fase | ✓ Full tilgang | ✗ Ingen nettleser |
| Kodefikser | ✓ Fil + linje + diff | ~ Agentavhengig | ~ Generiske råd |
Merk: Chrome DevTools MCP er utfyllende. CWV Superpowers bruker det for målrettet tracing etter at field data identifiserer flaskehalsen. De fungerer best sammen.
Rapporter: Slipp dem i Slack, legg ved i Jira
Frittstående HTML. Ingen avhengigheter. Ingen byggetrinn. Én fil med alt inline.
Full rapport (med Chrome)
Fargekodede målekort, diagrammer for fasefordeling, filmstrip-skjermbilder ved viktige øyeblikk (first paint, LCP, loaded), network waterfall i SVG, rotårsaksanalyse, og den anbefalte fiksen med før/etter-kode.
Kun RUM-rapport
Samme målekort og fasefordeling, pluss elementattribuering og rotårsaksanalyse. Ingen filmstrip eller waterfall, men diagnosekvaliteten er identisk fordi field data er sannhetskilden.
Fungerer med alle MCP-klienter
Claude Code: Full skill med automatisert arbeidsflyt. Oppdagelse, diagnose, Chrome-tracing, kodefikser og rapporter. Anbefalt.
Cursor: Plugin-installasjon med CoreDash MCP. Full diagnose og kodefikser direkte i editoren din.
VS Code, Windsurf, Gemini CLI: Enhver klient som støtter HTTP MCP-servere kan koble til CoreDash. Samme field data, samme attribuering.
Client Success
Don't just take my word for it
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."
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."
VP Engineering, Loop
"Mobile load time down 800ms. 7% lift in checkout conversion. The ROI justified the investment immediately."
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."
VP Engineering, People Inc
"Seven brands, seven different stacks. Every single one got faster. No compromises on what makes each property unique."
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 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.
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."
Kjører på 2 minutter
Automatisert Core Web Vitals-diagnose i terminalen din. Du trenger en CoreDash-konto som samler data. Gratisnivået fungerer.
Claude Code
claude mcp add --transport http coredash https://app.coredash.app/api/mcp
/plugin marketplace add corewebvitals/cwv-superpowers
/plugin install cwv-superpowers@cwv-superpowers
claude --chrome
Find my biggest CWV issue and fix it. Ved første tilkobling, kjør /mcp, velg coredash, og velg Authenticate. Nettleseren din åpner CoreDash-innloggingen, du velger et prosjekt og godkjenner. Claude Code lagrer et kortlivet OAuth-token som oppdateres automatisk (1 times tilgang, 30 dagers oppfriskning) og forblir tilbakekallbart. Ingen nøkkel å lime inn.
Foretrukket med en API-nøkkel for headless eller CI-bruk? Legg til --header "Authorization: Bearer cdk_YOUR_API_KEY" i kommandoen, generert fra CoreDash → Project Settings → API Keys (MCP). Vises kun én gang. Lagres som SHA-256-hash. Skrivebeskyttet.
Cursor
/plugin-add cwv-superpowers
Legg til CoreDash i .cursor/mcp.json:
{
"mcpServers": {
"coredash": {
"url": "https://app.coredash.app/api/mcp",
"headers": {
"Authorization": "Bearer cdk_YOUR_API_KEY"
}
}
}
} Andre MCP-klienter
Endepunkt: https://app.coredash.app/api/mcp
Header: Authorization: Bearer cdk_YOUR_API_KEY
Fungerer med VS Code (Copilot agent-modus), Windsurf, Gemini CLI, Claude Desktop og alle HTTP MCP-klienter. Ett MCP-endepunkt for webytelse, for enhver agent.
Ofte stilte spørsmål
Må jeg ha Chrome kjørende for å bruke CWV Superpowers?
Nei. Chrome-tracing er valgfritt. Uten det får du full field data-diagnose, fasefordelinger, elementattribuering og kodefiksforslag basert kun på CoreDash-data. Chrome legger til filmstrip-skjermbilder, network waterfall og visuell bekreftelse av rotårsaken. Begge moduser genererer rapporter.
Hvordan er dette annerledes enn å kjøre Lighthouse i AI-agenten min?
Lighthouse kjører én enkelt syntetisk innlasting på maskinen din. CWV Superpowers bruker 28 dager med ekte brukerdata fra CoreDash: faktiske enheter, faktiske nettverk, faktiske interaksjoner. Den måler INP fra ekte brukertrykk (Lighthouse kan ikke det). Den sammenligner segmenter (mobil vs. desktop, India vs. USA). Og den bruker proporsjonal resonnering for å finne flaskehalsfasen, ikke bare absolutte poengsummer.
Hvilke AI-kodeagenter støttes?
Enhver AI-kodeagent for webytelse som støtter MCP-servere (Model Context Protocol). Claude Code har en dedikert skill med en automatisert 5-trinns arbeidsflyt. Cursor, VS Code (Copilot agent-modus), Windsurf, Gemini CLI og Claude Desktop kobler til via CoreDash HTTP MCP-endepunktet. Field data og attribuering er identisk på tvers av alle klienter.
Er CoreDash gratis?
CoreDash har et gratisnivå som fungerer med CWV Superpowers. Du trenger dataflyt fra nettstedet ditt (legg til CoreDash-script-taggen). Gratisnivået har ingen sampling og ingen tak på sidevisninger. API-nøkler for MCP-tilgang er tilgjengelige i alle abonnementer.
Kan jeg bruke dette på kundesider?
Ja. For hvert CoreDash-prosjekt kan du opprette ubegrenset med dedikerte MVP API-nøkler . Legg til CoreDash på hver kundeside, generer en API-nøkkel med kun lesetilgang, og konfigurer MCP-klienten din. Agenten ser kun dataene for det prosjektet. CWV Superpowers har MIT-lisens, så det er ingen begrensninger for kommersiell bruk.
Åpen kildekode. Ingen lock-in.
Core Web Vitals-automasjon du kan inspisere og utvide. Orkestratoren, diagnosemodulene, Chrome-tracing-logikken og rapportmalene ligger på GitHub. Les hvordan det fungerer. Fork det. Utvid det. Bidra.
Start din gratis prøveperiode Se på GitHub