Poprawa szybkości sklepu poprzez cache w pliku .htaccess

Plik .htaccess to plik konfiguracyjny serwera WWW, który pozwala na zmianę ustawień serwera oraz na zarządzanie ruchem na stronie internetowej. Plik ten jest często stosowany do tworzenia przekierowań, ograniczenia dostępu do strony czy też do cache'owania plików. Plik .htaccess znajduje się w katalogu głównym sklepu internetowego. Cache'owanie plików w pliku .htaccess może pomóc w zwiększeniu szybkości działania sklepu internetowego, ponieważ pozwala na przechowywanie w pamięci podręcznej plików, które są często używane przez sklep (np. obrazy produktów, arkusze stylów CSS). Dzięki temu przy kolejnych odwiedzinach strony te pliki nie muszą być pobierane z serwera.

Jak edytować plik .htaccess na serwerze ?

Plik .htacess znajduje się w głównym katalogu w którym zainstalowany jest sklep (najczęściej jest to katalog o nazwie public_html - wszystko zależy od konfiguracji serwera na którym zainstalowany jest sklep). Plik .htaccess można edytować za pomocą dowolnego edytora tekstu, takiego jak Notatnik (Windows) czy darmowy Notepad++ (polecamy !).

Aby edytować plik .htaccess, należy:

• należy połączyć się z serwerem poprzez połączenie FTP używając do tego odpowiedniego programu (np. Total Commander lub FileZilla)
• przejść do katalogu w którym znajduje się plik .htaccess (katalog w którym znajdują się pliki i podkatalogi sklepu)
• na niektórych serwerach ten plik może być ukryty i nie będzie widoczny - pomóc może włączenie w programie FTP możliwości wyświetlania ukrytych plików
• otwórz plik za pomocą edytora tekstu
• wprowadź zmiany jakie planujesz dodać / zmienić w pliku
• zapisz plik

Pamiętaj, że niektóre ustawienia pliku .htaccess mogą wymagać odpowiednich uprawnień, aby były aktywne. Jeśli po wprowadzeniu zmian w pliku .htaccess strona nie działa poprawnie, możliwe jest, że wystąpił błąd w konfiguracji. W takim przypadku warto sprawdzić, czy wprowadzone zmiany są poprawne i czy nie ma literówek czy błędów składniowych. Jeśli problem nadal występuje, możliwe jest, że ustawienia pliku .htaccess są niezgodne z konfiguracją serwera lub że brakuje odpowiednich uprawnień. W takim przypadku warto skontaktować się z administratorem serwera lub z supportem technicznym dostawcy usług hostingowych.
 

Na czym polega i jak działa obsługa cache w pliku .htaccess ?

Obsługa cache w pliku .htaccess polega na ustawieniu odpowiednich nagłówków HTTP, które informują przeglądarkę, czy i jak długo ma ona przechowywać kopie zasobów w swojej pamięci podręcznej. Dzięki temu przeglądarka nie musi pobierać zasobów z serwera za każdym razem, gdy użytkownik odwiedza stronę, co może przyspieszyć jej wczytywanie.

Aby ustawić obsługę cache w pliku .htaccess, należy dodać odpowiednie instrukcje do pliku. Przykładowo, aby ustawić długość przechowywania kopii zasobów w pamięci podręcznej na 30 dni, można użyć następującej instrukcji:

<IfModule mod_headers.c>
  <FilesMatch "\.(ico|jpg|jpeg|png|gif|css|js)$">
    Header set Cache-Control "max-age=2592000"
  </FilesMatch>
</IfModule>

Ta instrukcja mówi przeglądarce, żeby przechowywała kopie plików z rozszerzeniami .ico, .jpg, .jpeg, .png, .gif, .css i .js w pamięci podręcznej przez 30 dni (2592000 sekund). Można również ustawić inne wartości dla różnych rodzajów plików lub użyć innych nagłówków HTTP, takich jak Expires, aby ustawić dokładną datę, do której pliki mają być przechowywane w pamięci podręcznej.

Pamiętaj, że aby zmiany w pliku .htaccess zaczęły działać, może być konieczne wykonanie odświeżenia pamięci podręcznej serwera lub przeglądarki.
 

Dodawanie obsługi cache do pliku .htaccess

Dodanie obsługi cache do pliku .htaccess polega na ustawieniu odpowiednich linijek kodu, które pozwalają na przechowywanie plików w pamięci podręcznej przeglądarki lub innych pośredników (np. serwerów proxy). Dzięki temu przy kolejnych odwiedzinach strony te pliki nie muszą być pobierane z serwera, co znacząco przyspiesza ładowanie strony. W dalszej części artykułu przedstawiamy jak powinien wyglądać kod, który trzeba dodać do sklepu w przypadku oprogramowania shopGold.

Do włączenia cache w pliku .htaccess są używane dwa rozwiązania o nazwach "Cache-Control" i "Expire Headers". Nagłówek Cache-Control i Expire Headers są używane do kontrolowania cache w przeglądarkach. Różnią się między sobą sposobem, w jaki są interpretowane przez różne przeglądarki.

Nagłówek Cache-Control jest używany do określania, jak długo plik może być przechowywany w cache oraz w jaki sposób może być on używany. Jest to nagłówek HTTP/1.1 i jest obsługiwany przez większość nowoczesnych przeglądarek (jest nowszym rozwiązaniem). Może zawierać różne opcje, takie jak max-age, public, private i must-revalidate, które określają, jak długo plik może być przechowywany w cache, czy może być on udostępniany przez serwery proxy, czy musi być sprawdzany pod kątem aktualności przed użyciem z cache.

