I dag ønsker vi at dykke ind i, hvordan vi bedre kan bruge og forstå dataene fra det populære website speed test tool Pingdom. Du kan bruge det til at gøre, hvad vi kalder en vandfaldsanalyse af din WordPress-hjemmeside. Dette kan hjælpe dig med hurtigt at diagnosticere ydeevneproblemer og også ikke at fejldiagnostisere et problem.

Mange gange ser vi WordPress-brugere fejlfortolke de data, der er forkerte i Pingdom speed testværktøjet, og det fører til nogle gange at man konfigurerer et websted til en tilstand endnu værre end før. Husk at alle værktøjer som dette skal bruges som vejledninger, de er aldrig 100% nøjagtige. Det vigtige er, at være konsistent og bruge det samme værktøj igennem alle dine test.

Pingdom

Pingdom er et firma baseret ud fra Sverige (nu ejet af SolarWinds), der tilbyder en bred vifte af forskellige tjenester, såsom overvågning af oppetid, sidens hastighedsovervågning, transaktionsovervågning, serverovervågning og besøgsindsigt (RUM). Sandsynligvis en af de ting, de er mest kendt for, er deres gratis hjemmeside hastigheds test værktøj. Det er et af de mest populære præstationsprøvningsværktøjer i WordPress-fællesskabet.

Hvorfor er det så populært? Nå, for dig, er det nok det nemmeste hurtighedsprøvningsværktøj at bruge! Ikke alle er web-performance ekspert, og så for den typiske WordPress-bruger kan nogle af de andre alternative værktøjer derude være ganske overvældende. Nogle gange er mindre mere, som de siger. Når det kommer til stykket, er du jo bare bekymret for to ting: Hvor hurtigt er dit websted, og hvordan kan du gøre det hurtigere.

Pingdom website speed test
Pingdom website speed test

Pingdom giver dig nu mulighed for at teste hastigheden på enhver hjemmeside fra 7 forskellige steder (5 kontinenter), der er strategisk placeret rundt om i verden:

  • Asien – Japan – Tokyo
  • Europa – Tyskland – Frankfurt
  • Europa – Storbritannien – London
  • Nordamerika – USA – Washington D.C.
  • Nordamerika – USA – San Fransisco
  • Stillehavet – Australien – Sydney
  • Sydamerika – Brasilien – São Paulo

Bemærk: Vi har bemærket, at lejlighedsvis vil ikke alle teststederne være tilgængelige. Det er mest sandsynligt, fordi det er gået ned til vedligeholdelse, eller det blev overbelastet med for mange mennesker, der forsøger at køre tests på den. Hvis en testplaceringsplacering, du har brugt, ikke længere er der, skal du tjekke om en time eller to. Mest sandsynligt vil det komme igen.

Den testplacering, du vælger, er faktisk meget vigtig, da den vedrører den fysiske placering af, hvor dit websted rent faktisk er vært. Det er her en lille ting kaldet netværksforsinkelse kommer i spil. Men vi vil komme ind i dette mere detaljeret nedenfor.

Vandfaldsanalyse med Pingdom Speed ​​Test Tool

En webside består af forskellige aktiver, såsom HTML, JavaScript, CSS, billeder og videoer. Hver af disse genererer anmodninger om at gøre det, du ser på din hjemmeside. Normalt de flere forespørgsler du har, jo langsommere bliver dit websted belastet. Det er ikke altid tilfældet, men det er sandt det meste af tiden.

Nedenfor vil vi bryde op for hver Pingdom-sektion og forklare mere detaljeret hvad informationen betyder som den vedrører den samlede ydeevne på dit websted og hvordan man foretager en vandfaldsanalyse.

Pingdom Sammendrag

Når du kører din WordPress hjemmeside via Pingdom genererer den en præstationsgrad, en samlet belastningstid, den samlede sidestørrelse og antallet af anmodninger, du har på din hjemmeside. I vores eksempel bruger vi perfmatters.io, et e-handelssite, der kører Easy Digital Downloads. Det er vært på Kinsta’s knald-hurtige servere.

Som du kan, se kørte vi vores første test og vi scorede en 88/100 på Pingdom og den samlede belastningstid er 541 ms. Den giver os besked om den samlede størrelse af vores samlede aktiver og antallet af anmodninger.

Pingdom speed test før DNS og cache
Pingdom speed test før DNS og cache

