Blog posty

Ostatnio na naszym Discordzie Web Dev Insider zapytano mnie, czy mógłbym rozwinąć / omówić ideę serwowania obrazków w przestrzeni ATF (zakwalifikowanych jako LCP) poprzez CDN, ale proxy'ując połączenie przez serwer.

Parę informacji dotyczących HTTP/2 Server Push (a tak naprawdę jego końca) oraz znacznie lepszej alternatywy w postaci Early Hints. Zespół Google'a ogłosił, że Chrome od wersji 106 przestanie wspierać Server Push.

Kilka dni temu, WebPageTest ogłosił nową funkcjonalność w swoim narzędziu o nazwie Experiments & Opportunities. Po wygenerowaniu standardowego raportu, mamy do dyspozycji nową sekcję z listą rekomendowanych usprawnień na stronie (coś podobnego, co otrzymujemy w Lighthouse) + opcję uruchomienia nowego testu, z implementacją danej zmiany bez potrzeby kodowania, aby przekonać się, jak faktycznie wpływa ona na wydajność. Czy jest to dobre narzędzie?

4. kwietnia 2022 r. miałem przyjemność wystąpić na konferencji 4Developers z prezentacją na temat optymalizacji wydajności frontendu. Przedstawiłem sposoby poprawy wydajności aspektów stron WWW, których developerzy często się nie podejmują, gdyż rzekomo są niemożliwe do ogarnięcia. Otóż nie ma rzeczy niemożliwych :-)

W tym artykule przyjrzymy się różnym sposobom ładowania obrazka w przestrzeni hero / Above The Fold. Różne podejścia mogą przynieść naprawdę różne rezultaty wydajnościowe. Ważne jest, aby to, co znajduje się na samej górze strony, było ładowane jak najszybciej. Dzięki temu użytkownik będzie mógł zapoznawać się z treściami w sposób sprawny i będzie pozytywnie postrzegał progres ładowania.

W optymalizacji frontendu kluczową sprawą to mierzenie wszelkiej maści metryk na stronie WWW - od TTFB, po LCP, Time to interactive, SpeedIndex itd. Po analizie czasów możemy przejść do planu ich optymalizacji i wdrażania go. Przyjęło się, że im szybszy dany czas, tym lepiej - czyli im szybciej pojawia się np. tytuł strony w przeglądarce - tym lepiej, im sprawniej pojawi się kluczowy element „above the bold” - tym lepiej, im szybciej strona jest interaktywna - tym lepiej.