Leverage browser caching joomla – A böngésző gyorsítótárazása

A böngésző gyorsítótárazása az egyik legegyszerűbb módszer a jelentős teljesítménynövekedés megszerzésére bármely webhelyen, függetlenül a CMS-től vagy a rendszertől, ezért győződjön meg róla, hogy használja. A böngésző gyorsítótárazás segít felgyorsítani webhelyét (Joomla vagy nem) a böngészőben tárolt erőforrások / fájlok használatával (ez más, mint a “Böngésző gyorsítótár használata” !). A konfiguráció teljes mértékben a .htaccess rendszerfájlban történik, a Joomla konfiguráción kívül.  Alapvetően az, amit csinálsz: a megadott fájltípusokhoz, például képekhez, CSS-hez vagy Javascript-hez határozz meg egy lejárati határidőt percekben / napokban / hétben. Mindaddig, amíg a lejárat nem telt el, az erőforrásokat nem tölti le újra, de a korábban letöltött verzió kerül felhasználásra.

Természetesen van egy kis kockázat, hogy az időközben megváltozott erőforrásokat nem fogják felvenni, de a legtöbb helyszínen ez nem jelent problémát. Megadhatja a lejárati értéket fájltípusonként, így a gyakran változó erőforrásoknál rövid határidőt állít be, míg a nem változó tartalomhoz (sokkal) hosszabb ideig állítja be. Általában a HTML-nek nagyon rövidnek kell lennie ahhoz, hogy frissített tartalmat jelenítsen meg, míg a javascript-fájlok aligha változnak, kivéve, ha azt célszerűen frissítik.

A lejárati fejlécek beállítása .htaccess-ben

A funkció aktiválásához optimalizálnia kell a .htaccess fájlt. A Joomla esetében meg kell győződnie arról, hogy átnevezte a htaccess.txt-t .htaccess-nek, és kapcsolja be az URL-újraírást a globális konfigurációban . Ha egy másik CMS-t (beleértve a WordPress-t is) használ, akkor általában a .htaccessfájlt megtalálja a webhelyének fő gyökér mappájában. A .htaccess fájlban először néhány szabályt állítunk be, amelyeket hamarosan elmagyarázok:

  • ETag : Tájékoztassa a böngészőt, hogy a kép már letöltött, és nem szabad újratölteni
  • A fejlécek lejárata: mint az ETag, de a fájltípusoknál pontosabban
  • AddOutputFilterByType DEFLATE : a hézagok eltávolítása ()

Az utolsó szabály valójában nem szabályozza az erőforrások gyorsítótárát, de a megadott fájltípusok esetében gondoskodik a tömörítésről. Szigorúan figyelembe véve, hogy nem tartozik a Leverage böngésző gyorsítótárazási fejezetébe, de lehet, hogy belefoglaljuk azt a .htaccess fájl frissítésébe.

Ezután meg fogjuk határozni a szabályokat ( fejlécek lejárata ). Számos módon megadhatja a szabályokat, attól függően, hogy milyen fájltípusokat használ a webhelyén, és mennyi idő lejárt. Egy egyszerű példa a következőre:

<IfModule mod_expires.c>
  FileETag MTime Size
  AddOutputFilterByType DEFLATE text/plain text/html text/xml text/css application/xml application/xhtml+xml application/rss+xml application/javascript application/x-javascript
  ExpiresActive On
  ExpiresDefault "access plus 1 seconds"
  ExpiresByType text/html "access plus 600 seconds"
  ExpiresByType application/xhtml+xml "access plus 600 seconds"
  ExpiresByType text/css "access plus 1 month"
  ExpiresByType text/javascript "access plus 1 month "
  ExpiresByType application/javascript "access plus 1 month"
  ExpiresByType application/x-javascript "access plus 1 month"
  ExpiresByType image/x-icon "access plus 1 year"
  ExpiresByType image/jpeg "access plus 1 year"
  ExpiresByType image/png "access plus 1 year"
  ExpiresByType image/gif "access plus 1 year"
</IfModule>

Minden fájltípushoz adjon meg egy lejárati fejlécet, hogy megadja, hogy mennyi ideig szeretné újra használni azt. Ebben az egyszerű példában láthatjuk, hogy a Javascript és a CSS 1 hónapig tart, és a képek egy évig. Az Ön webhelyétől függ, hogy ezek a szabályok megfelelnek-e Önnek. Ha gyakran változik képe, talán 1 hónapos élettartamra van szüksége egy év helyett stb.

Előfordulhat, hogy tovább kell fejlesztenie a kódot, és hozzá kell adnia a lejárati fejléceket más, használt fájltípusokhoz, például .mpeg , .woff stb., Vagy a lejárati időre, ha nem felel meg az Ön igényeinek.

Ne feledje, hogy a kiszolgálónak támogatnia kell az Apache mod_expires funkcióját. A biztonság érdekében a kódot egy if-utasításba csomagoljuk. Ha a gazdagép nem támogatja a mod_expires szolgáltatást , webhelye összeomlik. Saját PC-n lévő saját helyi környezetem is nem támogatja azt, így nem segíthetem abban, hogy a helyszínt tesztelési célokra helyreállítsam. Az if-utasítás helyett a kód egyszerűen nem fog végrehajtani, ha nincs támogatás.

A .htaccess fájl fejlettebb példáját (beleértve a sok biztonsági szabályt is) lásd a docs.joomla.orgoldalon.

Mielőtt bármilyen módosítást elvégezne, először készítsen biztonsági másolatot a .htaccess fájlról, és győződjön meg róla, hogy alaposan teszteli a változást. Ellenőrizze az előtt és után, hogy a változás befolyásolta-e a Joomla weboldalának sebességét .

Kerülje a böngésző gyorsítótárazását a fejlesztésben

Ne feledje, hogy webhelyének fejlesztésekor nem szeretné, hogy az erőforrások gyorsítótárba kerüljenek, mivel a CSS, a Javascript és a képek módosításai nem tükröződnek. Ezért csak akkor alkalmazza a kódot, ha a webhelyet az élő környezetbe teszi.

Egy példa (másolható)

 

<IfModule mod_expires.c>
ExpiresActive On

# Images
ExpiresByType image/jpeg "access plus 1 year"
ExpiresByType image/gif "access plus 1 year"
ExpiresByType image/png "access plus 1 year"
ExpiresByType image/webp "access plus 1 year"
ExpiresByType image/svg+xml "access plus 1 year"
ExpiresByType image/x-icon "access plus 1 year"

# Video
ExpiresByType video/mp4 "access plus 1 year"
ExpiresByType video/mpeg "access plus 1 year"

# CSS, JavaScript
ExpiresByType text/css "access plus 1 month"
ExpiresByType text/javascript "access plus 1 month"
ExpiresByType application/javascript "access plus 1 month"

# Others
ExpiresByType application/pdf "access plus 1 month"
ExpiresByType application/x-shockwave-flash "access plus 1 month"

# Fonts
# Add correct content-type for fonts
AddType application/vnd.ms-fontobject .eot
AddType application/x-font-ttf .ttf
AddType application/x-font-opentype .otf
AddType application/x-font-woff .woff
AddType image/svg+xml .svg

# Add a far future Expires header for fonts
ExpiresByType application/vnd.ms-fontobject "access plus 1 year"
ExpiresByType application/x-font-ttf "access plus 1 year"
ExpiresByType application/x-font-opentype "access plus 1 year"
ExpiresByType application/x-font-woff "access plus 1 year"
ExpiresByType image/svg+xml "access plus 1 year"

</IfModule>

Hozzászólás