Cachowanie stron internetowych, czyli jak przyspieszyć działanie swojej witryny.

13.01.2023 | Autor: Marcin

Przyspiesz swoją stronę internetową

Szybkość z jaką ładuje się twoja strona internetowa w przeglądarce ma niebagatelne znaczenie. Zarówno odbiór przez użytkowników jak również wpływ na kwestie serwerowe sprawia, że nie można pozostawić tej kwestii samej sobie. Aby zrozumieć jak ważny jest to aspekt musimy na początku przeanalizować jakie elementy zależą od tego czy na strona działa szybko i sprawnie.

Użytkownicy

Jeśli twoja witryna wolno się ładuje w oknie przeglądarki użytkownika, to jest spore prawdopodobieństwo, że ta osoba porzuci stronę www i poszuka w google czegoś innego. Jak zapewne łatwo przewidzieć, prowadzi to do utraty potencjalnych klientów. Oczywiście jest to bardzo zły scenariusz jednak nie należy go lekceważyć, gdyż badania wykazują, iż jest to jeden z najczęstszych powodów opuszczania stron internetowych przez użytkowników.

Wpływ na wyniki wyszukiwania

Od dłuższego czasu wiemy, że wyszukiwarki patrzą łaskawym okiem w kierunku stron internetowych, które są odpowiednio zoptymalizowane, również pod kątem szybkości ładowania się. Jeśli chcemy liczyć się w wyścigu po najwyższe pozycje w wynikach wyszukiwania google, koniecznie musimy zadbać o kwestie związane z szybkością naszej strony.
Istnieje kilka narzędzi, które pomagają twórcom w analizie i eliminowaniu problemów, których nie widać gołym okiem. Najpopularniejszym z nim jest google pagespeed insights.

Środowisko serwerowe

Ważne jest aby mieć świadomość, że nawet najbardziej wydajne środowisko uruchomieniowe dla naszej strony www, nie poradzi sobie w sytuacji w której aplikacja jest napisana w oderwaniu od kwestii szybkości działania. Jeśli nasza aplikacja powoduje, że czas odpowiedzi serwera jest długi, może to prowadzić do szeregu problemów, które w skrajnych sytuacjach mogą spowodować nawet całkowite wyłączenie usługi.

 

Skoro już wiemy jak ważne jest to aby nasza strona internetowa działała szybko i sprawnie, to możemy przejść do tego co możemy zrobić aby to osiągnąć.

Czas generowania się strony/odpowiedź serwera

Są to kwestie powiązane ze sobą, jednak nie do końca oznaczają to samo. Z punktu widzenia użytkownika czas generowania się strony, zawiera się w czasie odpowiedzi serwera. To zapewne jest przyczyną częstych nieporozumień. Dlatego warto mieć świadomość, że czas generowania się strony jest okresem, w którym przetwarzane jest żądanie w ramach aplikacji. W przypadku języka PHP, będzie to czas, który poświęcił interpreter na to aby wygenerować wynikowy kod html. Czas odpowiedzi serwera jest dłuższy gdyż zawiera w sobie dodatkowe elementy, które musi wykonać serwer http zanim zwróci odpowiedź do przeglądarki. Tych zadań może być naprawdę sporo: obsługa kolejkowania zadań, szyfrowanie, kompresja, przekierowania, proxy etc.

Co można zrobić aby czas generowania strony internetowej przez serwer był krótszy?

Pierwszą i najważniejszą sprawą jaką powinniśmy się zająć jest optymalizacja aplikacji. Chodzi o to aby kod był pozbawiony elementów, które mogą się zbyt długo wykonywać. Jeśli w naszym systemie występują takie miejsca, należy je koniecznie zrefaktoryzować. Jeśli długo wykonywane zadanie jest naprawdę istotne, wtedy można spróbować przenieść newralgiczną część w miejsce, gdzie możliwe będzie przetwarzanie w tle. Można też zastosować jakiegoś typu rozwiązania asynchroniczne.

Kiedy jesteśmy na etapie, w którym nasza strona www jest pozbawiana problematycznych fragmentów, możemy zastanowić się nad możliwością przechowywania wyników niektórych operacji w tzw. cache. Tutaj pojawia się po raz pierwszy słowo klucz, czyli cachowanie. Jest to pojęcie dosyć ogólne. W kontekście tworzenia stron internetowych stosuje się je w różnych miejscach. Na tym etapie jednak poruszamy kwestię odkładania w pamięci tymczasowych informacji, których wyliczenie/zbudowanie jest czasochłonne. Mogą być to skomplikowane operacje matematyczne, mogą być to długo wykonujące się zapytania do bazy danych lub wyrenderowanie jakiegoś elementu strony. W zasadzie nie ma tutaj ograniczeń jeśli chodzi o zastosowania. Popularną praktyką jest przechowywanie tych tymczasowych informacji w pamięci serwera. Można to zrealizować na różne sposoby. Najpopularniejsze są następujące mechanizmy:

  • Redis
  • Memcache
  • Pliki

Obecnie najpowszechniej stosowanym rozwiązaniem jest Redis. Czyli usługa instalowana w ramach serwera, z którą komunikacja odbywa się poprzez protokół tcp. Posiada ogromne możliwości i w zasadzie można ją nazywać bazą danych. Potrafi składować informację w pamięci operacyjnej jak również w pamięci masowej. Kiedyś częściej stosowanym mechanizmem był Memcache, który również przechowywał dane w pamięci operacyjnej serwera. Dzisiaj jednak został praktycznie wyparty przez Redis.

