Hur man enkelt fixar varningen för caching i webbläsaren i WordPress

Om du ej utnyttjar webbläsarens cachelagring är din webbplats inte så snabb som den skulle kunna vara. Vi aktiverar cachelagring i webbläsare på alla våra webbplatser för att optimera WordPress prestanda.

Cachelagring i webbläsaren butiker vissa filer i dina besökares webbläsare så att de inte behöver hämtas igen vid senare besök, vilket förbättrar sidans laddningshastighet. Om du ej använder den här funktionen kan du se varningen ”Leverage browser caching” när du kör ett hastighetstest.

Den här artikeln przewodnikar dig genom några enkla steg för att poprawka ”Leverage browser caching”-varningen i WordPress. Genom att följa dessa tips kan du förbättra webbplatsens prestanda och erbjuda en smidigare upplevelse för dina användare.

Vad är caching i webbläsare i WordPress?

Browser caching är ett sätt att förbättra hastigheten på hämtar din WordPress website.

Normalt, när en page laddas, kommer alla filer att hämtas separat. Detta skapar flera requests mellan webbläsaren och din WordPress webbhotell server, vilket ökar webbsidans laddningstid.

När browser caching är aktiverad, lagrar din web browser en kopia av din page lokalt. Detta allow webbläsare att ladda vanliga filer gillar stylesheets, logotyper och images snabbare när användaren besöker en andra page på din site.

Detta minskar den totala belastningen på servern eftersom färre requests kommer att utföras till den faktiska servern, vilket förbättrar prestandaoptimering och användarupplevelse som ett resultat.

Var kommer du att se varningen ”Leverage Browser Caching”?

Varningen ”Leverage browser caching” innebär att du inte har aktiverat caching i webbläsaren eller att din caching är felaktigt inställd.

När du kör ett hastighetstest för en website med ett verktyg som GTmetrix eller Google PageSpeed Insights, får du en report som visar vad du kan fixa för att snabba upp WordPress.

Om din website för närvarande inte använder caching i webbläsaren kommer du att få en varning om att aktivera caching i webbläsaren.

Så här kan det se ut när du tittar på dina resultat från ett Page Speed Insights-verktyg.

Ibland får you en varning som säger att din ”efficient cache policy” inte fungerar.

Båda dessa varningar hänvisar till ett error med inställningen av caching i din webbläsare.

Om du ser varningen ”Leverage browser caching” betyder det att du måste aktivera och customize reglerna för caching för att snabba upp din site.

Med detta sagt, låt oss ta en titt på hur du enkelt fixar ”Leverage browser caching”-varningen i WordPress med hjälp av två olika metoder. Använd bara snabblänkarna under för att välja den metod du vill använda:

Metod 1: Fixa varningen ”Leverage Browser Caching” med WP Rocket

WP Rocket är det bästa pluginet för caching för WordPress på marknaden. Det är nybörjarvänligt och kan hjälpa dig att optimera din site för hastighet, all utan att känna till komplexa caching och hastighetstermer.

Alla rekommenderade Settings för caching kommer att snabba upp din WordPress blogg direkt från boxen.

För att fixa ”Leverage browser caching”-varningen med WP Rocket behöver du bara installera och aktivera pluginet.

Det var allt.

För mer details, you can see our guide on how to properly install and set up WP Rocket in WordPress.

WP Rocket aktiverar automatiskt caching i webbläsaren och ändrar din .htaccess-fil med rätt regler.

Metod 2: Fixa ”Leverage Browser Caching” -varning med hjälp av kod

Den andra metoden innebär att du lägger till kod i dina WordPress-filer. Om du inte har gjort det tidigare kan du läsa vår guide för nybörjare om hur du klistrar in snippor från webben i WordPress.

Den här metoden är inte lika nybörjarvänlig, så vänligen följ den bara om du vet exakt vad du gör. För de flesta företagare rekommenderar vi att du använder metod 1.

Med detta sagt, låt oss ta en titt på hur du fixar ”Leverage browser caching”-varningen genom att lägga till kod i WordPress.

Avgör om din website kör Apache eller NGINX

Först måste du ta reda på om din website använder Apache- eller NGINX-servrar.

För att göra detta öppnar du din website i en new tab eller ett nytt fönster. Högerklicka sedan och välj alternativet ”Inspektera”.

Klicka sedan på tabben ”Network” högst upp på sidan.

Du kan behöva uppdatera page för att resultaten ska kunna hämtas.

