Hvorfor dit websted indlæser langsomt (og hvordan fikser man det): 22 trin, jeg gjorde for at få 100% GTmetrix-sidehastighedstal og øjeblikkelige indlæsningstider

Slow Loading Website


Har en webside med langsom indlæsning?

Hvad hvis jeg fortalte dig, at mit websted indlæses <1’er med 100% GTmetrix-scoringer? Og at jeg allerede har skrevet en af ​​de mest populære WordPress-hastighedsguider online med over 400 kommentarer?

Nogle optimeringer er specifikke for WordPress, andre er universelle. Men de er alle bedste praksis, selvom du bruger Squarespace, Shopify, Wix og andre webstedets bygningsplatforme.

Hvis du har spørgsmål eller har brug for hjælp, skal du slippe din GTmetrix-rapport i kommentarerne, så vil jeg give dig et par tip. Du kan også leje min webside hastighedsoptimering hvis du bruger WordPress.

1. Test dit websted i GTmetrix

GTmetrix viser dig:

  • Indlæsningstid (primær metrisk)
  • Hvilken billeder skal optimeres
  • Hvilken plugins indlæses langsomt (tjek fanen Vandfald)
  • Dine tid til første byte (angiver hastigheden af ​​dit hosting)
  • Om din cache-plugin gør dets job (jeg anbefaler WP Rocket)
  • Uanset om du bruger en indholdsleveringsnetværk (Jeg anbefaler Cloudflare)
  • Langsom belastning eksterne ressourcer (AdSense, Maps, YouTube / Facebook-indlejringer)

Hurtige rettelser?
Hosting er faktor 1 i officiel WordPress optimeringsvejledning (langt). Det forbedrer muligvis ikke GTmetrix-scoringer, men det kan forbedre belastningstider med flere sekunder, især hvis du går fra en langsom vært (Bluehost, HostGator, GoDaddy) til en hurtig vært (SiteGround, Cloudways). Disse to værter blev bedømt højest i 40+ Facebook-afstemninger, jeg indsamlede fra Facebook-grupper.

Cache-plugins har den største indflydelse på scoringer og forbedrer også belastningstider. WP-raket er bedre end W3 Total Cache eller WP Fastest Cache, da den har flere funktioner (som doven indlæsning, databaseoprydning og Google Font + Analytics-optimering), mens andre cache-plugins ikke.

WordPress Speed ​​Video Tutorial
Hvis du bruger WordPress, brugte jeg mange timer på at oprette denne 42 minutters video til at fremskynde WordPress-websteder. Du kan bruge tidsstempler i videobeskrivelsen til at hoppe til specifikke sektioner.

Beviset findes i budding:

2019-GTmetrix-rapport

2. Ændr størrelse på store billeder

Det er hvad tjene skalerede billeder betyder i GTmetrix.

Det betyder, at du uploader store billeder med forkerte dimensioner. Hver sektion på dit websted har specifikke dimensioner (skyder, miniaturebilleder, karrusel, fuldbredde og sidefeltbilleder).

For eksempel ved jeg, at min blogs indholdsdel er 680 pixels i bredden. Alle billeder med fuld bredde, jeg bruger til min blog, skal altid ændres til disse dimensioner.

GTmetrix viser alle uoptimerede billeder (og de korrekte dimensioner, de skal ændres til), men kun for den enkelt side, du tester. Alt hvad du skal gøre er at ændre størrelsen på disse billeder og erstatte den gamle version med den nye.

Server skaleret billeder

Bonus: opret et snyderi – skriv ned alle de forskellige billedstørrelser på dit websted.

  • Logo: 200 x 58 px
  • Favicon: 16 x 16 px
  • Glider: 1903 x 400px
  • Karruselbilleder: 115px
  • Widgetbilleder: 420 x 250 px
  • Udvalgte billeder: 250 x 250 px
  • Fuldvidde blogindlæg: 680px
  • Yoast Twitter OG Image: 1024 x 512px
  • Yoast Facebook OG-billede: 1200 x 630px