Vi kørte derefter en ekstra test, og nu er vores samlede belastningstid 392 ms med samme sidestørrelse og antal anmodninger! Hvad handler det om? 🤔 Du vil måske bemærke dette, hvis du kører din hjemmeside gennem Pingdom speed testværktøjet flere gange. Større websteder vil se endnu større forskelle.

Der er tre hovedårsager til, at der sker: DNS caching, CDN caching og WordPress caching. Derfor bør du altid køre test flere gange. Selvfølgelig kan eksterne opkald til tredjeparts ressourcer og API’er også påvirke dette. Find ud af hvorfor yderligere nedenfor i vores vandfaldsanalyse.

Pingdom speed test efter DNS
Pingdom speed test efter DNS

Ønsker du at få en bedre Pingdom score på din WordPress hjemmeside? Afhængigt af dit websted og konfiguration er det muligvis ikke muligt at score en perfekt 100/100, især for dem, der kører e-handelssites og markedsføringspixel. Men bare at bruge lidt tid på at forbedre din score er et godt sted at starte. Den samlede hastighed er virkelig, hvad der er vigtigst.

Nogle gange kan brugeroplevelsen også trumfe nogle af de webtræningstricks du læser rundt på internettet. Du kan ikke glemme brugeroplevelsen! Men vær sikker på, vi vil dele med dig nogle tips og tricks yderligere nedenfor om hvordan vi fik ovenstående websted til hvor det er, så fortsæt med at læse.

Forbedre sidens ydeevne

Afsnittet om præstationsindsigt, nu “Forbedret sideydelse” blev opdateret i 2018, og de har fjernet nogle gamle elementer og tilføjet nye. Det er mest sandsynligt, fordi nogle af de forslag, de rapporterede, ikke længere er relevante, som de plejede at være. Når det kommer til optimering af webydelsen, ændres tingene altid. Og det kan nogle gange være besværligt, hvis folk simpelthen forsøger at jagte efter den perfekte Pingdom-score.

Pingdom præstationsindsigt
Pingdom præstationsindsigt

Om ikke andet, så forlader vi dog hele dette afsnit i vores indlæg (nogle gamle og nye), fordi det er vigtigt at forstå, hvordan disse scoringer er beregnet. Disse er hovedsagelig alle baseret på Google PageSpeed Insight reglerne. Generelt, hvis du forbedrer disse på dit websted, bør du se et fald i dine samlede belastningstider.

Her er et par af de kategorier, som den forbedrede sideydelsessektion består af:

Lad os nu dykke ind i nogle af disse og se hvilke der stadig er relevante i dag.

Brug et Content Delivery Network (CDN)

En af de vigtigste tjenester til implementering på dit WordPress-websted i dag et Content Delivery Network (CDN). Disse er et netværk af servere (også kendt som POP’er) placeret over hele kloden. De er designet til at være vært for og levere kopier af dit WordPress-websteds statiske (og undertiden dynamiske) indhold som billeder, CSS, JavaScript og videostrømme.

Hvis du er en Kinsta-klient, indkluderer vi en CDN på alle vores hostingplaner. Aktivering af det tager et par klik. Nogle fordele fra en CDN inkluderer en præstationsforøgelse (lavere TTFB og netværksforsinkelse), lavere båndbredde og hosting omkostninger og endda SEO fordele.

Kinsta-kunder kan også nyde et hurtigt og nemt løft til den overordnede optimering af dit websted ved at formindske din kode ved hjælp af kode minificeringsfunktionen, der er indbygget i MyKinsta-dashboardet. Dette giver kunderne mulighed for at aktivere automatisk CSS- og JavaScript-minificering med et enkelt klik, hvilket effektivt fremskynder deres websteder uden nogen manuel indsats.

Vigtigt: Det nyligt opdaterede Pingdom-værktøj har i øjeblikket en fejl, der korrekt registrerer enhver CDN-udbyder korrekt.

Brug et Content Delivery Network (CDN)
Brug et Content Delivery Network (CDN)

Nogle tredjeparts CDN-udbydere, vi anbefaler, inkluderer:

I vores egne CDN-hastighedsprøver har vi fundet ud af, at en CDN kan i nogle tilfælde reducere sideindlæsningstider med over 50%!

Undgå HTTP 404 (ikke fundet) fejl

