Unikaj bardzo dużych ładunków sieciowych

Duże ładunki sieciowe są ściśle skorelowane z długim czasem wczytywania. Korzystanie z nich też wiąże się z kosztami, np. za dodatkowy pakiet danych. Dlatego zmniejszenie całkowitego rozmiaru żądań sieciowych wysyłanych przez Twoją stronę ma pozytywny wpływ na komfort użytkowników Twojej witryny i korzystania z ich portfeli.

Co się dzieje z kontrolą ładunku sieci Lighthouse

Lighthouse pokazuje łączny rozmiar wszystkich zasobów wszystkich zasobów żądanych przez stronę w kibibajtach (KiB). Największe żądania są przedstawiane jako pierwsze:

Zrzut ekranu z kontroli Lighthouse Unikanie bardzo dużych ładunków sieciowych

Na podstawie danych archiwum HTTP mediana ładunku sieciowego wynosi od 1700 do 1900 KiB. Aby ułatwić wyświetlanie największych ładunków, Lighthouse oznacza strony,których łączna liczba żądań sieciowych przekracza 5000 KiB.

Jak zmniejszyć rozmiar ładunku

Staraj się nie przekraczać 1600 KiB łącznego rozmiaru w bajtach. Ten cel zależy od ilości danych, które teoretycznie można pobrać przez połączenie 3G przy czasie do pełnej interaktywności nieprzekraczającej 10 sekund.

Oto kilka sposobów na zmniejszenie ładunku:

Wskazówki dotyczące stosu

Angular

Zastosuj dzielenie kodu na poziomie trasy, aby zminimalizować rozmiar pakietów JavaScript. Możesz też wstępnie buforować zasoby za pomocą skryptu service worker Angular.

Drupal

Pomyśl o używaniu stylów obrazów elastycznych, aby zmniejszyć rozmiar obrazów wczytywanych na stronie. Jeśli używasz widoków danych do wyświetlania wielu elementów treści na stronie, rozważ wprowadzenie podziału na strony, aby ograniczyć liczbę elementów wyświetlanych na stronie.

Joomla

Rozważ wyświetlanie fragmentów w kategoriach artykułów (jednym popularnym rozwiązaniem jest link „więcej informacji”), zmniejszenie liczby artykułów wyświetlanych na danej stronie, podzielenie długich postów na kilka stron lub użycie wtyczki umożliwiającej leniwe ładowanie komentarzy.

WordPress

Rozważ wyświetlanie fragmentów na listach postów (możesz użyć tagu „więcej”), zmniejszyć liczbę postów wyświetlanych na danej stronie, podzielić długie posty na kilka stron lub użyć wtyczki do leniwego ładowania komentarzy.

Zasoby

Kod źródłowy do kontroli unikania dużych ładunków sieciowych