Cache przeglądarki, zwany również jako Leverage Browser Cache jest opcja, którą można uruchomić na serwerach Apache, nginx – co za tym idzie na wielu hostingach jak home.pl, linuxpl.com, ovh.pl, nazwa.pl i innych. Uruchomienie komend pozwala na zaoszczędzenie transferu (bandwidth) oraz na skrócenie czasu wczytywania się podstron twojej witryny użytkownikom.
Przeglądarka internetowa, wchodząc na stronę www otrzymuje informacje od serwera dotyczące tego, jak ma zachować się w stosunku do plików znajdujących się na serwerze – w tym wypadku to jakie formaty plików mają być “zapisane” na dysku lokalnym i na jak długi czas.
Powoduje to że kolejne wejście na stronę, bądź wczytanie grafik. Wczytywane są bezpośrednio z dysku internauty. Tym samym minimalizują, nawet do 95% transfer i obciążenie serwera WWW, na której znajduję się strona internetowa.
Jak działa pamięć podręczna przeglądarki na stronie www?
Przykład w formie .gifu (Google Chrome)
Warto zwrócić uwagę na liczbę zapytań do serwera a ilość pobranych danych (800 kB vs 5 kB)
Co należy posiadać by móc włączyć – leverage browser cache?
- dostęp do serwera SSH,
- lub dostęp do FTP i pliku .htaccess,
- zainstalowany i włączony moduł serwerowy (mod_expires w przypadku serwerów apache).
Jak aktywować pamięć podręczną przeglądarki na swojej stronie www?
W pliku .htaccess w domyślnym katalogu (katalogu gdzie znajduję się index.php) należy wstawić komendy serwerowe.
# Uruchamiamy moduł expires <IfModule mod_expires.c> ExpiresActive on #Opcja automatycznie ustawia na wszystkich plikach cache 1 miesiąca ExpiresDefault "access plus 1 month" #Opcje umożliwiają w zależności od pliku (css, js, html) ustawienie dowolnej daty. #Obrazki 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 application/x-shockwave-flash "access plus 1 month" # Cache ikonek i plików statycznych html ExpiresByType image/ico "access plus 1 month" ExpiresByType image/x-icon "access plus 1 month" ExpiresByType text/html "access plus 600 seconds" #CSS / JS ExpiresByType text/css "access plus 1 month" ExpiresByType text/javascript "access plus 1 month" ExpiresByType application/javascript "access plus 1 month" </IfModule>
Niektóre hostingi posiadają specjalnie przygotowane pliki konfiguracyjne serwerów – powyższe komendy nie zadziałają np. home.pl
Ustawienie leverage browser cache (pamięć podręczna) na serwerze home.pl
Na serwerach home.pl w pliku .htaccess należy wprowadzić następujące składnie komend:
#Rodzaj pliku - oznaczenie M oznacza sekundy w przykładzie - miesiąc. :Location *.(jpg|png|css|js|gif) Expires M2592000 :Location
Jak sprawdzić czy pamięć podręczna działa prawidłowo?
W następujący sposób:
- Sprawdzenie poprzez konsole developerską przeglądarki (wzór na gifie z początku tekstu),
- Sprawdzenie poprzez narzędzia mierzące optymalizacje prędkości strony (gtmetrix.com, page speed google),
- Sprawdzenie poprzez http header (możliwe poprzez konsole deweloperską bądź np. narzędziem curl).
Przykład
curl -I -L https://wp.pl
W rezultacie otrzymamy
HTTP/2 200 date: Mon, 21 May 2018 19:03:38 GMT content-type: text/html; charset=UTF-8 set-cookie: __cfduid=d9c8052f337ee9edccacd85f8db6c7ac91526929418; expires=Tue, 21-May-19 19:03:38 GMT; path=/; domain=.wojciechpietrzak.com.pl; HttpOnly; Secure vary: Accept-Encoding x-mod-pagespeed: 1.13.35.2-0 cache-control: public, max-age=2678400 cf-cache-status: HIT expires: Thu, 21 Jun 2018 19:03:38 GMT strict-transport-security: max-age=0 x-content-type-options: nosniff expect-ct: max-age=604800, report-uri="https://report-uri.cloudflare.com/cdn-cgi/beacon/expect-ct" server: cloudflare cf-ray: 41e94dde9ab34064-HAM
