Sitepagina's cachen met .htaccess - Cache

afdrukken · Probeer het eens: 9мин · Автор: · Опубликовано · Обновлено

reproducerenLuister naar artikel

Caching van statische bestanden en pagina's.

Sitepagina's cachen met .htaccess. Een even belangrijke fase van technische optimalisatie, als schakel gzip-compressie in of CSS-verkleining. Door Cache-pagina's en -bestanden in te schakelen, kunt u de snelheid van de site aanzienlijk verhogen. En soms ook de belasting van de server verminderen. Dankzij eenvoudige manipulaties begint uw site te vliegen.

In dit artikel zullen we het hebben over alle aspecten van dit onderwerp. Wat is het belang van de cache voor de site en de toepassing ervan. Ik zal voorbeelden beschrijven die je in de praktijk kunt toepassen. Bovendien zal er een korte bespreking zijn van enkele redelijk goede Cache-plug-ins voor WordPress.

Wat is een sitecache - hoe beïnvloedt caching een site

Simpel gezegd, caching - dit is het opslaan van informatie over de site van de gebruiker in de browser. Zo wordt de hoofdbelasting van de server verminderd. Een aanzienlijk deel van de site hoeft niet te worden geladen, aangezien het opgeslagen deel wordt geladen door de browser van de gebruiker. Dit is een uiterst effectieve methode om het laden van de site te versnellen.

Cache of cache of Cache is een tussenliggend klembord met snelle toegang. Het bewaren en bevatten van informatie die vaak wordt opgevraagd. Toegang tot gegevens in de cache is sneller dan vanaf langzamere geheugenbronnen. Maar er is een geheugenlimiet. In gewone taal Cache is een kort geheugen.

Tegelijkertijd schaadt caching de gebruiker niet. Maar het verbetert de weergave van uw project in zijn browser. Hoe gebeurde dit! Wanneer de gebruiker de site bezoekt. Het laden gaat iets langzamer dan zou moeten. Dit komt doordat de browser op dit moment een kopie van de site opslaat. Dit geldt in sterkere mate voor:

  1. naar logo's;
  2. kleine afbeeldingen;
  3. css-bestanden;
  4. algemene paginastructuur.

Een deel van de site bevindt zich dus constant in het geheugen (cache) van de browser van de gebruiker. Hierdoor krijgt de bezoeker bij het herladen van de site de hoogst mogelijke reactiesnelheid. De browser haalt op dit moment enkele elementen uit zijn geheugen. En de site hoeft geen grote hoeveelheid informatie opnieuw te verzenden.

Wanneer de site cache heeft ingeschakeld en geconfigureerd. Een bepaald deel ervan wordt gedurende de vereiste periode bewaard in de lokale cache van de browser van de bezoeker. Welke webpagina's veel sneller laden bij herhaalde bezoeken.

Sitecaching inschakelen en configureren

Het is helemaal niet moeilijk om dit te doen. We blijven werken met het htaccess-bestand, dat de regels voor de server vastlegt. Hoe ermee te werken, heb ik in veel artikelen beschreven. Dus ik kom meteen ter zake. Volgens de standaard wordt caching ingesteld voor de benodigde bestanden en voor een bepaalde periode. Na het verstrijken van de tijd die is toegewezen voor het opslaan van het bestand, wordt de huidige versie opnieuw gedownload van de server. Hiervoor heb je nodig:

  • Maak een constructie van het type FilesMatch. Daarin specificeren we de benodigde bestandsextensies voor caching.
  • Vervolgens specificeren we de Cache-Control header met de max-age variabele. Hier is Cache-Control de serverresponsheader. Max-leeftijd is een variabele die de opslagtijd van het bestand in seconden specificeert.

Een typische lijst met extensies die worden gebruikt in de FilesMatch-constructie:

(ico|pdf|flv|jpg|jpeg|png|gif|webp|js|css|swf|x-html|css|xml|js|woff|woff2|ttf|svg|eot)(\.gz)

De bestanden die u niet in de cache wilt plaatsen, hoeven niet te worden opgenomen in de lijst van de FilesMatch-constructie.

Codevoorbeeld Headerset Cache-Control

# cachebeheer

# 30 dagen

Headerset Cache-Control “max-age=2592000, openbaar”

# 30 dagen

Headerset Cache-Control “max-age=2592000, openbaar”

# 2 dagen

Header set Cache-Control "max-age=172800, public, must-revalidate"

Waarde -#- opmerking! Zoals u kunt zien, geven de opmerkingen de voorwaarden aan waarvoor de bestanden worden opgeslagen. Er is ook een optie om geforceerde cache uit te schakelen. Deze optie is geschikt voor dynamische bestanden. Meer gerelateerd aan scripts en verschillende scenario's.

Een voorbeeld van de constructie "FilesMatch" die geforceerde caching uitschakelt


Header unset Cache-Control

Zoals je kunt zien, zijn er geen deadlines. Daarom worden deze bestandsextensies niet in de cache opgeslagen. In dit ontwerp kunt u uw bestandsextensies toevoegen.