Dette afsnit blev tidligere kaldt “undgå dårlige anmodninger.” Og det er altid relevant! Denne advarsel er ligesom det lyder. Det er en anmodning, der ikke kunne gennemføres med succes. Det sker typisk, at du manuelt linker til et aktiv eller billede, der siden hen er blevet slettet, hvilket resulterer i en 404-fejl. Dette vises som en orange cirkel i Pingdom sammen med en 404 på respons header status.

Undgå dårlige anmodninger - 404 fejl
Undgå dårlige anmodninger – 404 fejl

Sørg altid for at enhver anmodning på dit websted vender tilbage med successtatus. Dette sikrer, at der ikke genereres spørgsmål til aktiver, der ikke længere eksisterer.

Minimer omdirigeringer

Alt for mange omdirigeringer er altid noget, du skal passe på. Enkle omdirigeringer som en enkelt 301 omdirigering, HTTP til HTTPS eller www til ikke-www (omvendt) er fine. Og mange gange er det nødvendigt i visse områder af dit websted. Men hver har en pris på dit websteds præstation. Og hvis du begynder at stable omdirigeringer oven på hinanden, er det vigtigt at indse, hvordan de påvirker dit websteds ydeevne. Dette gælder for side- og post omdirigeringer, omdirigeringer af billeder, alt.

En omdirigering vises som en blå cirkel i Pingdom, sammen med en 301 eller 302 på respons header status.
Minimize redirects - 301

Hvor meget påvirker omdirigeringer dit website? Lad os lave en hastighedstest. Først kører vi en fart test på vores Kontakt os side: https://perfmatters.io/contact/. Som du kan se nedenfor får vi en samlet belastningstid på 417 ms.

Hjemmesidehastighedstest uden omdirigeringer
Hjemmesidehastighedstest uden omdirigeringer

Vi ændrer derefter webadressen lidt og kører en anden hastighedstest for at se virkningen af flere omdirigeringer. http://www.perfmatters.io/contact. Som du kan se, tager den samme side nu 695 ms at indlæse. Det er en stigning på 66%. Yikes!

Website hastighedstest med flere omdirigeringer
Website hastighedstest med flere omdirigeringer

Se vores indgående indlæg om WordPress omdirigeringer, og de bedste metoder til hurtigere ydeevne.

Tilføj udløber overskrifter

Dette forslag blev tidligere kaldt løftestang i browser caching. For at udtrykke det i lægens vilkår, skal ethvert script på dit WordPress-websted have en HTTP-cache header knyttet til den (eller det skulle). Dette bestemmer, hvornår cachen på filen udløber. For at løse dette skal du sikre dig, at din WordPress-vært har de korrekte cache-control og expires headers setup. Kinsta har disse overskrifter på plads på alle vores servere. Tjek trinene til, hvordan du tilføjer caching-headers til din server manuelt, og læs vores vejledning om, hvordan du tilføjer expired headers.

Udnyt browser caching - caching overskrifter
Udnyt browser caching – caching overskrifter

Det andet problem er, at når du læser tredjeparts scripts, har du ikke adgang til at tilføje caching-overskrifterne, da du ikke har nogen kontrol over deres webservere. Fælles skyldige er Google Analytics-script og markedsføringspixels, som Facebook og Twitter. For at løse dette kan du være vært for dit Google Analytics-script lokalt (selvom det ikke er officielt understøttet) med et plugin som Perfmatters. WP Rocket har nu også mulighed for at være vært for din Facebook marketing pixel lokalt.

Flytning af scripts lokalt kan variere i forhold til, hvor meget det påvirker dit websteds ydeevne. Den ene fordel er, at du så har fuld kontrol over filen og kan betjene den fra din egen CDN. Dette fjerner også en anden tredjeparts DNS-anmodning. Det er dog også vigtigt at huske, at disse filer måske allerede er cachelagrede i folks browsere.

Se vores dybtgående indlæg om, hvordan du løser advarslen om løftestangs browserens caching.

Fjern forespørgselsstrenge fra statiske ressourcer

Et andet almindeligt problem handler om forespørgselsstrengene. Dine CSS- og JavaScript-filer har normalt filversionen på slutningen af ​​deres webadresser, f.eks https://domain.com/file.min.css?ver=4.5.3. Nogle servere og proxyservere kan ikke cache forespørgselsstrengene. Så ved at fjerne dem, kan du til tider forbedre din caching.

Du kan bruge et premium-plugin som Perfmatters, som har en let enkelt-klik mulighed for at fjerne forespørgselsstrengene.

