Prędkość ładowania strony na urządzeniach mobilnych to jeden z kluczowych czynników rankingowych Google i warunek wysokiej konwersji. Wielu właścicieli serwisów Drupal zmaga się z fatalnymi wynikami Google PageSpeed (na poziomie 15–30 punktów).
W tym studium przypadku pokazujemy, jak krok po kroku podnieśliśmy wynik mobilny do stabilnych 95+ punktów.
Główne problemy, które zidentyfikowaliśmy
- Blokujące renderowanie skrypty JS i style CSS ładowane w nagłówku
<head>.
- Nieoptymalne formaty grafik (stare pliki PNG i JPEG zamiast WebP/AVIF z atrybutami
loading="lazy").
- Agresywne wstrzykiwanie zewnętrznych widgetów (czaty, analityki, mapy) bez odroczenia (defer/async).
- Brak preconnect i optymalizacji pobierania fontów Google Fonts.
Zastosowane rozwiązania
- Formaty nowej generacji: Wszystkie grafiki zostały skonwertowane do formatu WebP z responsywnymi atrybutami
srcset.
- Krytyczny CSS i opóźnienie JS: Wydzielenie krytycznych stylów do inlinowania w nagłówku, odroczenie ładowania skryptów do momentu interakcji użytkownika.
- Optymalizacja fontów: Zastosowanie
font-display: swap oraz preconnect do domen Google Fonts.
- Agresywne buforowanie: Konfiguracja pamięci podręcznej i buforowania HTTP w Cloudflare.
Wynik: Wzrost wyniku PageSpeed z 15 do 97 na mobile, spadek LCP z 5.8s do 1.2s i natychmiastowy wzrost pozycji w wyszukiwarce.