Gyorsítótárazás a web teljesítmény-optimalizálásában: Stratégiák és előnyök

A gyorsítótárak típusai

Számos típusú gyorsítótár létezik egy webes környezetben:

• Böngésző gyorsítótár: Erőforrásokat (például HTML, CSS, JavaScript, képek stb.) tárol a felhasználó eszközén, hogy ugyanazon weboldal későbbi látogatásai gyorsabban betöltődjenek.
• CDN gyorsítótár: A Content Delivery Networks (CDN-ek) a statikus tartalom másolatait földrajzilag elosztott helyeken tárolják gyorsítótárban, hogy a tartalmat gyorsabban szállítsák a felhasználókhoz a tartózkodási helyük alapján.
• Webszerver gyorsítótár: Erőforrásokat tárol a szerver oldalon, ami csökkenti az erőforrások újragenerálásának vagy adatbázisból történő lekérésének szükségességét minden alkalommal, amikor kérést küldenek.
• Alkalmazás gyorsítótár: A gyorsítótárazás rétege az alkalmazáson belül, amely jellemzően adatbázisból vagy API-ból lekérdezett adatokat tárol.
• Adatbázis gyorsítótár: Gyakran olyan megoldásokon keresztül valósítják meg, mint a Redis vagy a Memcached, ezek a gyorsítótárak a gyakran elért lekérdezéseket és adatokat tárolják az adatbázis terhelésének csökkentése érdekében.
• Memória gyorsítótár: Adatokat tárol a memóriában, például a RAM-ban, rendkívül gyors hozzáférési idők elérése érdekében.

Webszerver és weboldal gyorsítótárazás

Ennek a cikknek a középpontjában a webszerver és a weboldal gyorsítótárazása áll. Ezek a technikák elsősorban fájlok másolatainak a szerveren történő tárolását foglalják magukban, és ezeket szolgáltatják a felhasználói kérésekre válaszul anélkül, hogy azokat ismételten újra kellene generálni.

A webszerver gyorsítótárazása a közvetlenül a szerveren megvalósított technikákat foglalja magában, míg a weboldal gyorsítótárazása tartalmazhat böngészőoldali technikákat, például a HTTP gyorsítótárazást, ahol a szerver utasítja az ügyfelet (böngészőt), hogy helyben gyorsítótárazza az erőforrásokat.

Cache-Control fejléc

A Cache-Control fejléc az egyik legfontosabb fejléc annak szabályozására, hogy a böngésző vagy egy köztes gyorsítótárazási mechanizmus (például CDN vagy proxy) hogyan, mit és mennyi ideig gyorsítótárazzon egy erőforrást.

Cache-Control: max-age=3600, public

A fenti példa azt mondja a böngészőnek vagy a köztes gyorsítótáraknak, hogy 3600 másodpercig (1 óráig) gyorsítótárazzák az erőforrást. A public direktíva azt jelzi, hogy az erőforrás gyorsítótárazható bármely gyorsítótárazási réteg által, beleértve a megosztott gyorsítótárakat (pl. CDN-ek).

Gyakori Cache-Control direktívák a következők:

• no-store: Nincs gyorsítótárazás engedélyezve; minden kérésnek le kell kérnie az erőforrást a szerverről.
• no-cache: Az ügyfélnek újra kell validálnia a szerverrel, mielőtt kiszolgálna egy gyorsítótárazott másolatot.
• max-age: Meghatározza a maximális időtartamot (másodpercekben), ameddig egy erőforrás gyorsítótárazható, mielőtt elavultnak minősülne.
• private: Azt jelzi, hogy az erőforrás egyetlen felhasználóra jellemző, és nem szabad megosztott gyorsítótárak által gyorsítótárazni.
• public: Az erőforrás bármely gyorsítótár által gyorsítótárazható, beleértve a megosztott gyorsítótárakat is.

Expires fejléc

Az Expires fejléc egy konkrét dátumot és időpontot ad meg, amely után az erőforrás elavultnak minősül. Ellentétben a Cache-Control-lal, amely relatív idővel foglalkozik, az Expires abszolút idővel foglalkozik.

Expires: Wed, 21 Oct 2023 07:28:00 GMT

Azonban a Cache-Control nagyrészt felváltotta az Expires-t a modern webfejlesztésben, mert részletesebb vezérlést kínál.

ETag fejléc

Az ETag (Entity Tag) fejlécet a gyorsítótár validálására használják. Egy erőforrás adott verziójához egyedi azonosítót biztosít. Amikor az ügyfél egy gyorsítótárazott erőforrást kérdez le, elküldi az ETag értéket az If-None-Match fejlécben. A szerver ezután ellenőrzi, hogy az ETag megfelel-e az erőforrás aktuális verziójának. Ha igen, a szerver egy 304 Not Modified állapotkóddal válaszol, ami azt jelenti, hogy a gyorsítótárazott verzió még mindig érvényes.

ETag: "34a64df551429fcc55e4d42a148795d9f25f89d4"

Last-Modified fejléc

A Last-Modified fejléc azt az utolsó időpontot adja meg, amikor az erőforrást módosították. Az ETag-hoz hasonlóan ez lehetővé teszi az ügyfelek számára, hogy validálják az erőforrás gyorsítótárazott másolatát egy If-Modified-Since fejléccel küldött kérés elküldésével. Ha az erőforrás azóta nem változott meg, a szerver egy 304 Not Modified állapotkóddal válaszol.