Eller du kan tilføje følgende kode manuelt til dit tema’s functions.php-fil. Et bedre alternativ ville være at bruge en gratis plugin som Code Snippets for at tilføje koden. På denne måde behøver du ikke direkte at redigere dit tema.

function remove_query_strings() {
 if(!is_admin()) {
 add_filter('script_loader_src', 'remove_query_strings_split', 15);
 add_filter('style_loader_src', 'remove_query_strings_split', 15);
 }
}
function remove_query_strings_split($src){
 $output = preg_split("/(&ver|\?ver)/", $src);
 return $output[0];
}
add_action('init', 'remove_query_strings');

Men før du straks udstrækker forespørgselsstrengene på dit websted, er det vigtigt at vide, hvorfor forespørgselsstrengene bruges. Versioning på filer bruges typisk af WordPress-udviklere til at omgå cachingproblemer.

Hvis de for eksempel udskriver en opdatering og ændrer style.css fra ?ver=4.6 til ?ver=4.7, vil den blive behandlet som en helt ny webadresse og vil ikke blive cachelagret. Hvis du fjerner forespørgselsstrengene og opdaterer et plugin, kan det medføre, at den cachelagrede version fortsætter med at blive vist. I nogle tilfælde kan dette bryde udseendet af dit websted, indtil den cachelagrede ressource udløber, eller cachen er helt skyllet.

Derudover kan nogle CDN’er cache forespørgselsstrengene. Kinsta CDN kan og gør dette som standard. Så hvis du er en Kinsta-klient, er forespørgselsstrengene allerede cachelagret på dine aktiver.

Fjern forespørgselsstrengene fra advarsler om statiske ressourcer
Fjern forespørgselsstrengene fra advarsler om statiske ressourcer

Se vores dybtgående vejledning om, hvordan du fjerner forespørgselsstrengene fra statiske ressourcer.

Vi har et dybtgående indlæg om, hvordan vi skal håndtere det statiske indhold fra en cookieless domæne advarsel. Mange gange kan du ignorere denne advarsel, da nye protokoller som HTTP/2 nu gør dette mindre vigtigt. Omkostningerne ved en ny forbindelse er normalt dyrere end streaming af alt over den samme forbindelse. To måder at løse dette på er imidlertid at bruge en CDN-udbyder, der fjerner cookies eller oprette et separat domæne og eller underdomæne.

Server statisk indhold fra en cookiefrit domæne advarsel
Server statisk indhold fra en cookiefrit domæne advarsel

Komprimer komponenter med GZIP

Advarslen “Komprimerings-komponenter med GZIP” opstår, når Pingdom registrerer et aktiv, der ikke er komprimeret med GZIP. GZIP er en komprimeringsmetode, der bruges til at reducere størrelsen på tekstbaserede filer som HTML-dokumenter og CSS / JS-filer. GZIP-komprimering er aktiveret på serveren og komprimerer websider og aktiver, før de sendes til en besøgende. Fra vores test så vi, at aktivering af GZIP-komprimering reducerede filstørrelsen på en anmodning med over 78%.

Komprimere komponenter med GZIP
Komprimere komponenter med GZIP

Hos Kinsta behøver du ikke bekymre dig om at aktivere GZIP manuelt, fordi det allerede er aktiveret som standard på alle vores servere. Hvis du bemærker, at din webhost ikke har aktiveret GZIP, anbefaler vi at kontakte deres supportteam for at aktivere det med det samme, fordi det kan have en enorm indflydelse på din sides hastighed. Hvis du stadig ser “Komprimere komponenter med GZIP” efter aktivering af GZIP på din server, er det muligt, at en server, der er vært for et eksternt aktiv, der kræves af dit websted, ikke har GZIP aktiveret. Hvis det er tilfældet, er der ikke noget, du kan gøre ved din ende for at ændre serverens adfærd.

Parallelér overførsler på tværs af værtsnavne

Advarselsresultaterne “Paralleliserer overførsler på tværs af værtsnavne” på grund af en begrænsning af HTTP/1.1 og webbrowsere er begrænset til antallet af samtidige forbindelser, de kan gøre til en vært; som typisk er 6 forbindelser. Denne advarsel ses typisk på websteder med et stort antal anmodninger. Tidligere er den eneste vej til at omgå denne begrænsning, at gennemføre det de kalder domæneafdækning. Men hvis du bruger en webhost eller CDN-udbyder, der understøtter HTTP/2, kan du sikkert ignorere dette nu, da flere ressourcer nu kan indlæses parallelt over en enkelt forbindelse. Men du kan også tjekke vores vejledning om, hvordan du reparerer paralleliseringen af downloads over værtsnavnet, ved at implementere domæneafdækning.