Wiele systemów, które wykorzystuje się do budowania nowoczesnych stron internetowych posiada w sobie już mechanizmy cachujące niektóre elementy. Najpopularniejszy obecnie system typu CMS, czyli WordPress również posiada wbudowany moduł odpowiadający za cachowanie. Istnieje wiele wtyczek, które potrafią w pełni wykorzystać te możliwości, a nawet rozbudować je. Ciekawym rozszerzeniem, na które warto zwrócić uwagę jest na pewno wp rocket. Co prawda jest to dodatek, za który należy zapłacić. Mimo wszystko jego możliwości są ogromne w kontekście optymalizacji aplikacji internetowej typu wordpress, nie tylko jeśli chodzi o cache.
Frameworki, które są systemami bardziej ogólnego zastosowania również implementują mechanizmy cachowania. Większość z nich przechowuje chociażby swoją konfigurację i wiele innych elementów niezbędnych do uruchomienia. Dodatkowo posiadają w sobie różnego rodzaju interfejsy wspomagające programistę w tworzeniu mechanizmów realizujących cachowanie na różnym poziomie.

Innym podejściem do tematu cachowania jest przechowywanie całego wygenerowanego kodu wynikowego w pamięci, tak aby żądanie serwera http nie wymagało każdorazowo odpytania aplikacji. Takie podejście jest niezwykle skuteczne jeśli chodzi o skrócenie czasu odpowiedzi serwera. Realizacja takiego scenariusza jest jednak skomplikowana, gdyż wymaga zastosowania zaawansowanych narzędzi oraz sporej wiedzy, nie tylko z zakresu samego budowania strony internetowych, ale również protokołów sieciowych, administracji systemami informatycznymi.

Kiedy nasza strona www jest zbudowana w oparciu o Worpdress, wtedy możemy zastosować rozwiązanie hybrydowe, czyli takie które będzie posiadać znamiona cachowania całej treści wynikowego kodu html przekazywanego do przeglądarki, ale nie będzie zarazem stosować zaawansowanych narzędzi. Z pomocą tutaj przychodzą nam twórcy różnorakich wtyczek posiadających w swojej nazwie słowo „cache”. Najpopularniejsze z nich to wp super cache oraz litespeed cache. Dzięki nim możemy tak skonfigurować naszą aplikację internetową, aby kod strony raz wygenerowany był przechowywany w pamięci(najczęściej są to zwykłe pliki). Gdy aplikacja otrzyma kolejne żądanie o ten sam zasób, wtedy zamiast przetwarzać je całościowo, do przeglądarki zostanie wysłany przechowywany w pamięci kod.
Taki schemat możemy zbudować nie tylko w przypadku WordPress. Strony www przygotowane w oparciu o rozwiązania customowe, czyli stworzone specjalnie dla pojedynczego klienta również mogą implementować tego typu rozwiązanie. W tym celu należy posłużyć się mechanizmem kontroli bufora, do którego serwer wysyła treść dla przeglądarki. Aplikacja może być tak skonfigurowana, aby treść przeznaczoną dla klienta przechować w buforze. W momencie gdy cała zawartość już się w nim znajdzie, wtedy należy ją gdzieś zapisać np. w pliku tekstowym. Następnie bufor należy opróżnić, czyli dostarczyć znajdujące się w nim dane do użytkownika. Następne zapytanie do serwera można będzie obsłużyć już wcześniej wygenerowanym plikiem.

Ten mechanizm również zapewnia niezwykle wydaje rozwiązanie, które możemy z powodzeniem samodzielnie uruchomić. Dzięki takiemu podejściu możemy w bardzo prosty sposób ograniczyć koszty związane z utrzymaniem witryny. Rozwój strony internetowej oraz zwiększony ruch na niej będzie możliwy do obsłużenia w ramach tych samych zasobów.

Kiedy to nie wystarcza

Większe serwisy internetowe, czyli takie które obsługują ogromną liczbę użytkowników muszą sięgać po bardziej zaawansowane rozwiązania cachowania treści. Najpopularniejszą technologią w tym zakresie jest Varnish Cache. Jak mówią twórcy jest to akcelerator aplikacji webowych, który działa na zasadzie reverse proxy. Co to właściwie znaczy? Chodzi o to, że jest to usługa sieciowa, która znajduje się pomiędzy przeglądarką użytkownika, a serwerem aplikacji. Varnish posiada możliwości nie tylko w zakresie cachowania, ale może być wykorzystywany innych zadań. Przykładowo potrafi on pełnić funkcję load balanera, choć nie jest to zbyt często stosowana konfiguracja.

Co nam daje taki model

Jaki zatem jest uzysk z faktu wdrożenia w ramach swojego projektu mechanizmu cachowania na poziomie reverse proxy. Być może nie jest to oczywiste z perspektywy niedużego bloga tematycznego, czy też zwykłej strony internetowej lokalnej firmy. Natomiast gdy w grę wchodzi ogromny ruch, wtedy widać najlepiej korzyści z zastosowania tego modelu. Sprowadza się to do tego, że maszyny które zajmują się obsługa aplikacji nie muszą posiadać ogromnych zasobów sprzętowych. Czasami wystarczy jeden serwer backendowy do generowania treści, gdyż cały ruch a co za tym obciążenie zatrzymywane jest wcześniej, na poziomie reverse proxy. Łatwo przewidzieć, że jest to rozwiązanie do którego wszyscy chcieliby dążyć ze względu na koszty.

Podsumowanie

Nie każdy musi odpowiadać za serwis internetowy, który obsługuje miliony użytkowników. Każdy natomiast powinien zadbać o cachowanie swojej witryny. Jeśli nie z powodu optymalizacji kosztów, to na pewno z powodu lepszego odbioru przez klientów końcowych, a co za tym idzie wyszukiwarek internetowych.

Porozmawiaj z nami
o swoim projekcie

+48 506 160 480
[email protected]

lub napisz