Squarespace, Wix, og WordPress-temaer skal indeholde instruktioner til ændring af størrelse på billeder.

3. Komprimere billeder

Det er hvad optimer billeder betyder i GTmetrix.

Der er mange værktøjer til at gøre dette (jeg bruger ShortPixel WordPress-plugin). Vær sikker på fjerne EXIF data for at få billeder til at indlæses endnu hurtigere, hvilket også kan gøres i nogle af nedenstående værktøjer.

billede-optimering

Billedkomprimeringsværktøjer

Vil jeg miste kvalitet?
Selv hvis du vælger tabsfri komprimering, vil du muligvis bemærke et lille tab i kvalitet. Derfor er det bedst at teste et par billeder på forhånd og tage en sikkerhedskopi, hvis du bulkoptimerer alle billeder.

4. Tilføj cache

Hvis du er bruger ikke WordPress, din platform skal tage sig af caching, minificering, kombination af filer og andre optimeringer i GTmetrix, der normalt kræver et plugin.

Hvis du bruger WordPress, spørge dig selv:

  • Bruger du et cache-plugin?
  • Hvilket cache-plugin bruger du?
  • Har du konfigureret det til de optimale indstillinger?

Disse 3 faktorer har størst indflydelse på dine score i GTmetrix, Google PageSpeed ​​Insights og stort set ethvert hastighedstestværktøj. Cache og hosting er super vigtigt!

Hvilket cache-plugin er bedst?
jeg anbefaler WP-raket som er et premium-cache-plugin. Det leveres med mange funktioner, som andre cache-plugins ikke har (databasens oprydning, hjerteslagskontrol, doven indlæsning, optimering af Google Fonts + Analytics, CDN-integration). Hvis du ville bruge disse funktioner med andre cache-plugins, skulle du installere ca. 6 ekstra plugins for at tage sig af disse optimeringer, mens WP Rocket har alt indbygget. Det nærmeste gratis cache-plugin, der gør disse, er Swift.

WP Rocket blev også bedømt som nr. 1 i flere Facebook-afstemninger:

Bedste cache-plugin-afstemning i 2016

Måling af cache-plugin i 2019

Swift vs WP Rocket

Undersøgelse af cache-plugin i 2016

Bedste cache-plugins 2018-afstemning

wp raket vs w3 totla cache

5. Opgradering til PHP 7.3

Dette gælder kun, hvis du har købt hosting (f.eks. SiteGround, Bluehost, GoDaddy).

Opgradering til PHP 7+ er meget enkel og bør have en betydelig indflydelse på belastningstider.

WordPress PHP Benchmarks

Trin 1: Log ind på din hosting-konto og find PHP-version manager (eller lignende).

Trin 2: Opgrader til den højeste PHP-version, der er tilgængelig på din hosting-konto (f.eks. PHP 7.3).

Trin 3: Test dit websted for fejl. Hvis du ser nogen, skyldes det sandsynligvis inkompatible WordPress-plugins, i hvilket tilfælde du kan bruge PHP Compatible Checker. Dette værktøj viser dig inkompatible plugins; skal du enten slette dem eller vende tilbage til en tidligere PHP-version.

Trin 4: Hold din PHP-version aktuel. Hvis din vært frigiver en ny stabil PHP-version, skal du bruge den.

6. Kontroller serverens responstid

Google PageSpeed ​​Insights fortæller dig, hvis du har en langsom server responstider (Google anbefaler, at det skal være under 200 ms). Servere kontrolleres naturligvis af din hosting.

Reducer serverens responstid

Sådan forbedres serverens responstid

  • Få bedre hosting (f.eks. Cloudways eller SiteGround)
  • Hold dig væk fra EIG vært der er berygtet langsomt
  • Sørg for, at cache er aktiveret på dit websted
  • Brug et indholdsleveringsnetværk som Cloudflares CDN
  • Fjern alle tunge og ubrugte plugins på dit websted
  • Brug en premium DNS-udbyder (få dette via din vært)

