Hvordan utnytte nettlesercaching av WordPress med eller uten et plugin [5 måter]

Nettstedet er tregt og prøver å forbedre det? Du har sannsynligvis sett denne advarselen, men er ikke sikker på hva det betyr eller hvordan du løser det ... men vi har dekket deg. Å utnytte nettleserbufring er en måte å gjøre nettstedet ditt raskere, men å instruere nettleseren om å lagre eller "cache" filer i en stund, slik at de ikke trenger å lastes ned igjen ved et senere besøk. Det er kort sagt alt dette betyr. 

Men vær og les alt om hvordan du sørger for at du gjør nettstedet ditt raskere ved å fikse denne feilen eller advarselen.

I hovedsak, hvis du vil benytte nettleserbufring, må du spesifisere hvor lenge nettlesere skal lagre bilder, CSS og Javascript -filer lagret lokalt i klientleseren. Brukeren av disse spesifikasjonene og innstillingene, brukerens nettleser less data mens du surfer gjennom nettstedets sider (fordi den trenger å laste ned færre filer). Å utnytte nettleserbufring av WordPress betyr en forbedring i lastehastigheten til nettstedet ditt.

Hvis du har kort tid, er dette den enkleste måten å utnytte WordPress-caching i nettleseren:

Slik løser du WordPress-advarsel om bruk av nettleserbuffering

1. Last ned pluginet som du finner her.
2. Gå til Dashboard på WordPress, og besøk deretter: Dashboard> Plugins> Legg til nytt
3. Søk etter "Leverage Browser Caching" eller klikk Last opp plugin og velg filen du lastet ned, og klikk deretter Installer nå
4. Aktiver plugin
5. Test nettstedet ditt på nytt for å bekrefte at de nye innstillingene fungerer som de skal, og at advarselen er borte

Ved å implementere disse minimale endringene, vil du se at poengsummen din på slike nettsteder som GTMetrix, Pingdom Tools eller Pagespeed Insights vil øke betydelig.

Dette er faktisk en av de enkleste måtene å gjøre WordPress-nettstedet raskere.

Det innebærer veldig lite innsats i det hele tatt fra din side, og er en av de høyest prioriterte oppgavene som anbefales Google for å få nettstedet til å lastes raskere. Det anbefales også av nettsteder som GTMetrix eller Google Pagespeed Insights for å gjøre belastningen raskere. 

Hva er Browser Caching?

Du kan utnytte caching i nettleseren gjennom prosessen med å sette en lang utløpsdato på det statiske innholdet på nettstedet ditt. Dette gjør det mulig for nettlesere å "utnytte" caching og bruke disse filene om og om igjen, uten å måtte laste dem ned. Ved å cache disse filene trenger de ikke å lastes ned igjen, så nettstedet ditt er raskere å laste inn.

Hvis du helst vil se dette som en video, har vi nylig lastet opp denne artikkelen som en YouTube-video, så sjekk den nedenfor:

Før vi faktisk viser deg hvordan du skal implementere dette, skal vi først diskutere hva som utnytter nettlesercaching i WordPress og hvordan det fungerer!

Når vi har forklart hvordan det fungerer, kan du forstå hvordan det hjelper få sidene dine til å lastes raskere. 

I hovedsak, når noen besøker en side, må nettleseren laste ned alle ressursserverne på det domenet fra serveren. Disse inkluderer HTML, CSS-fil, JS, tekst, bilder og andre eiendeler) for å laste og vise gjeldende side.

Nå, i stedet for å laste ned alt om og om igjen hver gang du besøker en annen side på det samme nettstedet, bruker nettleseren det som kalles en webcache. Dette er en funksjon som brukes av nettlesere til å 'midlertidig lagre' eller 'cache' nettsider på enhetens lokale lagring. Denne lagringen eller dataene kalles ' Nettbuffer'eller'HTTP-hurtigbuffer'.

Ta en titt på dette morsomme diagrammet som forklarer hvordan nettbuffering fungerer:

Vi kan se ovenfor at den første gangen brukerenheten (til venstre) ber serveren (til høyre) om bilder / logofilen, blir forespørselen snappet opp av web-cachemekanismen (som sjekker om den har en kopi av den filen). Hvis den ikke gjør det, henter den den fra serveren. Ved neste besøk, i stedet for å gå til serveren, får den det fra sin egen kopi.

Så skjønnheten til denne funksjonen er at når en bruker besøker det samme nettstedet igjen, eller en annen side på samme domene, vil nettleseren bruke kopien som for øyeblikket ligger i den midlertidige hurtigbufferen - i stedet for å måtte laste ned alle ressursene over igjen. Nettleseren laster bare ned alt som er annerledes.

Siden mange nettsteder bare vil ha minimale endringer fra en side til en annen og mellom besøk, kan gjenbruk av cachekopien gjøre at siden kan lastes mye raskere.

Dette bidrar også til å redusere båndbreddeforbruket til webserveren din og reduserer også belastningen på serveren. Du kan også ha møtt en advarsel når du optimaliserer sidene dine for hastighet.

Sidespeed-advarsel til utnyttelse av hurtigbufring av nettleser

Nettsteder som GTMetrix eller Pagespeed Insights kan vise følgende utnytte caching i nettleseren advarsel, som du må fikse hvis du ikke har aktivert innstillingene nedenfor.

men dette var faktisk advarselen som ble vist i en eldre versjon av Pagespeed Insights. Den nyere advarselen ser litt slik ut:

Server statiske eiendeler med en effektiv cache-policy

Nå, hva betyr dette egentlig?

Selv om den ovenfor beskrevne funksjonen er god i teorien, vil de fleste nettsteder som standard "merke" innholdet for å utløpe etter 8 dager eller en kort periode. Hva dette betyr er at hvis en bruker besøker domenet ditt igjen etter 1 uke, må de laste ned ressursene på nytt.

Når vi setter opp en metode for å utnytte caching i nettlesere, er det vi faktisk gjør å instruere nettleseren om å forlenge levetiden eller utløpsdatoen for ressursene som blir lastet ned av våre besøkende og dermed optimalisere ytelsen.

Ved å forlenge levetiden til hurtigbufferen (eller hvor lang tid det tar for en fil å bli gammel), sørger du for at de besøkende ikke trenger å vente med å laste ned de samme tingene hver gang de besøker nettstedet ditt.

Dette innebærer veldig små endringer og er ikke veldig komplisert å implementere - og du finner den eksakte syntaksen nedenfor.

Hva endringen faktisk gjør, er å angi utløpsdatoer for innhold ved å legge til Cache-Control-overskrifter og ETag-overskrifter i HTTP-overskrifter. Cache-Control-overskriften erklærer hurtigbufringstiden for en bestemt fil eller filtype. ETag brukes deretter til å verifisere eventuelle endringer som eksisterer (eller ikke) mellom de bufrede og etterspurte ressursene.

Innstillingen lar deg vanligvis spesifisere perioden i dager, måneder eller år for lagring av cachefiler lokalt. Selvfølgelig, hvis du forventer å endre ressursene så ofte, er det tilrådelig å angi utløpsdatoer med en frekvens som tilsvarer omtrent perioden du forventer å endre disse. 

Forresten, hvis du ønsker å gjøre WordPress raskt, er det noen få plugins som dette som kan utgjøre en reell forskjell i ytelse på få minutter (med liten eller ingen innsats). 

Er du ikke klar til å bruke et plugin for nå? Les videre...

Hvis du er interessert i å gjøre nettstedet ditt raskere - vil vi anbefale å besøke artikkelen vår: [25 handlinger] Fremskynde WordPress: Få et superrask nettsted i dag - en komplett guide.

1. Bruke .htaccess-filen

Her er de nøyaktige instruksjonene du trenger å utføre:

1. Få tilgang til CPanel til hostingkontoen din
2. Gå til rotmappen på nettstedet
3. Åpne .htaccess-filen med File Editor. Hvis du ikke finner filen, sjekk om du kan se skjulte filer (.htaccess-filen er skjult som standard)
4. Legg til følgende endringer nederst i filen
5. Legg til utløpsoverskrifter med lange utløpstider
6. Legg til cache-kontrolloverskrifter
7. Uinnstilte ETag-overskrifter
8. Ikke gjør noen andre endringer
9. Lagre filen
10. Kjør testen på nytt

For å angi utløpstiden for ressurser som bilder og CSS-filer, krever det en liten endring i .htaccess-filen. Dette finnes i roten til hosting-serveren din. Du kan endre verdiene for utløpsoverskrifter for å øke ytelsen. 

Sett disse verdiene så lenge det er fornuftig for nettstedet ditt - 1 måned er vanligvis god nok.

#Customize utløper hurtigbufring - juster perioden etter dine behov FileETag MTime Størrelse AddOutputFilterByType DEFLATE tekst / ren tekst / html tekst / xml tekst / css applikasjon / xml applikasjon / xhtml + xml applikasjon / rss + xml applikasjon / javascript applikasjon / x-javascript utløper aktivt på utløper applikasjon / xhtml + xml "tilgang 600 sekunder" UtløperByType tekst / css "tilgang 600 måned" UtløperByType tekst / javascript "tilgang 1 måned" UtløperByType tekst / x-javascript "tilgang 1 måned" UtløperByType applikasjon / javascript "tilgang 1 måned" UtløperByType applikasjon / x-javascript "access 1 month" ExpiresByType application / x-shockwave-flash "access 1 month" ExpiresByType application / pdf "access 1 month" ExpiresByType image / x-icon "access 1 year" ExpiresByType image / jpg "access 1 year "ExpiresByType image / jpeg" access 1 year "ExpiresByType image / png" access 1 year "ExpiresByType image / gif" access 1 year "ExpiresDefault" access 1 month "
# Utløper hurtigbufring

Tror du ikke er komfortabel med å gjøre disse endringene selv?

Hvis du ikke er sikker på å gjøre en slik endring, kan du velge å gjøre disse via en billig konsert på Fiverr. 

Finn de beste nettstedets hastighetsoptimaliseringsspill på Fiverr

Med de ovennevnte endringene setter vi inn ressurser som oppdateres raskt, for eksempel HTML-en på siden din, til å utløpe etter 600 sekunder (dette er fordi HTML vanligvis endres oftere). Vi endrer også ting som CSS og Javascript for å utløpe bare en gang i måneden (slike filer endres bare hvis du gjør endringer i malen eller pluginene dine).

Dette betyr at hvis besøkende besøker siden igjen innen en måned, trenger de ikke å laste ned CSS- og JS-ressursene dine på nytt. Hvis du vet at du sjelden utfører denne typen endringer på nettstedet ditt - kan du sette verdien høyere, til 1 år, i likhet med jpeg, png utløper header.

Dette er den mest effektive måten å utnytte caching av nettlesere på WordPress eller andre nettsteder som bruker en .htaccess-fil.

Sett bildefiler til lang utløpstid

Som du også kan se i eksemplet vårt ovenfor, er bildene våre satt til å utløpe bare en gang i året. Noen ganger kan dette være for langt, så en måned er vanligvis også god nok. Man må finne ut hva som er fornuftig for nettstedet ditt.

Dette sørger for at det største mediet som tar mest tid å laste ned holdes på besøkendes maskin og ikke trenger å lastes ned igjen til neste år. På grunn av denne endringen i .htaccess-filen bruker du riktig nettleser-caching i WordPress - bildene lastes ikke ned igjen i ett helt år.

Dette gjør opplevelsen av en tilbakevendende kunde mye mer positiv - fordi det tar less å laste hver side. Filene som bufres blir nå gjenbrukt.

Etter at du har angitt utløpsdatoene, er det viktig å også angi riktige Cache-Control-overskrifter slik at innstillingen ovenfor faktisk fungerer riktig. Dette er en annen innstilling i .htaccess-filen, som du finner nedenfor.