Efter det klickar du på ditt domain name i kolumnen ”Name”.

Den ska finnas högst upp på page.

Sedan, i sektionen ”Response Rubriker”, ser du ett objekt som heter ”server” där typen av server visas.

I det här fallet körs webbplatsen på en Apache-server.

Add to Cache-Control och Expires Rubriker i Apache

För att fixa varningen ’Leverage browser caching’ med en Apache server, kommer du att lägga till kod i din .htaccess-fil.

För att edit denna fil måste du ansluta till ditt WordPress webbhotell account med en FTP-klient eller din servers filhanteringsverktyg.

När du har anslutit dig kan du se din .htaccess-fil i din websites root folder.

Om du inte kan hitta den, oroa dig inte. Ibland kan den här filen vara dold. För mer detaljer, se vår guide om varför du inte kan hitta .htaccess-filen på din WordPress site.

Därefter måste du add to cache control och/eller löper ut headers för att aktivera caching i webbläsaren. Detta talar om för web browsern hur länge den ska lagra resurserna på din website innan de tas bort.

• Headern cache-control ger specifika detaljer till web browsern om hur caching ska göras.
• Headern löper ut aktiverar caching och talar om för web browsern hur länge den ska lagra specifika filer innan de tas bort.

Du kan lägga till följande kod i din .htaccess-fil för att lägga till rubriker som löper ut:

## EXPIRES HEADER CACHING ##
<IfModule mod_expires.c>
ExpiresActive On
ExpiresByType image/jpg "access 1 year"
ExpiresByType image/jpeg "access 1 year"
ExpiresByType image/gif "access 1 year"
ExpiresByType image/png "access 1 year"
ExpiresByType image/svg "access 1 year"
ExpiresByType text/css "access 1 month"
ExpiresByType application/pdf "access 1 month"
ExpiresByType application/javascript "access 1 month"
ExpiresByType application/x-javascript "access 1 month"
ExpiresByType application/x-shockwave-flash "access 1 month"
ExpiresByType image/x-icon "access 1 year"
ExpiresDefault "access 3 days"
</IfModule>
## EXPIRES HEADER CACHING ##

Den här koden anger olika datum för när cachen löper ut beroende på filtyp.

Följaktligen kan du add to följande kod för att aktivera cache control:

<filesMatch ".(ico|pdf|flv|jpg|jpeg|png|gif|svg|js|css|swf)$">
    Header set Cache-Control "max-age=96000, public"
</filesMatch>

Den här koden anger utgångstiden för när cachen måste uppdateras. I exemplet ovan löper cachen ut om 90 000 sekunder.

Glöm inte att save filen efter att du har editerat den. Efter det kommer web browsern att requesta new versioner av filerna.

Add to Cache-Control och Expires Rubriker i NginX

Om du använder en NGINX web server för att servera din WordPress site, kan du editera serverns konfigurationsfil för att fixa browser caching error.

Hur du redigerar och kommer åt den här filen beror på ditt webbhotell, så du kan kontakta din hosting provider om du behöver hjälp med att komma åt filen.

Följaktligen måste du lägga till följande kod för att add to löper ut headers:

location ~* \.(jpg|jpeg|gif|png|svg)$ {
  expires 365d;
}
 
location ~* \.(pdf|css|html|js|swf)$ {
  expires 3d;
}

Denna code type ställer in hur länge de olika filtyperna ska löpa ut. Notice that images are cached longer than HTML, CSS, JS, and other file types since images usually stay the same.

Följaktligen kan du lägga till följande kod för att add to cache-control headers:

location ~* \.(js|css|png|jpg|jpeg|gif|svg|ico)$ {
 expires 14d;
 add_header Cache-Control "public, no-transform";
}

Den här koden ställer in tiden för när cachen ska löpa ut. Den talar om för din server att filtyperna ovan inte kommer att ändras på 14 dagar.

Om du vill snabba upp WordPress ännu mer, se till att kontrollera vår guide om hur du ökar WordPress hastighet och prestanda.

Vi hoppas att den här artikeln hjälpte dig att lära dig hur du enkelt kan poprawka varningen ”Utnyttja webbläsarens cachning” i WordPress. Du kanske också vill se vår ultimata lista över vanliga fel i WordPress och hur du poprawkar dem och våra expertval av de snabbaste webbhotellen för WordPress för en snabb webbplats.

If you liked this article, then please subscribe to our YouTube Channel for WordPress video tutorials. You can also find us on Twitter and Facebook.