Parallelér downloads over værtsnavne advarsel
Parallelér downloads over værtsnavne advarsel

Angiv en cache validator

Denne advarsel henviser til manglende HTTP-caching-overskrifter, som skal inkluderes i hvert originarserverrespons, da de begge validerer og angiver længden af cachen. Hvis overskrifterne ikke findes, genererer den hver gang en ny anmodning om ressourcen, hvilket øger belastningen på din server. Disse overskrifter last-modified, ETag, Cache-Control, og Expires. Ligesom med advarselsbrowserens caching-advarsel, skal disse overskrifter automatisk tilføjes af din WordPress-vært. Hvis du har anmodninger fra tredjeparter, hvis ser du dette på, er der intet du kan gøre, da du ikke har kontrol over deres webservere.

Angiv en cache validator advarsel
Angiv en cache validator advarsel

Læs vores dybtgående indlæg om, hvordan du løser opgaven angiv en cache-validator advarsel.

Angiv en Vary: Accept-Encoding Header

Vi har et dybtgående indlæg om, hvordan du retter op på Angiv en varsel: Accept-Encoding header-advarsel. Dette er en HTTP-header og skal medtages på hvert original serverrespons, da det fortæller browseren, hvorvidt klienten kan håndtere komprimerede versioner af indholdet. Dette tilføjes automatisk på alle Kinstas servere

Angiv en variabel: accept-kodning header advarsel
Angiv en variabel: accept-kodning header advarsel

Pingdom Response Codes

Næste afsnit i Pingdom speed test værktøj er svarkoderne. Svarkoder, også kaldet HTTP-statuskoder, er som en kort notat fra webserveren, der bliver klistret på toppen af en webside. Det er en besked fra webserveren, der fortæller dig, hvordan tingene gik, da anmodningen om at få vist siden blev modtaget. Nogle almindelige er:

  • 200: “Alt er ok.” Dette er koden, der leveres, når en webside eller ressource virker præcis som den forventes at være.

    Eksempel på Pingdom 200 svarkode
    Eksempel på Pingdom 200 svarkode

  • 301: “Den ønskede ressource er blevet flyttet permanent.” Denne kode leveres, når en webside eller ressource er blevet erstattet permanent med en anden ressource. Den bruges til permanent URL-omdirigering.

    Eksempel på Pingdom 301 svarkode
    Eksempel på Pingdom 301 svarkode

  • 404: “Den ønskede ressource blev ikke fundet.” Den mest almindelige fejlmeddelelse af dem alle. Denne kode betyder, at den ønskede ressource ikke findes, og at serveren ikke ved, om den nogensinde eksisterede.

    Eksempel på Pingdom 404 svarkode
    Eksempel på Pingdom 404 svarkode

Du kan læse mere om alle de forskellige svarkoder i vores dybdegående indlæg på HTTP-statuskoder.

Indholdsstørrelse og forespørgsler efter indholdstype

De næste afsnit er indholdsstørrelsen efter indholdstype og forespørgsler efter indholdstype. Hver af disse er nyttige til hurtigt at se, hvad der bruger de fleste ressourcer på dit website. Ifølge HTTP-arkiv udgør billeder generelt 43% af det gennemsnitlige websites samlede størrelse. Vi ser også dette som regel også tilfældet. Men som du kan se nedenfor på dette websted, er det ikke altid tilfældet.

Pingdom content type
Pingdom content type

For at optimere dine billeder anbefaler vi stærkt at læse vores dybtgående indlæg om, hvordan du optimerer billeder til web og om WebP. Der er mange gode værktøjer og plugins derude for yderligere at komprimere dine billeder og sikre, at de ikke er størstedelen af ​​dit websteds sidebelastning. Og i vores tilfælde ovenfor bruger site perfmatters.io fordelene ved at bruge store skrifttype awesome ikoner i stedet for billeder. Dette kan være en fantastisk strategi, der gør en enorm forskel. Og selvfølgelig har vi nogle ekstra tips i vores sidehastighedsguide om, hvordan du yderligere reducerer din indholdsstørrelse.

Indholdsstørrelse og anmodninger efter domæne