Last-Modified: Tue, 15 Nov 2023 12:45:26 GMT

Pragma fejléc

A Pragma fejléc egy régebbi HTTP/1.0 fejléc, amelyet leginkább a visszamenőleges kompatibilitás érdekében használnak. A Pragma: no-cache hasonló a Cache-Control: no-cache-hez, arra utasítva az ügyfeleket, hogy ne gyorsítótárazzák az erőforrást.

Pragma: no-cache

Vary fejléc

A Vary fejlécet akkor használják, ha a válasz bizonyos kérésfejlécek alapján eltérhet. Például, ha egy weboldal eltérő tartalmat szolgáltat az Accept-Encoding fejléc alapján (függetlenül attól, hogy az ügyfél el tudja-e fogadni a tömörített tartalmat vagy sem), a Vary fejléc biztosítja, hogy a gyorsítótár tiszteletben tartsa ezeket a különbségeket.

Vary: Accept-Encoding

1. lépés: Apache gyorsítótárazási modulok engedélyezése

A gyorsítótárazás Apache-ban történő használatához először engedélyeznie kell a szükséges modulokat. Ide tartozik a mod_cache, a mod_cache_disk és a mod_expires.

Debian-alapú rendszereken (például Ubuntu) ezeket a modulokat a következők futtatásával engedélyezheti:

sudo a2enmod cache
sudo a2enmod cache_disk
sudo a2enmod expires
sudo systemctl restart apache2

2. lépés: Alapvető gyorsítótár konfiguráció

A gyorsítótárazást konfigurálhatja az Apache konfigurációs fájljában (/etc/apache2/apache2.conf vagy egy virtuális hoszt konfigurációjában).

Íme egy egyszerű konfiguráció a fájlok 1 órás gyorsítótárazásához:

<IfModule mod_cache.c>
  CacheQuickHandler off
  CacheLock on
  CacheLockPath /tmp/mod_cache-lock
  CacheLockMaxAge 5
  CacheIgnoreHeaders Set-Cookie
</IfModule>

<IfModule mod_cache_disk.c>
  CacheRoot /var/cache/apache2/mod_cache_disk
  CacheEnable disk /
  CacheDirLevels 2
  CacheDirLength 1
</IfModule>

<FilesMatch "\.(html|css|js|png|jpg)$">
  ExpiresActive On
  ExpiresDefault "access plus 1 hour"
</FilesMatch>

Ebben a konfigurációban:

• Engedélyezzük a lemezes gyorsítótárazást, és megadjuk a gyorsítótár helyét a /var/cache/apache2/mod_cache_disk mappában.
• Az ExpiresActive segítségével megadjuk, hogy az olyan fájlokat, mint a HTML, CSS, JavaScript és képek, 1 órára kell gyorsítótárazni.

3. lépés: A gyorsítótárazás finomhangolása

A gyorsítótárazást tovább finomhangolhatja további fejlécekkel, specifikus gyorsítótár-vezérlési beállításokkal a különböző fájltípusokhoz vagy dinamikus tartalom kizárásával.

<FilesMatch "\.(html)$">
  Header set Cache-Control "no-cache, no-store, must-revalidate"
</FilesMatch>

A fenti példa megakadályozza a HTML-fájlok gyorsítótárazását, ami akkor lehet szükséges, ha a HTML-fájlok gyakran változnak, míg más eszközök gyorsítótárazva vannak.

4. lépés: Továbbfejlesztett gyorsítótár-vezérlés a mod_expires segítségével

A mod_expires modul lehetővé teszi, hogy konkrét lejárati időket állítson be a különböző tartalomtípusokhoz a MIME-típusok alapján. Ez részletesebb vezérlést biztosít azzal kapcsolatban, hogy mennyi ideig kell gyorsítótárazni a különböző eszközöket.

Íme egy átfogó konfiguráció a mod_expires használatával:

<IfModule mod_expires.c>
  # Engedélyezze a modult.
  ExpiresActive on

  # Állítsa be az alapértelmezett lejárati időket.
  ExpiresDefault "access plus 2 days"

  # Definiáljon lejárati szabályokat specifikus MIME-típusokhoz.
  ExpiresByType image/jpg "access plus 1 month"
  ExpiresByType image/gif "access plus 1 month"
  ExpiresByType image/jpeg "access plus 1 month"
  ExpiresByType image/png "access plus 1 month"
  ExpiresByType text/javascript "access plus 1 month"
  ExpiresByType application/javascript "access plus 1 month"
  ExpiresByType application/x-shockwave-flash "access plus 1 month"
  ExpiresByType text/css "now plus 1 month"
  ExpiresByType image/ico "access plus 1 month"
  ExpiresByType image/x-icon "access plus 1 month"
  ExpiresByType text/html "access plus 600 seconds"
</IfModule>

Ebben a példában:

• Alapértelmezett lejárati idő: Minden nem specifikusan definiált erőforrás 2 nap múlva jár le.
• Specifikus MIME-típusok: A képek, a JavaScript és a CSS fájlok 1 hónapig gyorsítótárazva vannak. A HTML-fájlok azonban csak 600 másodpercig (10 percig) vannak gyorsítótárazva. Ez akkor hasznos, ha gyakori frissítéseket szeretne a HTML-tartalomban, miközben a statikus eszközöket hosszabb ideig gyorsítótárazza.