Legg til cache-kontrolloverskrifter

Følgende innstilling bør også legges til i filen for å angi cache-kontrolloverskrifter som beskrevet ovenfor.

# BEGIN Cache-Control-overskrifter
Topptekst legg til Cache-Control "offentlig" Topptekst legg til Cache-Control "offentlig" Topptekst legg til Cache-Control "privat" Topptekst legg til Cache-kontroll "privat, må omvalideres"

Vi har allerede angitt utløpsdatoene, så vi trenger ikke å angi det igjen her.

Slå av ETag-overskrifter for nettsteder for flere servere eller CDNer

Den siste tingen vi trenger å gjøre er å (av) sette Etags-innstillingen.

I hovedsak er dette bare viktig hvis du bruker et CDN for å betjene noen av ressursene dine. Etags er overskrifter som vanligvis er konstruert ved hjelp av attributter som gjør dem unike for hver spesifikke maskin som er vert for et nettsted (teknisk grunn - den bruker en MD5 generert av serveren, noe som gjør den unik for serveren som genererer den).

Hvis et nettsted bruker en CDN eller flere servere for å betjene sidene sine, er det INGEN garanti for at den samme serveren vil bli brukt - derfor vil kodene ikke stemme overens når en nettleser henter den originale komponenten fra en server og senere prøver å validere den komponenten på en annen server.

Av denne grunn ville det være best å UNSET dem hvis du bruker flere servere eller en CDN for å være vert for nettstedet ditt. Dette gjør at Cache-kontrolloverskriftene faktisk kan kontrollere cachingen i stedet for ETags. Gitt at vi har satt inn innstillinger for å kontrollere caching gjennom Cache-Control-overskriftene, er ETags ikke lenger nødvendige - så vi slår dem av.

Legg dette til .htaccess-filen for å fjerne dem.

# Disable ETags
<IfModule mod_headers.c>
	Header unset ETag
</IfModule>
FileETag None

Hvis du trenger å lese mer om hva Etags gjør, kan du finne mer informasjon og lese om dem i denne artikkelen: https://en.wikipedia.org/wiki/HTTP_ETag

2. Bruke plugins

Å finjustere og leke med .htaccess-filen kan faktisk ødelegge nettstedet ditt. Hvis du gjør en liten feil, vil ikke webserveren kunne analysere den, og kaste blanke sider, eller kaste 500 feil og siden vil være død!

Så hvis du er villig til å gjøre dette, kan du installere et enkelt plugin som tar seg av alt dette. 

Selvfølgelig er det mange andre plugins som kan gjøre dette. De fleste plugins som er ment å gjøre sidene raskere, gjør de fleste av disse innstillingene i bakgrunnen. 

I hovedsak, i tillegg til å håndtere alle innstillingene for å utnytte nettleser-caching av WordPress, vil disse kunne utføre en rekke andre caching-optimaliseringer, for eksempel å lage midlertidige kopier (file caching), database-optimaliseringer, Memcache og andre optimaliseringer som gjør nettstedet ditt raskere generelt .

Disse vil inkludere plugins som WPRocket, WP Raskest Cache, og W3 Total Cache og premium caching plugins. 

La oss se noen av disse pluginene.

Plugin av Rinku Yadav

Dette er det enkleste av dem alle, det gjør ingenting annet enn å fikse nettleserens caching i WordPress.

1. Last ned pluginet som du finner her..
2. Gå til Dashboard på WordPress, og besøk deretter: Dashboard> Plugins> Legg til nytt.
3. Søk etter "Leverage Browser Caching" eller klikk Last opp plugin og søk i filen du nettopp lastet ned.
4. Klikk Installer nå.
5. Aktiver pluginet, og du er ferdig!
6. Du bør nå teste nettstedet ditt på nytt for å bekrefte at de nye innstillingene fungerer som de skal, og at advarselen er borte.

Hvis du leter etter et produkt som gjør mye mer for å gjøre nettstedet ditt raskere, vil vi anbefale å se på resten av pluginene som vi nevner nedenfor.

WP Rocket