Indholdsstørrelsen og forespørgsler efter domæneafsnit er en god måde at hurtigt se hvilke eksterne tjenester og scripts på dit websted. I vores eksempel kan du se, at vi har alle vores aktiver indlæst fra vores CDN. Så er der den første HTML DOC-belastning for hjemmesiden fra webserveren og et eksternt opkald til Google Analytics-domænet. Afhængigt af dit websted kan du have mange flere eksterne tjenester, såsom Facebook, Twitter, Hotjar, SumoMe, AdRoll, New Relic, CrazyEgg osv.

Pingdom anmodninger efter domæne
Pingdom anmodninger efter domæne

Generelt jo færre eksterne forespørgsler du kan have, det bedre, fordi hver ekstern tjeneste introducerer sin egen latens, TLS-håndtrykforsinkelser, DNS-opslag osv. Sørg for at læse vores dybtgående indlæg om, hvordan du kan identificere og analysere eksterne tjenester på din WordPress-side.

Generelt er det bedst at reducere antallet af forespørgsler så meget som muligt og være vært for aktiverne på ét sted, f.eks. At flytte dem til din webserver eller CDN. Et eksempel ville være font awesome. I stedet for at linke til det eksterne script til font awesome, download det, og server det direkte.

Pingdom Vandfald Diagram

Og sidst men ikke mindst har vi Pingdom Speed Test Tool Request-sektionen, der genererer et vandfaldskort over alle de individuelle forespørgsler på din webside (som vist nedenfor). Du kan derefter analysere hver anmodning for at se, hvad der forårsager forsinkelser og ydeevneproblemer på dit websted. Det betyder det, når vi siger, at vi laver en vandfaldsanalyse. Nedenfor er en mere tilbundsgående oversigt og eller definition af hvad hver statusfarve betyder.

Pingdom waterfall analysis
Pingdom vandfaldsanalyse

DNS (Pink)

Så hvad er DNS? Nå, tænk på det som en telefonbog. Der er servere kaldet Domain Name Servere, som indeholder oplysninger om dit websted og hvilken IP det skal henføres til. Når du først kører din hjemmeside via Pingdom, udfører den et nyt opslag, og det skal forespørge DNS-registrene for at få IP-informationen. Dette resulterer i yderligere opslagstid. Placeringen af DNS-serveren er også vigtig.

DNS forsinkelser i Pingdom
DNS forsinkelser i Pingdom

Når du kører din hjemmeside via Pingdom, mere end én gang, caches den DNS’en, fordi den allerede kender IP informationen og ikke behøver at udføre opslaget igen. Dette er en af grundene til, at din hjemmeside vises hurtigere, når du kører den gennem Pingdom flere gange.

Som du kan se på skærmen nedenfor, på den 2. test, vi kørte, er DNS-opslagstiden på den indledende DOC-belastning på 3,6 ms. Typisk vil det falde til 0 ms, faktisk skal det, da forespørgslen allerede er cachelagret. Dette er et område, som mange mennesker misfortolker!

Cached DNS i Pingdom
Cached DNS i Pingdom

Du kan også optimere det yderligere ved at bruge en premium DNS-service, plus det kommer med mange ekstra fordele. Vores Cloudflare gratis DNS er også hurtig! Tjek Cloudflare’s Automatic Platform Optimization.

Der er også andre grunde til, at din hjemmeside måske vises hurtigere efter flere test. En af dem er, hvis du bruger et indholdsleveringsnetværk (CDN). For de af jer, der ikke er bekendt med en CDN, er det et netværk af globale servere, som cacher dit indhold (JS, CSS, Billeder osv.) På steder tættere på den besøgende. Når du først kører din hjemmeside via Pingdom, kan det være nødvendigt at tage fat på aktiverne fra CDN-fresh. En CDN-cache virker meget som DNS, når den er cachelagret, er den så meget hurtigere på på hinanden følgende belastninger.

Et andet tip om at fremskynde DNS er at bruge DNS prefetching. Dette gør det muligt for browseren at udføre DNS-opslag på en side i baggrunden. Du kan gøre det ved at tilføje nogle linjer kode til overskriften på dit WordPress-websted. Se nogle eksempler nedenfor.

<!-- Prefetch DNS for external assets -->
 <link rel="dns-prefetch" href="//fonts.googleapis.com">
 <link rel="dns-prefetch" href="//www.google-analytics.com"> 
 <link rel="dns-prefetch" href="//cdn.domain.com">

