Zalecenia dotyczące zwiększenia prędkości ładowania strony
Google wprowadził nowy algorytm rankingu dla wyszukiwania mobilnego. Szybkość ładowania strony na urządzeniach mobilnych wpływa teraz na pozycję witryny w wyszukiwarce mobilnej Google. Ale co zrobić, jeśli prędkość ładowania witryny jest niska?
Przede wszystkim ważne jest, aby używać stabilnego hostingu. To zależy od używanego CMS, ale zdecydowanie polecam ten hosting. Jeśli masz dobry, więc odpowiedź na to pytanie jest uniwersalną listą rekomendacji, dzięki której zwiększy się szybkość ładowania stron witryny nie tylko na komputery, ale także na urządzenia mobilne. Dla lepszego zrozumienia elementy są ułożone w kolejności rosnącej siły roboczej i wydajności. Oto kilka sposobów na zwiększenie wydajności witryny, na które zalecamy zwrócić uwagę.
1. Optymalizacja obrazu
Aby zwiększyć szybkość ładowania elementów strony z powodu optymalizacji obrazu, zalecamy:
użyj obrazów png na stronie (obecnie najskuteczniejszy format strony nie jest obsługiwany przez wszystkie przeglądarki);
użyj kompresji wysokiej jakości dla obrazów;
użyj rozmiaru załadowanego obrazu, który odpowiada rozmiarowi wyświetlanemu na stronie, tzn. przeglądarka nie powinna kompresować ani zwiększać rozmiaru obrazu;
początkowo ładuj tylko te obrazy, które są widoczne dla użytkownika po otwarciu strony, a dla pozostałych obrazów zaleca się używanie Lazy Load podczas przewijania strony.
2. Optymalizacja plików JavaScript i CSS
Przed wyświetleniem strony przeglądarka pobiera i odczytuje wszystkie pliki JavaScript i CSS. Z tego powodu wydłuża się czas wyświetlania zawartości strony. Jednak podczas ładowania każdego nowego pliku JS i CSS przeglądarka ponownie odbudowuje stronę, co spowalnia jej ładowanie. Aby uniknąć opóźnień, należy stosować następujące techniki:
Ładuj tylko skrypty i style używane na stronie. Przeglądarka nie powinna ładować dodatkowych skryptów ani oddzielnych plików arkuszy stylów, jeśli nie są one używane na danej stronie.
Nie ładuj osobnych małych plików JS i CSS, aby uniknąć tworzenia niepotrzebnych połączeń z serwerem, które spowalniają witrynę. Zalecamy osadzanie takich plików w kodzie HTML stron przy użyciu odpowiednio tagów <script> i <style>.
Odłóż ładowanie dodatkowych skryptów i stylów za pomocą atrybutów odroczenia lub asynchronizacji. Umożliwi to przeglądarce wyświetlanie zawartości strony bez opóźniania ładowania stylów i skryptów.
Zastosuj minimalizację do wszystkich plików JS i CSS, co usunie dodatkowe znaki i puste linie / spacje. W rezultacie objętość każdego pliku zostanie zmniejszona.
W przypadku skryptów Google zaleca stosowanie technologii UglifyJS i kompilatora zamknięcia, w przypadku stylów – CSSNano lub ccso. (link do rekomendacji Google https://developers.google.com/speed/docs/insights/MinifyResources)
3. Kompresja GZIP
Gzip to metoda kompresji plików do archiwum, zmniejszająca ich rozmiar i czas dostawy. Wśród zalet gzip:
szybka kompresja i dekompresja plików;
kompresja bez utraty jakości (pliki są całkowicie przywracane podczas rozpakowywania);
obsługa nowoczesnych przeglądarek.
Kompresja Gzip jest używana do plików HTML, stylów, skryptów, dokumentów tekstowych. Pozwala to kilkakrotnie zmniejszyć ich wagę. Materiały medialne, takie jak zdjęcia, materiały wideo i dokumenty docx, xlsx, są słabo lub praktycznie nieskompresowane.
Główną wadą technologii Gzip jest to, że kompresja plików wymaga czasu. Oznacza to, że jeśli serwer nie ma wystarczającej mocy, milisekundy mogą zostać utracone. Dlatego z reguły używany jest najszybszy poziom kompresji gzip – 9. Kompresowanie plików ważących mniej niż kilobajt jest również niepraktyczne, ponieważ nagłówki gzip wymagają zainicjowanej lokalizacji.
4. Subdomeny usług
Ponieważ w witrynie znajduje się duża liczba skryptów i obrazów, zalecamy ich usunięcie w oddzielnej subdomenie usługi. Ułatwi to witrynę i zwiększy jej wydajność.
Nie zalecamy przesyłania do subdomeny grafiki używanej do renderowania stron w witrynie. Lepiej jednak przenieść zdjęcia towarów, usług i podobnych obrazów do subdomeny usług i przesłać je z osobnego serwera.
Korzystanie z subdomen pozwoli przeglądarce jednocześnie pobierać większą liczbę plików z różnych serwerów, co przyspieszy ich pracę i pozytywnie wpłynie na czas ładowania strony.
5. CDN
Oddalenie użytkownika od serwera jest jednym z czynników wpływających na szybkość ładowania strony internetowej. Jeśli jesteś właścicielem dużej witryny, zalecamy korzystanie z technologii CDN.
CDN (sieć dostarczania treści) lub sieć dostarczania danych – sieć serwerów zlokalizowanych w różnych częściach świata i odpowiedzialnych za szybkie dostarczanie treści do użytkownika.
Oznacza to, że prędkość pobierania jest zmniejszona, ponieważ użytkownik otrzymuje informacje z najbliższego serwera. Jednocześnie zmniejsza się obciążenie własnego serwera. Podczas podłączania sieci CDN należy dokładnie sprawdzić dostawców pod kątem obecności serwerów w regionach, na które ukierunkowana jest witryna.