Her presenteres en rekke strategier for å forbedre hastigheten på din nettside, strategier du absolutt burde vurdere.
Dersom din nettside bruker mer enn tre sekunder på å laste inn, risikerer du å miste potensielle inntekter og en gunstig posisjon i søkemotorresultatene. Likeledes, om sikkerheten er mangelfull, utsetter du deg for potensielle angrep fra hackere, med risiko for tap av omdømme og økonomiske ressurser.
Følgelig er det umulig å ignorere viktigheten av sikkerhets- og ytelsesforbedringer for en optimal brukeropplevelse.
Når vi diskuterer ytelsesoptimalisering, kommer ofte temaer som aktivering av komprimering, minimering av filstørrelser, bruk av caching, lette designmaler og begrensning av antall plugins opp.
Disse tiltakene er nyttige, men det finnes en rekke andre strategier som kan anvendes på ulike plattformer som WordPress, Joomla, Magento, Drupal, Node.js og flere, og disse vil vi presentere i denne artikkelen.
La oss se på hva du kanskje allerede har implementert, og hva som fortsatt kan forbedres.
Optimal Hosting
Noen ganger ligger feilen i valg av en upålitelig webhost og en delt hostingplan.
Men etter min mening handler det ikke nødvendigvis om dårlige tilbydere, men om ekstremt billige hostingabonnementer.
Det er et faresignal når dine månedlige hostingkostnader er lavere enn prisen for en kaffekopp.
Tenk deg delt hosting som en overfylt buss, ingen ønsker å stige ombord, men likevel kryper alle inn på grunn av en fristende billettpris.
De mest attraktive aspektene ved delt hosting er introduksjonstilbudene og den manglende åpenheten rundt hvor mange nettsider som deler den samme serveren.
La meg være tydelig; disse tallene kan ofte være hundrevis.
Dette medfører hyppige flaskehalser på grunn av støyende medtrafikanter på serveren, og mange av disse nettsidene oppnår aldri tilstrekkelig synlighet til å vises på de første sidene i Google-søket.
For prosjekter som betyr noe, bør du vurdere VPS (Virtual Private Server) eller dedikerte servere.
Content Delivery Network (CDN)
Et innholdsleveringsnettverk, eller CDN, er det nest viktigste tiltaket etter valg av en god hostingløsning.
Dette er spesielt relevant for de som har et internasjonalt publikum. Nettsider er som oftest lokalisert på ett sted. Avstand blir derfor en utfordring når for eksempel en bruker i Japan prøver å få tilgang til en side som er hostet i New York.
Et CDN som Cloudflare løser dette problemet. Et CDN lagrer kopier av din nettside på et nettverk av servere, og leverer innholdet fra den serveren som er nærmest brukeren. Dette reduserer belastningen på den sentrale serveren som kan være plassert langt unna.
I tillegg til dette tilbyr CDN-er ofte høyere sikkerhet sammenlignet med det en vanlig webhost kan tilby.
Aktiver IPv6
IPv6 er raskere enn IPv4. LinkedIn har observert en forbedring på 40% i Europa, og Facebook rundt 10-15% ved bruk av IPv6.
Se på Googles graf over global IPv6-adopsjon:
Omtrent 42% av brukerne kobler seg til Google via IPv6, mens bare 21,2% av nettsidene har IPv6 aktivert.
Cloudflare har funnet ut at IPv6-aktiverte sider laster 27% raskere enn deres IPv4-motparter.
Har din nettside IPv6? Om du er usikker, kan du teste dette online.
Dersom du ikke har IPv6 aktivert, er det slik du går frem:
De fleste CDN-leverandører som Cloudflare, Incapsula, CacheFly, AKAMAI tilbyr IPv6. Du kan sjekke ditt kontrollpanel for å aktivere det.
Dersom du ikke bruker CDN og har hosting på VPS som Linode eller DigitalOcean, kan du finne instruksjoner for å aktivere IPv6 i Nginx og Apache webservere.
Å aktivere IPv6 er en fordel og vil gi en merkbar reduksjon i innlastingstiden, typisk rundt 10%.
Bruk HTTP/3 eller HTTP/2
HTTP er den teknologien som brukes for å laste inn nettsider når du besøker en URL i din nettleser.
Det begynte med HTTP/0.9 i 1991, fulgt av oppdateringer som HTTP/2 og den nyeste HTTP/3.
HTTP/2 ga flere fordeler sammenlignet med HTTP/1.1, inkludert:
- Server push
- Multipleksing
- Ressursprioritering
- Topptekstkomprimering
- Lav ventetid
HTTP/2 benyttes i dag av 39.3% av nettsidene og er syv ganger raskere enn HTTP/1.1. Ved å bytte til HTTP/2 kan du redusere innlastingstiden med 30-40%.
Sjekk om din nettside har HTTP/2 aktivert.
HTTP/2 har imidlertid sine utfordringer.
For eksempel kan det oppstå blokkering i køen. Et TCP-tilkoblingsproblem kan blokkere alle strømmer. Med UDP-basert HTTP/3 påvirkes ikke andre strømmer av et enkelt pakketap.
I tillegg muliggjør HTTP/3 lavere ventetid ved å unngå TLS-håndtrykk ved gjentilkoblinger. Samlet sett arver HTTP/3 de positive aspektene ved HTTP/2, men uten de tilhørende ulempene.
Sjekk om din nettside er HTTP/3 aktivert.
Du kan sjekke om din webhotell-leverandør tilbyr støtte for HTTP/3 eller HTTP/2. Alternativt kan din CDN-leverandør ha en enkel innstilling for å velge ønsket HTTP-versjon.
Bildeoptimalisering
Ingen ønsker å møte en vegg av tekst, og bilder er derfor en viktig del av enhver nettside. Samtidig kan tunge bilder øke lastetiden.
Løsningen er å bruke lette formater som WebP eller AVIF. Disse formatene reduserer størrelsen betraktelig (over 80% i noen tilfeller) uten at det går ut over kvaliteten.
Du kan konvertere og laste opp bildene direkte i disse moderne formatene, eller benytte en tredjeparts tjeneste som Optimole for å gjøre konverteringen automatisk.
Reduser HTTP-forespørsler
En nettside lastes ikke som en enkelt enhet. Hvert element som tekst, bilder, CSS og JavaScript lastes som individuelle HTTP-forespørsler.
En nettside med færre HTTP-forespørsler vil laste raskere enn en side med mange forespørsler.
Det er derfor i vår interesse å redusere antallet HTTP-forespørsler så mye som mulig.
Fra min egen erfaring med WordPress, har jeg sett at det å velge et lett tema som Generate Press er en fordel. I tillegg vil det å redusere antall plugins også bidra til en raskere og tryggere nettside.
Dette er et eget tema som krever spesiell oppmerksomhet.
Sjekk disse tipsene for å redusere HTTP-forespørsler dersom du har en WordPress-side.
Bruk Nettsikre Fonter
Vi ønsker alle at nettsidene våre skal se unike og brukervennlige ut. Det første mange gjør, er å velge en annen font.
Heldigvis finnes det en rekke gratis alternativer, inkludert Google Fonts. Disse vil imidlertid legge til flere HTTP-forespørsler. I tillegg vil nettsiden falle tilbake til systemfonter dersom tredjeparts fontserver går offline.
For å unngå dette, velger noen å ha fontene på sine egne servere. Dette legger imidlertid også til en fil som må lastes ned fra serveren til brukerens enhet. Det medfører ytterligere HTTP-forespørsler som gir et ytelsesproblem, uansett hvor lite det er.
Det finnes derfor nettsikre fonter som kan benyttes for raskest mulig opplevelse, uten å risikere fontbytte ved serverfeil. Disse fontene er systemfonter som er vanlige på Windows-PCer, Mac, Linux, iOS, Android osv.
Her er noen nettsikre fonter:
- Arial
- Verdana
- Trebuchet-MS
- Tahoma
- Times New Roman
- Georgia
- Impact
Utnytt Caching
Caching betyr å lagre data lokalt. Dette sikrer raskere innlasting av nettsiden ved gjenbesøk. Eksperter anbefaler ofte caching for å redusere innlastingstid.
For eksempel har WordPress en rekke cache-plugins som WP Fastest Cache. Alternativt kan du implementere nettleser-caching ved å redigere .htaccess-filen.
Dette er imidlertid plattformavhengig og det finnes ulike måter å implementere caching på.
Asynkron Lasting
Dette er en annen erfaring fra min egen WordPress-bruk. Google Search Console ga en advarsel om mine 40+ blogginnlegg som ikke bestod testene for kjerne-webvitaler.
Kjerne-webvitaler er Googles sidevurdering og er viktig for alle som ønsker å rangere høyt i søkemotoren.
For å forstå dette nærmere, se på denne PageSpeed-analysen i en av tipsbilk.net sine artikler:
Takket være mine WordPress-utviklere, besto denne testen med glans.
Men på mitt personlige prosjekt, mislyktes jeg spesielt i Largest Contentful Paint (LCP) og First Contentful Paint (FCP). LCP var 3.3 sekunder, og FCP var rundt 2.4 sekunder.
Som en blogger uten IT-bakgrunn, klarte jeg ikke å optimalisere mer enn et visst punkt. Jeg hadde krysset av for de fleste av de riktige valgene: premium-tema, ingen ekstra plugins, systemfonter, WebP-bilder og skyhosting.
Det som hjalp var en enkel innstilling i Jetpack Boost WordPress plugin:
Kort forklart laster denne tredjeparts JavaScript asynkront ved å legge til asynkron- eller defer-attributter til <script>-tagger. På denne måten lastes skriptene separat i bakgrunnen uten å blokkere sidens struktur.
For meg reduserte dette LCP og FCP til henholdsvis 1.7 og 1.2 sekunder.
Bare så det er sagt, fjernet jeg også det utvalgte bildet fra sideoppsettet i tillegg til å bruke dette innstillingsvalget, før jeg oppnådde de nevnte LCP- og FCP-verdiene.
Minimer Omdirigering
Ideelt sett skal det ikke være noen omdirigeringer for å oppnå best mulig ytelse. Likevel bruker vi alle omdirigeringer på et tidspunkt.
Regelen er enkel: hver omdirigering legger til litt tid til sideinnlastingen. For mange omdirigeringer kan føre til at brukeren velger en konkurrent.
Vær Forsiktig Med Videoer
Videoer øker tiden på siden og bidrar til å unngå en monoton tekst. De er et godt alternativ til bilder, og er ofte uunngåelige.
Den vanligste måten å gjøre det på er å bygge inn YouTube-videoer. Du kan sammenligne to nettsider, en med og en uten YouTube-videoer, i Google PageSpeed for å se hvilken effekt innbyggingen har på ytelsen til nettsiden.
For å illustrere dette, har jeg publisert to innlegg på vårt testnettsted. Det ene har en YouTube-video uten annet innhold, og det andre har ingenting. Deretter sammenlignet jeg disse to i Google PageSpeed.
Ser du effekten på Total blokkeringstid, Hastighetsindeks, FCP og LCP? Spesielt la den til et helt sekund i total blokkeringstid, noe som kan få brukere til å velge en konkurrent.
For å bekrefte disse resultatene og få mer informasjon, testet jeg disse to URL-ene i Pingdoms verktøy for hastighetstest.
Du ser at en enkel YouTube-video legger til 23 ekstra HTTP-forespørsler, øker sidestørrelse og lastetid, og reduserer den generelle ytelsen.
Det finnes likevel noen triks for å redusere denne nedgangen. For det første kan du velge asynkron lasting for videoer, noe som vil redusere total blokkeringstid.
I tillegg er latlasting også et alternativ. Det finnes mange WordPress-plugins for YouTube-integrering som kan gjøre denne jobben.
Til slutt er det best å bygge inn videominiatyrer, som kun laster videoen når den klikkes.
Reduser HTML, JavaScript og CSS
Dette kan virke som en dråpe i havet, men minifisering gjør ting smidigere.
Minifisering fjerner unødvendige elementer fra kildekoden, inkludert ekstra mellomrom, semikolon, kommentarer og linjeskift, og gjør alt mer kompakt.
Avhengig av plattformen din, må du kanskje gjøre dette selv eller bruke et verktøy til å minifiere koden for deg. Det er alltid best å ta sikkerhetskopi av standardversjonene, da det er en utfordring å endre minifisert kode.
En maskin vil lese den kompakte koden fint, og du vil oppleve en merkbar ytelsesforbedring.
Bruk Webkomprimering
Webkomprimering fungerer på samme måte som zip, men brukes på webfiler for å redusere sideinnlastingstid. Dette støttes av moderne nettlesere.
Et nettsted med komprimering aktivert vil laste komponenter raskere enn et nettsted uten, forutsatt at alle andre forhold er like. Denne komprimeringen fungerer på HTML, JavaScript, CSS, bilder osv., og kan redusere sidestørrelsen med over 70% i noen tilfeller.
Det finnes to alternativer: Gzip og Brotli. Mest sannsynlig vil din webhost bruke en av disse.
Du kan likevel teste komprimeringen for å bekrefte hvilken som er aktivert på ditt nettsted. Spør din webhotell-leverandør eller en webutvikler om å implementere komprimering dersom det mangler.
Eksterne Elementer
Du kan betrakte dette som en utvidelse av avsnittet om HTTP-forespørsler, men dette må nevnes separat.
Eksterne elementer på en nettside inkluderer alt som ikke er integrert, som reklame, analyse, plugins, forum, osv.
Slike elementer legger til ekstra kode på nettsiden din, som igjen medfører flere HTTP-forespørsler, og gjør nettsiden tregere og mindre brukervennlig.
Noen få elementer er vanskelig å unngå. Vær minimalistisk og eksperimenter med ulike tjenester for å finne de som gir minst ytelsespåvirkning.
En Raskere Nettside!
Nettstedsytelse er ikke noe du bare setter opp og glemmer. World Wide Web utvikler seg kontinuerlig, og det er viktig å holde seg oppdatert for å oppnå førsteklasses hastighet og sikkerhet.
Sikkerhet er like viktig som hastighet.
Som WordPress-eksperter, vil vi også anbefale noen av de beste sikkerhetspraksisene for WordPress.