Nagłówek Expire Headers jest używany do określania daty i godziny, do kiedy plik może być przechowywany w cache. Jest to nagłówek HTTP/1.0 i jest obsługiwany przez starsze przeglądarki, ale nie jest tak powszechnie używany jak Cache-Control (jest to starsze rozwiązanie cache). Nagłówek Expire Headers zawiera datę i godzinę w formacie UTC (Coordinated Universal Time), która określa, kiedy plik ma być usunięty z cache.

Stosowanie obu rodzajów jest zalecane gdyż zapewnia obsługę cache dla jak największej liczby przeglądarek.
 

Włączenie cache poprzez Cache-Control

Kod nr 1.

<ifModule mod_headers.c>
  <FilesMatch "\.(ico|jpe?g|png|gif|webp|swf|svg|woff2)$">
    Header set Cache-Control "max-age=2628000, public"
  </FilesMatch>
  <FilesMatch "\.(css)$">
    Header set Cache-Control "max-age=86400, public"
  </FilesMatch>
  <FilesMatch "\.(js)$">
    Header set Cache-Control "max-age=86400, private, must-revalidate"
  </FilesMatch>
  <FilesMatch "\.(x?html?|php)$">
    Header set Cache-Control "max-age=360, private, must-revalidate"
  </FilesMatch>
</ifModule>

Powyższy kod Cache-Control umożliwia ustawienie kilku różnych opcji kontroli cache:

• FilesMatch - określa jakich plików ma dotyczyć ustawienie cache w podanym kodzie
• "max-age" - określa, jak długo plik może być przechowywany w cache (podana wartość jest w sekundach) - np. minuta to max-age=60, miesiąc to max-age=2628000, a rok to max-age=31536000
• "public" oznacza, że plik może być przechowywany w cache zarówno przez przeglądarki użytkowników, jak i przez serwery proxy
• "private" oznacza, że plik może być przechowywany w cache tylko przez przeglądarki użytkowników, a nie przez serwery proxy
• "must-revalidate" oznacza, że przeglądarka lub serwer proxy musi sprawdzić, czy plik jest aktualny, zanim go użyje z cache

Te ustawienia są przykładem, i możesz je dostosować do własnych potrzeb. Możesz zmienić czas przez jaki cache ma być trzymane w pamięci podręcznej dla konkretnych formatów plików.
 

Włączenie cache poprzez Expire Headers

Kod nr 2.

<IfModule mod_expiers.c>
  ExpiresActive On
  ExpiresDefault "access plus 1 seconds"
  ExpiresByType image/x-icon "access plus 2628000 seconds"
  ExpiresByType image/jpeg "access plus 2628000 seconds"
  ExpiresByType image/png "access plus 2628000 seconds"
  ExpiresByType image/gif "access plus 2628000 seconds"
  ExpiresByType image/webp "access plus 2628000 seconds"
  ExpiresByType application/x-shockwave-flash "access plus 2628000 seconds"
  ExpiresByType text/css "access plus 86400 seconds"
  ExpiresByType text/javascript "access plus 86400 seconds"
  ExpiresByType application/javascript "access plus 86400 seconds"
  ExpiresByType application/x-javascript "access plus 86400 seconds"
  ExpiresByType text/html "access plus 360 seconds"
  ExpiresByType application/xhtml+xml "access plus 360 seconds"
</IfModule>  

Nagłówek Expire Headers określa datę i godzinę, do kiedy plik może być przechowywany w cache. Format daty i godziny jest podany w formacie UTC (Coordinated Universal Time).
 

Włączenie kompresji GZIP

Możesz dodatkowo włączyć kompresję GZIP dla strony internetowej poprzez dodanie odpowiednich poleceń do pliku .htaccess. Kompresja GZIP polega na skompresowaniu plików przed ich wysłaniem do przeglądarki, co pozwala na szybsze ładowanie strony. Ważne ! Przed dodaniem tego kodu trzeba sprawdzić czy Twój serwer nie ma domyślnie włączonej tej opcji - zapobiegnie to podwójnej niepotrzebnej kompresji.

Kod nr 3.

<IfModule mod_deflate.c>
  AddOutputFilterByType DEFLATE text/html text/plain text/css application/json
  AddOutputFilterByType DEFLATE application/javascript
  AddOutputFilterByType DEFLATE text/xml application/xml text/x-component
  AddOutputFilterByType DEFLATE application/xhtml+xml application/rss+xml application/atom+xml
  AddOutputFilterByType DEFLATE image/svg+xml application/vnd.ms-fontobject application/x-font-ttf font/opentype
</IfModule>

Uwaga: aby kompresja GZIP działała poprawnie, moduł Apache mod_deflate musi być zainstalowany i włączony na serwerze. Jeżeli nie wiesz czy taka opcja jest włączona na Twoim serwerze - zapytaj administratora hostingu.
 

Dodaj kod żeby przyspieszyć stronę

Jeżeli chcesz przyspieszyć szybkość wczytywania strony dodaj do swojego pliku .htaccess na serwerze wszystkie 3 podane powyżej kody. W przypadku kodu GZIP sprawdź najpierw czy domyślnie na serwerze nie jest już włączona kompresja.

Dlaczego oprogramowanie shopGold nie ma domyślnie dodanych tych kodów do pliku .htaccess ? Dlatego, że sklepy są instalowane na różnych hostingach i włączenie tej opcji jako domyślnej przy niektórych konfiguracjach serwerów może powodować brak działania sklepu i wyświetlania strony. Dlatego ten kod nie jest domyślnie wstawiony w oprogramowaniu sklepu.

Jeżeli dodasz ten kod do swojego pliku - sprawdź czy po jego dodaniu otworzy Ci się prawidłowo strona. Jeżeli np. zobaczysz błąd 500 - usuń kod, który dodałeś i skontaktuj się z administratorem Twojego serwera z pytaniem dlaczego taki błąd się pojawia.