Czy warto używać na swoich stronach grafik w formacie WebP?

Jeżeli kładziemy duży nacisk na to, aby strona ładowała się maksymalnie szybko, prędzej czy później, optymalizując ją krok po kroku, będziemy musieli zmierzyć się z komunikatem, który zwróci naszą uwagę na oszczędności, przy ładowaniu strony, związane ze zmianą formatu wyświetlanych grafik:

 

serve-images-in-next-gen-formats

 

Jak widzimy na powyższym screenie, szacowane oszczędności są duże – aż 0,75 sekundy.

Strona, dla której wyświetliła się taka sugestia, przechodzi w pełni test web.dev:

 

 

Wydawać by się mogło, że zmiana wpłynie pozytywnie na stronę – nie podciągnie się wskaźników już wyżej, ale zyskają użytkownicy (witryna jeszcze trochę przyspieszy).

Przyjrzyjmy się temu tematowi bliżej.

Czym jest format WebP

Format ten został zaprezentowany we wrześniu 2010 przez Google i miał zastąpić starsze rozszerzenia – JPEG, PNG i GIF. Jak informuje Wikipedia rozmiar obrazów PNG przy kompresji bezstratnej WebP zmniejsza się o 26%. Przy kompresji stratnej obrazów JPG rozmiar zmniejsza się zależnie od jakości takiej kompresji. Przy zachowaniu jakości na poziomie 80% WebP rozmiar obrazów JPG zmniejsza się nawet o 85%.

Jak widać, jest pole do oszczędności – i wydawać by się mogło, że można, pozostawiając wskaźniki, na maksymalnym poziomie zoptymalizowania, dostarczyć użytkownikom lepsze doznania.

Safari a grafiki WebP

Okazuje się jednak, jak wejdziemy w temat głębiej, że sprawa nie jest wcale taka prosta – na przeszkodzie stoi bowiem … Apple, które trochę inaczej zapatruje się na tego typu optymalizację. Na chwilę, kiedy pisze ten artykuł, Safari jest JEDYNĄ przeglądarką, która nie wspiera grafik formatu WebP

 

 

Konkluzja

Zanim zdecydujemy się na usuwanie wszelkich komunikatów z testu web.dev, upewnijmy się, że nie robimy czegoś, co sprawi, że nasza strona będzie się źle wyświetlać potencjalnym klientom.

Jak widać zastosowanie się do opisanej w artykule rekomendacji wpłynęłoby bowiem źle na osoby korzystające z produktów firmy Apple.

Dodaj komentarz

Twój adres e-mail nie zostanie opublikowany. Wymagane pola są oznaczone *