7. Vælg den rigtige hosting

Hosting er langt den største faktor på webstedshastighed:

Mange tutorials vil prøve at henvise dig til Bluehost, HostGator, GoDaddy og EIG-mærker.

Disse er alle værter af lav kvalitet, som sandsynligvis vil give dig en overflod af problemer: langsomme serverresponstider, nedetider, forældede PHP-versioner, sikkerhedssårbarheder og dårlig support.

Foretag din research i Facebook-grupper, og se på nogle afstemninger, der blev taget. Du kan også se på mennesker, der migrerede til og fra visse hostingfirmaer og offentliggjorde deres resultater.

SiteGround og Cloudways er normalt nr. 1 og # 2 i 40+ Facebook-afstemninger. SiteGround er god til delt hosting og Cloudways til cloud-hosting. Begge værter tilbyder gratis websteds migration.

Juli 2019 Hosting-anbefaling

Anbefalinger for Elementor Hosting

2017-WordPress-hosting-FB-Poll

Afstemning om hostinganbefaling

WordPress-Host-Poll Aug 2018

Shared-Hosting-Poll-2017

2019-hosting-Poll

Go-To-Hosting-selskab

WordPress-hosting-Poll-2017

Anbefalinger for 2018-vært

Foretrukne hosting til Elementor

2016-WordPress-hosting-FB-Poll

Afstemning af WordPress Hosting

Afstemning af WordPress Hosting september 2018.png

Managed-WordPress-hosting-Poll-2017

2019-værter-Poll-1

Hosting-Poll-For-Speed

WordPress-hosting-Poll-Juni-1

Migrering til hurtigere hosting gør en stor forskel:

Skift til SiteGround

SiteGround Load Time Migration

Bluehost til SiteGround GTmetrix

HostGator til SiteGround

SiteGround Google PageSpeed ​​Insights

SiteGround GoGeek-indlæsningstid

Reducerede belastningstider med SiteGround

Nye svartider på SiteGround

Cloudways responstid

HostGator til SiteGround-migrering

SiteGround-svarstider på Joomla

Skiftet til SiteGround Hosting

SiteGround-raket Forestil dig combo

SiteGround PageSpeed ​​Insights

SiteGround Blogging Migration

Ny SiteGround-responstid

SiteGround responstid forbedring

Untitled

8. Tilføj Cloudflare’s CDN

EN CDN (indholdsleveringsnetværk) betyder, at dit websted er vært på flere datacentre over hele verden. Dette reducerer geografisk afstand mellem din server og besøgende, mens du aflaster ressourcer til disse datacentre (lyser belastningen på din egen server). Du kan endda bruge flere CDN’er som StackPath eller KeyCDN hvilket tilføjer endnu flere datacentre.

CDN-WordPress-anbefaling

CloudFlare er gratis og har 200+ datacentre hvilket er langt over de fleste premium CDN’er.

Trin 1: Kontroller, om din vært giver dig mulighed for at aktivere Cloudflare på din konto. Hvis de gør det, skal du aktivere Cloudflare, så er du færdig. Hvis de ikke gør det, skal du ændre navneservere fra trin 2.

Trin 2: Tilmeld dig Cloudflare, vælg den gratis plan, tilføj dit websted, og lad Cloudflare køre deres scanning. Cloudflare fører dig gennem et sæt sider, indtil de tildeler dig 2 navneservere.

Trin 3: Log ind på din domæneregistrator og find muligheden for at indstille tilpassede navneservere (Google “brugerdefinerede navnesvarere på XYZ-hostingfirma)”. Erstat disse navneservere med Cloudflare’s.

9. Deaktiver hotlinking

Hvis du har billeder af høj kvalitet på dit websted, kan folk “låne” dem til brug på deres eget sted. Men i stedet for at gemme og uploade billederne, kopierer / indsætter folk dem fra dit websted til deres. Dette betyder, at du er vært for disse billeder på din server (ikke godt).

