Core/Dash-dimensjon: Nettleser

Dimensjon: Side og navigasjon: URL-er (u)

Nettleser-dimensjonen grupperer ytelsesdata basert på User Agent-strengen sendt av klienten. Dette lar deg revidere Core Web Vitals-ytelse gjennom linsen til den spesifikke programvaren som gjengir applikasjonen din (f.eks. Chrome, Firefox, Safari, Edge, Samsung Internet).

Nettleser-dimensjonen isolerer programvarebegrensninger, forskjeller i renderingsmotorer (Blink, Gecko, WebKit) og kompatibilitet med tredjepartsskript.

RUM vs. CrUX

Å forstå kilden til dataene dine er viktig for nøyaktig teknisk analyse.

• CrUX (Chrome User Experience Report): Dette datasettet samler utelukkende data fra brukere som har samtykket i Chrome (og noen Chromium-derivater). Det ekskluderer blindt trafikk fra Firefox (Gecko-motor) og Safari (WebKit-motor).
• CoreDash RUM: Samler inn data fra hver nettleser som kjører JavaScript-snutten.

For mange nettsteder utgjør ikke-Chrome-nettlesere 30–50 % av trafikken. Å stole utelukkende på CrUX skaper en blindsone: Du optimaliserer for Googles V8-motor mens du neglisjerer SpiderMonkey- (Firefox) og JavaScriptCore-motorene (Safari) som brukes av et massivt segment av publikummet ditt.

Metrikk-spesifikk diagnostikk

Ulike nettlesermotorer håndterer ressurser, kompilerer JavaScript og beregner layoutgeometri forskjellig. Bruk denne dimensjonen til å identifisere motorspesifikke feil.

Interaction to Next Paint (INP)

INP-problemer korrelerer direkte med effektiviteten til nettleserens JavaScript-motor og planlegging av hovedtråden.

• Firefox (SpiderMonkey): Firefox håndterer oppgaveprioritering annerledes enn Chrome. En tung event listener som passerer i Chrome, kan forårsake merkbar inndataforsinkelse i Firefox på grunn av forskjeller i hvordan hovedtråden yielder.
• Safari (JavaScriptCore): utviser ofte distinkt oppførsel angående "trykk"-latens på mobil. Hydreringslogikk som føles umiddelbar på Android (Chrome), kan utløse forsinkelser på iOS på grunn av distinkte modeller for hendelsespropagering.

Largest Contentful Paint (LCP)

LCP-avvik signaliserer vanligvis mangel på funksjonslikhet eller støtte for moderne optimaliserings-API-er.

• Formatforhandling: Hvis Chrome rapporterer en rask LCP men Firefox henger etter, verifiser strategien din for bildeformater. Du serverer kanskje AVIF til Chrome mens du bruker større JPEG-filer som fallback for eldre nettleserversjoner som mangler støtte.
• Priority Hints: Chrome respekterer aggressivt fetchpriority="high". Nettlesere som ignorerer dette attributtet behandler LCP-ressursen med standard prioritet, noe som kunstig blåser opp lasteforsinkelsen.
• Tilkoblingsprotokoller: Edge og Firefox kan forhandle HTTP/3 (QUIC)-tilkoblinger annerledes i bedriftsmiljøer eller begrensede nettverksmiljøer, noe som påvirker TTFB-komponenten av LCP.

Cumulative Layout Shift (CLS)

Renderingsmotorer beregner pikselgeometri ved hjelp av distinkt subpiksel-logikk.

• Fontgjengivelse (Gecko vs. Blink): Firefox (Gecko) og Chrome (Blink) gjengir font-grunnlinjer og sporing litt forskjellig. Hvis du ikke matcher fallback-fontmetrikkene dine perfekt, vil tekstblokken endre størrelse når webfonten lastes inn, noe som forårsaker et skift i én nettleser, men ikke den andre.
• Reservering av rullefelt: Windows-nettlesere (Edge/Firefox/Chrome) reserverer fysisk plass til rullefelt, mens macOS-nettlesere legger dem over innholdet. Denne ulikheten forårsaker ofte breddebaserte layoutskift som er usynlige under utvikling på en Mac, men fremtredende for Windows-brukere.

Arbeidsflyt: Isolering av motorspesifikke regresjoner

Det primære bruksområdet for denne dimensjonen er "Motorvalidering".

• Identifiser avvikeren: Sorter Nettleser-tabellen din etter Impact eller Volum. Se etter en spesifikk nettleser (f.eks. Firefox Mobile) som har en betydelig dårligere score enn referansen (Chrome Mobile).
• Verifiser miljøet: Sjekk om problemet er strengt relatert til nettleseren eller en kombinasjon av nettleser og OS (f.eks. Edge på Android vs. Edge på Windows).
• Feilsøk: Hvis Edge er treg men Chrome er rask (begge bruker Blink), undersøk tredjepartsutvidelser eller sikkerhetsprogramvare for bedrifter som er vanlige for Edge-brukere, som injiserer skript i DOM-en. Hvis Firefox er treg, revider CSS-en din for ikke-standard egenskaper eller layout thrashing som Gecko straffer hardere enn Blink.

Eldre og innebygde nettlesere

Bruk Nettleser-dimensjonen til å identifisere "Long Tail"-ytelsesbremser.

In-App-nettlesere: Trafikk fra Instagram, LinkedIn eller Facebook kjører ofte i begrensede WebViews som oppfører seg annerledes enn den opprinnelige mobilnettleseren.

Eldre versjoner: Du kan finne trafikk fra utdaterte nettleserversjoner. Hvis disse genererer høy INP, konfigurer byggeverktøyene dine (Babel/PostCSS) til enten å servere nødvendige polyfills, eller, hvis volumet er ubetydelig, ta den strategiske beslutningen om å droppe støtte for å redusere buntstørrelsen for moderne brukere.