Core/Dash Diagnosis

CoreDash Diagnosis: Find rodårsagen

Real User Monitoring giver dig de vitale tegn. Din LCP er 3,2 sekunder. Din CLS er 0,25. Din INP fejler. Dette er præcis, hvad RUM er designet til. Det viser de metrikker, der betyder noget. Det fortæller dig, at ydeevnen er forringet, og hvor du skal fokusere. Det er det første og afgørende skridt i at rette Core Web Vitals.

Men når du har dataene, begynder det rigtige arbejde. En fejlet LCP kan være en langsom server, et overdimensioneret billede, et render-blokerende script eller alle tre dele. RUM viser dig symptomet. Det næste logiske skridt er diagnose.

CoreDash Diagnosis er intelligenslaget, der omsætter metrikker til løsninger. Det udvider dine RUM-data med automatiseret ydeevne-efterforskning, der fanger detaljerede eksekveringsprofiler fra browseren for at identificere den præcise flaskehals og generere den nøjagtige løsning, skræddersyet til dit CMS!.

Fra måling til rodårsag

Du har dashboardet. LCP: 3,2s. Du ved, hvor problemet er. Nu har du brug for at vide hvorfor. Er det hero-billedet? Tredjeparts-scripts? Serverens svartid? Du kan bruge timer på at gennemgå vandfaldet, profilere main thread og teste teorier. Eller du kan lade diagnosticeringsmotoren gøre det for dig.

CoreDash Diagnosis tager det næste logiske skridt. Det måler ikke bare ydeevnen. Det reverse-engineerer fejlen.

LCP-diagnose: Fire faser, ét svar

Vi opdeler Largest Contentful Paint i dets fire bestanddele: TTFB, Load Delay, Load Duration og Render Delay. Når en fase fejler, markerer vi den ikke bare. Vi forklarer den.

• Vendor Attribution: Vi rapporterer ikke "høj scripting-tid". Vi rapporterer, at HubSpots tracking-script blokerede paint-fasen i 150 ms, eller at Google Tag Manager forsinkede render-fasen med 300 ms. Du ser leverandøren, omkostningen og konsekvensen.
• Anti-Pattern Detection: Vi scanner efter 14 specifikke arkitektoniske fejl: lazy-loading af LCP-billedet, skjul af det i en CSS-baggrund, indlæsning af det fra et ikke-optimeret CDN. Vi fanger de fejl, som audits overser.
• Code-Level Remediation: Vi genererer rettelsen. Hvis dit LCP-billede ikke har et priority hint, skriver vi <link rel="preload">-tagget for dig. Hvis et script blokerer for rendering, viser vi dig, hvor du skal tilføje defer. Rettelsen er klar til at blive kopieret og sat ind.

CLS-diagnose: Fang spøgelsesfejlen

Layout shifts er de sværeste fejl at reproducere. En skrifttype indlæses sent på én forbindelse. En annonce renderes langsommere på mobil. Forskydningen sker én gang, og du ser den aldrig igen.

CoreDash Diagnosis optager hver frame. Vi registrerer forskydningen, identificerer elementet og sporer rodårsagen.

• The Element: Vi fortæller dig præcis, hvilken DOM-node der flyttede sig. Ikke "et sted i headeren". Den specifikke <div> med den specifikke klasse.
• The Trigger: Vi fortæller dig, hvorfor det flyttede sig. En webfont blev udskiftet uden en fallback-deklaration. En bannerannonce indsatte sig selv uden reserveret plads. Et billede blev indlæst uden dimensioner.
• The Fix: Vi skriver din CSS. Tilføj aspect-ratio: 16/9 til billedet. Sæt font-display: swap på din font face. Reserver min-height: 250px til annonce-containeren. Forskydningen sker aldrig igen.

INP-diagnose: Find frysningen

Interaction to Next Paint måler responsivitet. Når den fejler, fryser grænsefladen. Brugeren klikker på en knap, og der sker ingenting.

RUM-data fortæller dig, at "INP is poor", og hvor besøgende har interageret med din side.  Vi fortæller dig, hvilken funktion der blokerer main thread, og hvordan du fikser det!

• Isolate the Interaction: Vi identificerer den præcise input-event: et klik på en knap, en formularindsendelse, et tastetryk. Vi ved, hvilken interaktion der fejlede.
• Profile the Handler: Vi måler din event listener. Vi viser dig eksekveringstiden for din egen kode, helt ned til den enkelte funktion. Hvis din click handler kører en synkron operation på 200 ms, viser vi dig de 200 ms.
• Detect Interference: Nogle gange er din kode hurtig. Browseren har bare travlt. Et tredjeparts analysebibliotek behandler data. En tracking-pixel affyrer en netværksanmodning. Vi markerer den baggrundsopgave, der stjæler cyklusser fra brugerens interaktion.

Du stopper med at optimere i blinde. Du optimerer den funktion, der rent faktisk forårsager frysningen.

Platformsspecifikke løsninger

Generiske anbefalinger er ubrugelige.

"Server billeder i next-gen formater" hjælper ikke en Shopify-forhandler, der ikke kontrollerer CDN'et. "Reducer JavaScript-eksekveringstid" hjælper ikke en WordPress-sideejer, der ikke ved, hvilket plugin der er problemet.

CoreDash Diagnosis genkender dit stack og genererer native kode.

WordPress? Vi giver dig et PHP-snippet eller den specifikke plugin-indstilling, der skal ændres.
Next.js? Vi giver dig ændringen til next.config.js.
Shopify? Vi fortæller dig, hvilken Liquid-skabelon du skal redigere, og viser dig den præcise linje, du skal tilføje.

Vi understøtter Shopify, WordPress, WooCommerce, Magento, Drupal, Squarespace, Wix, Next.js, React, Vue.js og Nuxt.js.

Anbefalingen er ikke teoretisk. Den er eksekverbar.

Forskellen mellem at se og at løse

RUM fortæller dig, at dit site er langsomt.

CoreDash Diagnosis fortæller dig, at Intercom-chat-widgeten blokerer main thread i 200 ms under initial paint, og her er det script-tag, du skal ændre for at udskyde indlæsningen (defer).

Det er forskellen på en metrik og en løsning.