Du kan aktivere hotlink-beskyttelse i CloudFlare eller ofte gange, i din hosting-konto. Dette forhindrer folk i at bruge dine dyrebare serverressourcer ved at kopiere / indsætte dine billeder.

Cloudflare Hotlink-beskyttelse

10. Komprimer filer

GTmetrix beder dig om at minimere HTML-, CSS- og JavaScript-filer.

Dit cache-plugin skal tage sig af dette (hvis ikke, skal du sørge for, at deres indstillinger er aktiverede).

11. Kombiner filer

Hvis du har flere CSS- eller JavaScript-filer, kan du prøve at kombinere dem i en enkelt fil.

Jo mindre CSS- og JavaScript-filer, du har, jo mindre anmodninger indlæses på dit websted.

Trin 1: Find dine CSS (eller JavaScript-filer).

Trin 2: Kopier / indsæt indholdet, så de alle er i én fil.

Eller de fleste cache-plugins har en mulighed for at kombinere CSS + JavaScript:

Komprimer Kombiner JavaScript-filer

12. Undgå tunge plugins

Hvis du bruger WordPress-plugins, Joomla Extensions eller eventuelle “tilføjelser”, der tilføjer funktionalitet til dit websted, skal du sørge for, at de ikke føjer til dine belastningstider (brug GTmetrix til benchmarks).

De mest almindelige langsomme plugins er relateret til porteføljer, skydere, social deling, sidebyggere, live chat, kalendere, statistik (analytics), kontaktformular eller relaterede post plugins.

Sådan finder du langsomme plugins på dit websted
Hvis du ser det samme plugin vises flere gange i din GTmetrix-rapport, og det har høje belastningstider i fanen Vandfald, kan du overveje at slette det og udskifte det med et mere let plugin. Til WordPress kan du også bruge Forespørgselsmonitor for at se dine langsomste indlæsning af plugins.

Bonus: Deaktiver selektivt plugins
Brug en plugin som Aktiver Manager for at deaktivere plugins selektivt fra at køre på bestemte sider. Hvis du f.eks. Kun bruger din kontaktformular på kontaktsiden, skal du deaktivere den overalt ellers.

13. Rengør din database

Når du opdaterer indlæg, installerer og sletter plugins eller udfører andre opgaver på dit websted, begynder dette at akkumuleres oppustning i din database. Det er bedst at rengøre det en gang hver anden uge.

Du kan rense din database ved hjælp af den gratis WP-Optimer plugin, eller brug WP Rocket:

WP-optimer ren database

14. Optimer eksterne ressourcer

Eksterne ressourcer er alt fra indlejrede YouTube-videoer til Google-skrifttyper, Google Analytics, Gravatars og alt, hvad der kræver, at oplysninger trækkes, danner et eksternt websted. Disse kan ødelægge din GTmetrix-rapport, især Google AdSense, da den kører på hver side.

Tip til optimering af eksterne ressourcer

15. Kombiner Google-skrifttyper

Bruger du Google-skrifttyper, Font Awesome eller andre eksterne skrifttyper?

Disse vil sandsynligvis medføre ekstra anmodninger i GTmetrix, da de er en ekstern ressource.

Google-Skrifttyper-GTmetrix

Tip til optimering af Google-skrifttyper

  • Vær vært for Google-skrifttyper lokalt
  • Vælg kun de skrifter / vægte, du har brug for
  • Kombiner flere fontfiler i 1 fil (manuelt eller via WP Rocket eller Autoptimize)

16. Lazy Load Images + Videos

Lat indlæsning betyder, billeder, videoer og iframes indlæses kun, når brugerne ruller ned ad siden og faktisk ser dem. Dette kan forbedre de indledende belastningstider på dine sider markant.

