Większość nowoczesnych stron na WordPressie cierpi na te same bolączki: przeładowanie skryptami (bloat), ciężkie obrazy i dziesiątki zapytań do zewnętrznych domen. W tym artykule opisujemy proces optymalizacji serwisu opartego na Elementorze i WooCommerce, w którym udało nam się zejść z czasem Largest Contentful Paint (LCP) do poziomu 1.3 sekundy.
Wyniki audytu Lighthouse (Po optymalizacji)
Oto kluczowe wskaźniki zmierzone po wdrożeniu wszystkich poprawek technicznych:
| Metryka | Wynik | Status |
|---|---|---|
| Performance | 98 / 100 | ✅ Bardzo dobry |
| FCP | 1.1s | ✅ Bardzo dobry |
| LCP | 1.3s | ✅ Bardzo dobry |
| TBT | 0ms | ✅ Bardzo dobry |
1. Natywna optymalizacja obrazów (WebP)
Zamiast korzystać z ciężkich wtyczek, wdrożyliśmy autorskie rozwiązanie oparte na bibliotece graficznej serwera. System generuje WebP w tle, a specjalny rewriter podmienia linki w locie.
2. Lokalne fonty i eliminacja bloatu
Pobraliśmy fonty Oswald i Muli na własny serwer, eliminując DNS prefetch do Google. Wyłączyliśmy też zbędne skrypty Emoji i Dashicons.
3. Technologia Speculative Rules
Wdrożyliśmy nowoczesne API Speculation Rules, które pozwala przeglądarce ładować podstrony w tle, zanim użytkownik w nie kliknie.