Dette er en av de raskeste, mest anbefalte pluginene for WordPress, som kan håndtere alle hastighetsoptimaliseringene dine med noen få klikk. I hovedsak utfører dette slike hastighetsoptimaliseringer som

• komprimering av statiske filer (GZip) - for å gjøre den totale størrelsen på dataene som skal leveres mindre (vi har en fullstendig opplæring om hvordan du aktiverer GZip-komprimering i WordPress her)
• muliggjør en filbuffer (inkludert hurtigbufferlading) - å sette less stress på serveren (henter en forhåndsutgitt kopi av hver side)
• Google Fonts optimalisering - for å sikre at tyngre skrifter lastes raskt inn),
• lat lasting - slik at bilder bare lastes inn når brukeren blar ned til delen av en side der bildet kreves
• Minifisering og kombinasjon - krympe størrelsen og kombinere tekstressurser for å levere dem raskere til sluttbrukeren
• Utsett JS-lasting - slik at siden gjengis raskt i stedet for å vente på at alle eiendelene skal lastes ned. Dette er noe vi har dekket CollectiveRay.
• Integrerer og aktiverer et CDN - slik at tyngre medier blir levert raskere 
• DNS-forhånds henting - for å redusere tiden det tar å løse kilden til tredjepartsinnhold

Alt det ovennevnte kan høres ut som gibberish for alle som ikke er involvert i optimalisering av infrastruktur, men i virkeligheten er dette alle tingene du må gjøre for å få nettstedet til å lastes raskere.

Det som er bra er at med WP Rocket trenger du ikke å løfte tungt og konfigurere - alt er gjort for deg! Vi anbefaler på det sterkeste å prøve ut dette pluginet, som har blitt vurdert som den beste måten å gjøre nettstedet ditt raskere.

Besøk WP Rocket Now  

Total Cache W3

Dette er en av mest populære caching-plugins noensinne. Det har eksistert ganske lenge og har hatt mye tid til å modnes veldig pent for å bygge inn de fleste funksjonene man forventer av et caching-plugin.

Problemet er dette. Meg selv, noen som har vært rundt WordPress og webdesign i veldig lang tid, og det er en så frustrerende opplevelse å jobbe med det. Plugin er ikke rett frem å sette opp, og du må virkelig forstå det og vite det godt for å kunne få det til å gå pent.

Hvis du leter etter en god måte å utnytte surfing-caching i WordPress ved hjelp av et plugin, vil vi anbefale WPRocket ovenfor i motsetning til W3Total Cache.

3. Utnytt nettlesercaching i Nginx

Hvis nettstedet ditt faktisk bruker Nginx som server, trenger du en annen kode, fordi Nginx ikke har en .htaccess-fil. Imidlertid er det fortsatt relativt enkelt å implementere dette, fordi du bare trenger å utføre noen redigeringer i conf-filen på serveren.

Du må legge til koden nedenfor inne i en eksisterende serverblokk i conf-filen din. Dette vil vanligvis være i /etc/nginx/sites-enabled/default

server {listen 80; servernavn localhost; plassering / {root / usr / share / nginx / html; indeks indeks.html indeks.htm; } plassering ~ * \. (jpg | jpeg | png | gif | ico | css | js) $ {utløper 365d; } plassering ~ * \. (pdf) $ {utløper 30d; }}

Legg til Cache-Control Headers for Nginx

plassering ~ * \. (jpg | jpeg | png | gif | ico | css | js) $ {utløper 90d; add_header Cache-Control "public, no-transform"; }

Som du kan trekke fra koden ovenfor, setter vi utløpsplasseringen for bildefiler til 1 år eller 365 dager, mens vi setter PDF-filer til å utløpe etter 30 dager. Du kan legge til flere filtyper for å tilpasse utløpet, noe som gjør det annerledes for andre filtyper.

Eventuelle filtyper som legges til vil bli hurtigbufret tilsvarende. 

4. Hvordan lagre tredjeparts ressurser