Indlejrede videoer kan være et af de tyngste elementer på en side – doven indlæsning af 2 videoer (og erstatning af iframe med et eksempelbillede) barberede hele 4 sekunder fra et af mine indlæg.

Til WordPress kan du bruge WP Rocket, WP YouTube Lyte eller plug-in Lazy Load.

For Squarespace, prøv dette Lazy Load-funktion.

WP-Rocket-Lazy-Load

17. Undgå reklamer

Google AdSense er berygtet for at få websider til at gå langsomt, og det er ikke engang så rentabelt. Du kan prøve Annoncebalancer og Raketlæsser, men du vil have mange fejl i din GTmetrix-rapport uanset og har det bedre med at tjene penge med affiliate marketing. Glem AdSense – de mest succesrige mennesker, der tjener $ 50 000 000, bruger tilknyttede links, der ikke bremser dit websted.

GTmetrix-reklamer

18. Overvej AMP

AMP (accelererede mobilsider) får dine mobile sider til at indlæse hurtigere, mens du giver et AMP-stempel i mobile søgeresultater. Problemet er, dette ændrer designet på dine mobile sider. Du kan bruge AMP til WP-plugin at tilpasse dem, men det er bare ikke det samme. Kinstas konverteringer faldt 58% når jeg tilføjede AMP, så jeg faktisk besluttede at deaktivere dem på mit eget sted. Men det er værd at overveje. Her er en AMP-tutorial til Squarespace hvis du bruger det.

19. Find langsomme sider i Google Analytics

Du kan finde dine langsomste indlæsningssider i Google Analytics under Adfærd → Webstedshastighed → Forslag til hastighed.

Oftest indlæses disse sider langsomt, fordi de har masser af billeder, videoer eller eksterne ressourcer. Det skyldes, at de fleste hastighedsfaktorer gælder for hele dit websted, ikke kun 1 side.

Speed-forslag-Google-Analytics

20. WordPress-specifikke optimeringer

Jeg har allerede dækket en hel del WordPress-specifikke optimeringer, men her er et par flere.

  • Brug et top-klassificeret cache-plugin som WP Rocket
  • Brug et godt billedeoptimeringsplugin som ShortPixel
  • Brug Heartbeat Control-pluginet til at deaktivere Heartbeat API
  • Slet alle plugins, du ikke bruger, og brug lette plugins
  • Rengør din database ofte ved hjælp af WP-Optimize eller WP Rocket
  • Cache Gravatars ved hjælp af et plugin som Harrys Gravatar Cache, FV eller Optimum
  • Brug Asset Manager til selektiv at deaktivere plugins fra indlæsning på visse sider
  • Host Google Analytics lokalt ved hjælp af et plugin som WP Rocket eller CAOS Analytics
  • Vær vært for Google-skrifttyper lokalt ved hjælp af et plugin som OMGF eller selvhostede Google-skrifttyper

21. WooCommerce-optimeringer

Som standard tilføjer WooCommerce ekstra scripts, stilarter og kurvfragmenter til dit websted. De kræver også typisk flere plugins. Derfor skal du sandsynligvis gå til VPS, sky eller semi-dedikeret hosting, når du vælger en hostingplan for at sikre, at den kan håndtere det ekstra ressourceforbrug. Ellers ved delt hosting kan du muligvis ende med at overskride værtsens CPU-grænser.

WooCommerce indkøbsvogn fragmenter

Deaktiver vognfragmenter – vognfragmenter opdaterer varerne og det samlede antal i vognen, men det kan tage alt fra 1 sekund til så længe som 10 sekunder at indlæse. Din bedste indsats er at deaktiver kurvfragmenter på startsiden + indlæg, da det er her, de ikke er brugt. Følg denne tutorial.

Deaktiver WooCommerce-scripts – WooCommerce kan også indlæse omkring 8 forskellige scripts på dit websted. For at deaktivere disse, tag fat i dette kode fra Github og tilføj den til din features.php-fil.