Eller hvis du kører WordPress version 4.6 eller nyere, vil du måske bruge resource hints. Udviklere kan bruge wp_resource_hints -filteret til at tilføje brugerdefinerede domæner og webadresser til dns-prefetch, preconnect, prefetch eller prerender.

SSL (Purple)

Den lilla statusfarve står for den tid, som din browser tager for at udføre et SSL/TLS-håndtryk. Når du kører en hjemmeside over HTTPS betyder det, at der er et SSL-certifikat involveret og ekstra tid involveret på grund af krypteringsprocessen (SSL/TLS-håndtryk). På vores eksempel domæne har vi et certifikat på både vores webserver hos Kinsta og vores CDN, KeyCDN. Så der er en SSL forhandlingstid på både den oprindelige HTML doc-belastning fra webserveren og vores aktiver.

SSL-ladetid i Pingdom
SSL-ladetid i Pingdom

Selvom der er lidt overliggende til at køre HTTPS, er det meget ubetydeligt nu takket være HTTP/2, som er en ny protokol, der hjælper med at øge hastigheden på nettet! På grund af browsersupport er HTTPS forpligtet til at udnytte HTTP/2. Se vores ultimative guide til HTTP/2.

Det er også vigtigt at bemærke, at selv i 2018 støtter udbydere endnu ikke HTTP/2. Dette inkluderer både fra web hosting side og CDN side. Så når du handler for hosting og CDN, skal du sørge for, at begge understøtter det! Kinsta er stolt over at understøtte HTTP/2 for alle sine WordPress-klienter.

Fra midten af 2018 opgraderede Pingdom endelig deres værktøj til at bruge Chrome 60 og højere. Du kan se, at brugeragenten bliver brugt i forespørgselsoverskriften. Tidligere brugte de Chrome 39, og Chrome understøttede ikke HTTP/2 til version 49. Så vi er glade for at sige, at Pingdom-værktøjet nu viser alle fordelene ved HTTP/2, når du kører tests! 👏

Pingdom HTTP/2 support
Pingdom HTTP/2 support

Tilslut (Teal)

Forbindelsestiden i Pingdom refererer til TCP-forbindelsen eller den samlede tid, der kræves for at oprette en TCP-forbindelse. Du behøver ikke rigtig at forstå, hvordan dette virker, men det er simpelthen en kommunikationsmetode mellem værten/klienten og den server, der skal finde sted.

Pingdom forbindelsestid
Pingdom forbindelsestid

Vent (gul)

Ventetiden i Pingdom refererer faktisk til tiden til første byte, også kendt som TTFB i nogle værktøjer. TTFB er en måling, der bruges som en indikation af, at en webserver eller en anden netværksressource er lydhør. Generelt er alt under 100 ms acceptabelt og god TTFB. Hvis du nærmer dig området 300-400 ms, har du muligvis noget fejlkonfigureret på din server, eller det kan være på tide at opgradere til en bedre web-stabel.

Ventetid - TTFB
Ventetid – TTFB

Den nemmeste måde at reducere din TTFB på? De bedste to måder er effektiv WordPress caching og en CDN. Så lad os køre et par tests.

TTFB Uden WordPress Host Cache

Vi kørte først en prøve efter at have ryddet cachen på vores WordPress-websted. Dette betyder, at det skal forlæse cachen igen. Som du kan se var vores samlede belastningstid 541 ms, og TTFB (ventetid) på vores første forespørgsel var 185,2 ms.

Pingdom TTFB uden WordPress cache
Pingdom TTFB uden WordPress cache

TTFB med WordPress Host Cache

Vi kørte derefter testen igen. Det tjener nu direkte fra cache. Som du kan se, faldt vores samlede belastningstider ned til 392 ms, og TTFB på den oprindelige anmodning er nu 52,8 ms! Det er forskellen caching gør.

Pingdom TTFB med WordPress cache
Pingdom TTFB med WordPress cache

Hvis du har et websted, der serverer besøgende i forskellige dele af landet eller verden rundt, er den anden nemme måde at drastisk mindske din TTFB at drage fordel af at bruge en CDN. Vi løb igen et par tests for at vise forskellen.

TTFB uden CDN

Vi kørte først en test med vores CDN deaktiveret, og som du kan se, var vores samlede belastningstid 1,93 s, og vores gennemsnitlige TTFB på et aktiv var omkring 176 ms.