Selv om det er ganske enkelt å bruke innstillingen ovenfor, vil du oppdage at selv etter at du har utført de ovennevnte endringene, vil du fremdeles fortsette å få denne meldingen i verktøy for hastighetstesting på nettstedet og Google Pagespeed Insights.

Dette er fordi de fleste tredjepartsskript og -tjenester ikke spesifiserer lang utløpstid - av forskjellige forskjellige grunner.

Du har ingen kontroll over disse skriptene, dessverre, så vi anbefaler deg på det sterkeste å bruke MINIMUM tredjepartsskript som er mulig. Hvis du kan leve uten skriptet, må du fjerne det fra nettstedet ditt. Ved å velge å inkludere den, vil den trekke lastetiden til sidene dine ned.

5. Spesifiser en Cache Validator

Dette er en annen advarsel som ofte vises av GTMetrix, vanligvis fra tredjepartsskript. I hovedsak er dette det samme problemet som vi nettopp har beskrevet i forrige avsnitt, der enkelte skript ikke spesifiserer verken et ETag-topptekst eller et sist modifisert topptekst som beskrevet.

Dessverre er det ikke mye du kan gjøre for å løse dette problemet, hvis disse spesifikke feilene kommer fra domener som er utenfor din kontroll, for eksempel Facebook, eller i tilfelle bildet nedenfor, Sumo - så det er ingenting du kan fikse .

Den eneste løsningen din, i dette tilfellet, er å fjerne disse skriptene fra domenet ditt fullstendig hvis du vil være sikker på at denne advarselen ikke vises.

Ofte Stilte Spørsmål

Hvordan løser du utnyttelse av caching i nettleseren?

Den enkleste måten å utnytte caching i nettleseren på, er å installere et plugin som lar deg spesifisere cache-levetiden til forskjellige typer statisk innhold. En alternativ, men enkel metode er å spesifisere cachetiden i .htaccess-filen på nettstedet ditt. Vi har detaljerte instruksjoner om hvordan du gjør dette her.

Hvordan aktiverer jeg hurtigbuffer i WordPress?

For å aktivere cache i WordPress, kan du bare installere et plugin som aktiverer flere nivåer av cache, inkludert en cache på servernivå, en cache på sidenivå og en cache på nettlesernivå. Vårt anbefalte plugin for dette er WP-Rocket, men det er flere alternative valg som vi nevner i denne artikkelen som også vil få nettstedet til å lastes raskere.

Hvordan utnytter jeg nettleserbufring for tredjepartsskript?

Du kan ikke endre nettleserens cacheverdi for tredjepartsskripter som Facebook eller Google Analytics fordi disse er satt på servernivå og du ikke har noen kontroll over dem. Det beste alternativet, i dette tilfellet, er å bruke så få av disse skriptene som mulig

konklusjonen

Ovenfor har vi vist deg en rekke måter å implementere for å sikre at du er i stand til å utnytte caching i nettleseren og sørge for at innhold som lastes ned gjenbrukes om og om igjen. Forsikre deg om at du har implementert dette på nettstedet ditt, for å forhindre at feilen vises i verktøy som analyserer nettstedets hastighetsberegninger. 

Hvis du føler at dette er noe utenfor dine egne evner, vil vi anbefale at du lar disse tingene være i hendene på PRO-ene og installerer et plugin som WP Rocket for å sikre at du får maksimalt utbytte av dette og mange andre handlinger for å gjøre din nettstedet lastes raskere.

Besøk WP Rocket for å gjøre nettstedet ditt raskere i dag

om forfatteren

Forfatter: David Attardnettside: https://www.linkedin.com/in/dattard/E-post: david@collectiveray. Med

David har jobbet i eller rundt den elektroniske / digitale industrien de siste 18 årene. Han har lang erfaring innen programvare- og webdesignindustrien ved å bruke WordPress, Joomla og nisjer rundt dem. Som digital konsulent er hans fokus på å hjelpe bedrifter med å få et konkurransefortrinn ved å bruke en kombinasjon av deres nettside og digitale plattformer som er tilgjengelige i dag.