Deaktiver WooCommerce-stilarter – WooCommerce har også stilarter, der indlæses på hver enkelt side. Her er en vejledning til deaktivering af dem.

Perfmatters – Dette smarte plugin fra Kinsta gør det let at deaktivere vognfragmenter, scripts og stilarter. Hvis du vil have en nem måde at deaktivere dem uden at redigere kode, kan du prøve dette premium plugin.

Ryd kundesessioner – Hvis dit WooCommerce-websted er langsomt, kan du prøve at rydde kundesessioner.

Forøg hukommelsesgrænsen til 256 MB – WooCommerce kræver, at du øger din hukommelsesgrænse til 256 MB, men du skal virkelig gøre dette for de fleste websteder. Her er en tutorial for at gøre det.

22. Ansæt nogen, der ved hvad de laver

Brug for hjælp til at rette dit websted med langsom lastning?

Jeg arbejder med et par udviklere, der er specialiserede i WordPress-hastighedsoptimering. Du kan tjekke deres portefølje på den side, og jeg krediterer dem for at få mine GTmetrix-scoringer til 100%. Cole administrerer alle hastighedsoptimeringsprojekter, du kan nå ham på [email protected]

23. Ofte stillede spørgsmål

&# X1f680; Hvilke faktorer har den største indflydelse på belastningstider?

Valg af den rigtige hosting, plugins og cache-plugin kan have størst indflydelse på dine belastningstider. Det er også meget vigtigt at optimere billeder og undgå eksterne ressourcer som Google AdSense. Brug af et gratis indholdsleveringsnetværk som Cloudflare vil også hjælpe.

&# X1f680; Hvilket værktøj er bedst til test af hastighed?

GTmetrix har de mest robuste anbefalinger ud af alle hastighedstestværktøjer. Google PageSpeed ​​Insights er primært godt til 1 ting – måling af serverens responstid.

&# X1f680; Hvordan kan jeg fortælle, hvad der bremser mit websted?

GTmetrix fortæller dig, hvilke billeder der skal optimeres, uanset om du bruger en CDN, og plugins, der kan vises flere gange i din rapport eller i dit GTmetrix-vandfald. Det måler også tid til første byte, hvilket er en god indikator for, om din hosting er langsom.

&# X1f680; Hvad er nogle mindre kendte hastighedstip?

Mange mennesker opgraderer ikke deres PHP-version eller optimerer eksterne ressourcer som Google Fonts og YouTube-videoer. Lazy indlæsning af billeder og videoer og hosting af Google-skrifttyper og Google Analytics lokalt kan løse mange elementer i GTmetrix. Du bør også tilslutte dig Facebook-grupper for at få uvildige udtalelser om de bedste hosting-udbydere for at undgå tilknyttede fælder.

&# X1f680; Hvilken hosting er bedst?

SiteGround og Cloudways er 2 solide hostingudbydere, der blev bedømt højt i Facebook-afstemninger. SiteGround er en af ​​de mest populære delte værter og Cloudways til cloud-hosting. Disse er normalt top 2 i deres klasse.

&# X1f680; Hvilket cache-plugin er bedst?

WP Rocket blev bedømt som cache-plugin nr. 1 i flere Facebook-afstemninger, da det leveres med mange hastighedsoptimeringsfunktioner, som de fleste cache-plugins ikke gør (doven indlæsning, databaseoprydning, vært for Google-skrifttyper og Google Analytics lokalt). Du skal få optimale resultater med WP Rocket, ellers er Swift Performance et godt gratis plugin-alternativ.

Jeg håber virkelig, at denne tutorial var nyttig. Hvis du har brug for hjælp, skal du forlade din GTmetrix-rapport i kommentarerne, så vil jeg slå dig op med et par forslag. Eller overvej at ansætte min hastighedsoptimering.

Skål,
Tom

Jeffrey Wilson Administrator
Sorry! The Author has not filled his profile.
follow me
    Like this post? Please share to your friends:
    Adblock
    detector
    map