Er is ook een andere manier om Cache te beheren - die door veel plug-ins op WordPrees wordt gebruikt. Bij deze methode gebruiken we de module mod_expires. Deze module heeft de mogelijkheid om HTTP-antwoordheaders aan de serverzijde te beheren. Hier kan de belangrijkste tijd voor het opslaan van gegevens in de cache door u worden ingesteld.

Het heeft verschillende instellingen voor de duur van gegevensopslag:

  1. op toegangstijd van de klant;
  2. of door de laatste wijziging van het bestand;
  3. tijd instelling;

Voorbeeld van een eenvoudige cachecode

# verloopt headers - 2678400s = 31 dagen

Verloopt Actief op
ExpiresDefault "toegang plus 1 seconden"
ExpiresByType text/html “toegang plus 7200 seconden”
ExpiresByType afbeelding/gif "toegang plus 2678400 seconden"
ExpiresByType image/jpeg "toegang plus 2678400 seconden"
ExpiresByType image/png "toegang plus 2678400 seconden"
ExpiresByType tekst/css "toegang plus 518400 seconden"
ExpiresByType tekst/javascript "toegang plus 2678400 seconden"
ExpiresByType application/x-javascript "toegang plus 2678400 seconden"

Een serieuzere use-case voor Cache

Verloopt Actief op
ExpiresByType tekst/css A31536000
ExpiresByType tekst/x-component A31536000
ExpiresByType applicatie/x-javascript A31536000
ExpiresByType-toepassing/javascript A31536000
ExpiresByType tekst/javascript A31536000
ExpiresByType tekst/x-js A31536000
ExpiresByType tekst/html A3600
ExpiresByType tekst/richtext A3600
ExpiresByType afbeelding/svg+xml A3600
ExpiresByType tekst/gewone A3600
ExpiresByType tekst/xsd A3600
ExpiresByType tekst/xsl A3600
ExpiresByType tekst/xml A3600
ExpiresByType video/asf A31536000
ExpiresByType video/avi A31536000
ExpiresByType-afbeelding/bmp A31536000
ExpiresByType toepassing/java A31536000
ExpiresByType video/divx A31536000
ExpiresByType-toepassing/msword A31536000
ExpiresByType-toepassing/vnd.ms-fontobject A31536000
ExpiresByType applicatie/x-msdownload A31536000
ExpiresByType afbeelding/gif A31536000
ExpiresByType applicatie/x-gzip A31536000
ExpiresByType afbeelding/x-pictogram A31536000
ExpiresByType afbeelding/jpeg A31536000
ExpiresByType afbeelding/webp A31536000
ExpiresByType-toepassing/json A31536000
ExpiresByType-toepassing/vnd.ms-access A31536000
ExpiresByType audio/midi A31536000
ExpiresByType video/quicktime A31536000
ExpiresByType audio/mpeg A31536000
ExpiresByType video/mp4 A31536000
ExpiresByType video/mpeg A31536000
ExpiresByType-toepassing/vnd.ms-project A31536000
ExpiresByType applicatie/x-font-otf A31536000
ExpiresByType-toepassing/vnd.ms-opentype A31536000
ExpiresByType toepassing/vnd.oasis.opendocument.database A31536000
ExpiresByType application/vnd.oasis.opendocument.chart A31536000
ExpiresByType application/vnd.oasis.opendocument.formula A31536000
ExpiresByType toepassing/vnd.oasis.opendocument.graphics A31536000
ExpiresByType application/vnd.oasis.opendocument.presentation A31536000
ExpiresByType application/vnd.oasis.opendocument.spreadsheet A31536000
ExpiresByType toepassing/vnd.oasis.opendocument.text A31536000
ExpiresByType audio/ogg A31536000
ExpiresByType applicatie/pdf A31536000
ExpiresByType afbeelding/png A31536000
ExpiresByType-toepassing/vnd.ms-powerpoint A31536000
ExpiresByType audio/x-realaudio A31536000
ExpiresByType afbeelding/svg+xml A31536000
ExpiresByType application/x-shockwave-flash A31536000
ExpiresByType applicatie/x-tar A31536000
ExpiresByType afbeelding/tiff A31536000
ExpiresByType application/x-font-ttf A31536000
ExpiresByType-toepassing/vnd.ms-opentype A31536000
ExpiresByType audio/wav A31536000
ExpiresByType audio/wma A31536000
ExpiresByType-toepassing/vnd.ms-write A31536000
ExpiresByType applicatie/font-woff A31536000
ExpiresByType toepassing/font-woff2 A31536000
ExpiresByType-toepassing/vnd.ms-excel A31536000
ExpiresByType applicatie/zip A31536000

Zoals we kunnen zien, wordt hier een groot aantal extensies beïnvloed. Met dezelfde houdbaarheid.

Caching in de browser aan de kant van de gebruiker voor 3 - 7 dagen of voor een jaar

Hier wordt het grootste deel van de bestandsextensies een jaar bewaard. Dit is in grotere mate nuttig voor afbeeldingen, omdat ik denk dat maar weinig mensen ze veranderen. Zo worden ze gedurende het jaar in de browser van de bezoeker geladen.