TTFB uden CDN
TTFB uden CDN

TTFB med CDN

Vi aktiverede derefter vores CDN og kørte testen igen. Som du kan se, faldt vores samlede belastningstider ned til 1,21 s, og vores gennemsnitlige TTFB på et CDN-aktiv er nu 4,6 ms! Hvilken forskel en CDN kan gøre.

TTFB med CDN
TTFB med CDN

En anden vigtig ting at bemærke er, at vi valgte “Stillehavet – Australien – Sydney” stedet for at udføre denne test. Hvorfor? Fordi vi ønskede at vise dig den reelle forbedring, der kan opnås. Vores WordPress-websted i dette eksempel er hostet af Kinsta på Google Cloud og er placeret på en central placering i USA. Ved at udføre testen mod Australien kan vi vise, hvordan Kinsta CDN caching øger hastigheden og reducerer TTFB.

Og selvfølgelig, at have en god WordPress vært med en omhyggeligt gennemtænkt arkitektur, er også afgørende for at sænke din TTFB.

Send (Orange) og Modtag (Grøn)

Send- og modtagestatusen i Pingdom behøver ikke rigtig meget af en forklaring. Sendetiden er simpelthen den tid det tager for webbrowseren at sende data til serveren. Og modtagelsestiden er den tid det tager for browseren at modtage data fra serveren. Begge disse vil normalt være meget lave eller ikke-eksisterende i dine test.

HTTP Response Headers

Du kan også klikke på en individuel forespørgsel, mens du foretager din vandfaldsanalyse og se HTTP-responsoverskrifterne. Dette giver værdifulde oplysninger. På skærmen nedenfor kan vi øjeblikkeligt se ting som gzip er aktiveret på webserveren, og at den bliver serveret fra cache (HIT, vil vise MISS ellers), cache-kontrol overskrifterne udløber overskrifter, browser brugeragent og mere.

HTTP response headers
HTTP response headers

Case Study Domain Configuration

Hvis du har dette langt nede i vores vandfaldsanalys, så er det godt for dig. Det er altid irriterende at se folk dele tips og casestudier, men så ikke dele, hvordan de kom der. Så nedenfor er vores nøjagtige konfiguration for case study domænet brugt ovenfor! Du er velkommen til at kopiere det.

Arkitektur

  • Case-study-domænet (perfmatters.io) er hostet med Kinsta på Google Cloud Platform i USA (Council Bluffs, Iowa, USA (us-central1). Kinsta tilbyder i dag 37 forskellige datacentre at vælge imellem. GCP’s premium tier netværk er inkluderet i alle planer for lyn hurtig netværksforsinkelse.
  • Kinsta bruger HTTP/2, Nginx, MariaDB, som alle bidrager til de hurtige belastningstider.
  • Webstedet bruger KeyCDN, som styrer Kinsta CDN. Gratis CDN båndbredde er inkluderet i alle hosting planer.
  • Webstedet bruger ikke noget caching-plugin. Kinsta caches alt på server niveau, hvilket forenkler tingene meget!
  • Webstedet bruger PHP 7.3. Nyere versioner af PHP har altid vist gode præstationsforbedringer. Tjek disse PHP benchmarks. Kinsta giver dig mulighed for at skifte mellem de to med et tryk på en knap.
Opdater PHP-version af WordPress-webstedet
Opdater PHP-version af WordPress-webstedet

WordPress plugins og tema

Her er en liste over plugins, der påvirker ydeevnen, der bruges på WordPress e-handelswebsted.

Anbefalede vejledninger til videre læsning:

Resumé

Som du kan se, når du ved hvordan Pingdom speed testværktøjet virker lidt bedre, og hvad alle diagrammer betyder, kan hjælpe dig med at lave en mere data-drevet beslutning, når det kommer til ydeevne. En vandfaldsanalyse, som vi kalder det, er afgørende for at vide, hvordan dine individuelle aktiver belastes, og hvordan de påvirkes af din WordPress-vært, fysiske placering, en CDN osv. Har du andre gode Pingdom-tips?

Hvis du gerne vil se flere dybtgående artikler som den ovenstående, bedes du venligst underrette os nedenfor i kommentarerne!

Brian Jackson

Brian har en stor lidenskab for WordPress, har brugt det i over et årti og udvikler endda et par premium plugins. Brian kan lide blogging, film og vandreture. Opret forbindelse med Brian på Twitter.