# browsercaching aan gebruikerszijde

Verloopt Actief op
VerlooptStandaard "toegang 7 dagen"
ExpiresByType applicatie/javascript “toegang plus 1 jaar”
ExpiresByType tekst/javascript “toegang plus 1 jaar”
ExpiresByType tekst/css “toegang plus 1 jaar”
ExpiresByType text/html “toegang plus 7 dagen”
ExpiresByType text/x-javascript “toegang 1 jaar”
ExpiresByType afbeelding/gif "toegang plus 1 jaar"
ExpiresByType image/jpeg "toegang plus 1 jaar"
ExpiresByType image/png “toegang plus 1 jaar”
ExpiresByType image/jpg “toegang plus 1 jaar”
ExpiresByType afbeelding/x-icoon “toegang 1 jaar”
ExpiresByType application/x-shockwave-flash "toegang 1 jaar"
ExpiresByType js "toegang 3 dagen"

Content caching (Flash, CSS, JS, HTML, XML) en afbeeldingen

In dit voorbeeld gebruiken we de cache alleen voor bepaalde bestanden. En voor een kortere periode.

Verloopt Actief op
# afbeeldingscache
ExpiresByType afbeelding/x-pictogram "toegang plus 2592000 seconden"
ExpiresByType image/jpeg "toegang plus 2592000 seconden"
ExpiresByType image/png "toegang plus 2592000 seconden"
ExpiresByType afbeelding/gif "toegang plus 2592000 seconden"
# Inhoudcache (Flash, CSS, JS, HTML, XML)
ExpiresByType application/x-shockwave-flash "toegang plus 2592000 seconden"
ExpiresByType tekst/css "toegang plus 604800 seconden"
ExpiresByType tekst/javascript "toegang plus 2592000 seconden"
ExpiresByType applicatie/javascript "toegang plus 2592000 seconden"
ExpiresByType application/x-javascript "toegang plus 2592000 seconden"
ExpiresByType text/html “toegang plus 600 seconden”
ExpiresByType application/xhtml+xml "toegang plus 600 seconden"

Het instellen van caching van pagina's en sitebestanden is niet zo moeilijk. Het belangrijkste is om de juiste strategie te kiezen. Alle bovenstaande voorbeelden kunt u naar eigen goeddunken gebruiken. Test de strategieën en kies de juiste codeoptie. Hieronder zal ik het hebben over enkele Cache-plug-ins voor WordPress.

Caching instellen met WordPress-plug-ins

Voor degenen die het CMS gebruiken, heeft WordPress een enorme verscheidenheid aan cache-plug-ins. Ze hebben allemaal een complete oplossing en automatische configuratie. Er zouden geen bijzondere problemen moeten zijn bij het gebruik van dergelijke plug-ins. Nadat u zo'n plug-in hebt geïnstalleerd, hoeft u alleen maar de instellingen toe te passen die u nodig hebt. De plug-in slaat ze automatisch op in het htaccess-bestand.

WP snelste cache

WP Fastest Cache Premium Fastest Cache-plug-in.

Een populaire en redelijk krachtige caching-plug-in voor WP. Het heeft een breed scala aan instellingen, waaronder HTML-optimalisatie, CSS en Js. Zelfs een beginnende gebruiker kan het uitzoeken.

WP SuperCache

WP Super Cache is een plug-in om het laden van pagina's te versnellen.

Zeer populaire plug-in! Uitstekende functionaliteit en handige instellingen. Geschikt voor het cachen van een groot aantal verschillende objecten. Het instellen van de plug-in is heel eenvoudig.

W3 Totale cache

De beste plug-in voor WordPress-caching is W3 Total Cache.

Krachtige oplossing voor grote sites. De meest populaire plug-in in zijn soort. Er is een grote verscheidenheid aan instellingen en functionaliteit. U moet het met zorg configureren, omdat dit kritieke fouten kan veroorzaken. Er is een mogelijkheid van conflicten met andere plug-ins of thema's. Maar qua functionaliteit een hele goede en krachtige plugin.

Dit zijn de belangrijkste en meest populaire cache-plug-ins die ik zelf heb gebruikt. U kunt elk kiezen, afhankelijk van uw voorkeuren.

Eindelijk

In dit artikel heb ik geprobeerd het onderwerp caching zoveel mogelijk te behandelen. Specifieke voorbeelden die kunnen worden gebruikt, afhankelijk van uw kenmerken. Het instellen van caching met deze handleiding gaat als een uurwerk voor je. Ik hoop dat dit artikel nog lang relevant zal zijn. Ik dank u voor uw aandacht, maar ik neem geen afscheid. Tot ziens in de volgende artikelen.

Bedankt voor het lezen Nicola Top

Hoe nuttig is de post?

Klik op de smiley om te beoordelen!

gemiddelde score 4.9 / 5. Aantal beoordelingen: 25

Er zijn nog geen beoordelingen. Beoordeel eerst.

Читайте также:

Добавить комментарий

Het e-mailadres wordt niet gepubliceerd. Обязательные поля помечены *

5 × drie =