Google WebP & Lazy Load - optymalizacja obrazków i zdjęć
Zwiększ szybkość ładowania sklepu konwertując zdjęcia do formatu WebP oraz wykorzystując technikę Lazy Load. Optymalizuj zdjęcia produktów, obrazki w opisach i na stronach CMS. Przyśpiesz sklep na urządzeniach mobilnych i podnieść wynik SEO!
Google WebP & Lazy Load - optymalizacja obrazków i zdjęć
WebP to format kompresji obrazów rozwijany przez Google. WebP przy mniejszym nawet o 85% rozmiarze zachowuje porównywalną jakość zdjęcia z formatem JPEG. Format ten jest promowany przez wyszukiwarkę Google i coraz szerzej wykorzystywanym w Internecie. Korzystając z formatu WebP osiągniesz wyższe wyniki w Google Page Speed, Lighthouse oraz GTMetrix.
Konwersja zdjęć produktów do formatu WebP
Nasz moduł zoptymalizuje wszystkie grafiki w Twoim sklepie. Wypłynie to pozytywnie na szybkość ładowania sklepu, wydajność serwera, wyniki w testach wydajności oraz odczucia użytkownika podczas surfowania po Twoim sklepie.
Wykorzystaliśmy (2021) najnowsze dostępne technologie do optymalizacji zdjęć na potrzeby Internetu. Moduł zaoszczędzi ogromną ilość danych, nie obciąży serwera oraz skróci czas ładowania się sklepu na urządzeniach mobilnych i komputerach.
Moduł konwertuje do WebP wszystkie zdjęcia w Twoim sklepie:
Zdjęcia produktów, zdjęcia na listach produktów oraz w opisach produktów
Zdjęcia na stronach CMS, stronie głównej, stronie kontaktu, itp.
Zdjęcia wyświetlane przez zewnętrzne moduły takie, jak blogi, albumy i galerie, banery i slidery.
Moduł zacznie generować grafiki w formacie WebP w tle, podczas ich pierwszego wczytania przez przeglądarki Twoich klientów. Dzięki temu moduł nie obciąża serwera długotrwałymi operacjami w trakcie generowania WebP oraz w trakcie późniejszego ich wykorzystania.
Wszystkie nowe zdjęcia, które wgrywasz w formacie JPEG lub PNG będą konwertowane w locie do formatu WebP.
Wszystkie zdjęcia znajdujące się już w Twoim sklepie zostaną konwertowane na WebP w chwili ich pierwszego wczytania.
Moduł wykryje nowo dodane produkty, zmiany zdjęć w produktach oraz usunięcie zdjęć i zadba o porządek w plikach grafik na serwerze. Wyczyszczenie cache w Twoim sklepie nie spowoduje usunięcia wygenerowanych zdjęć w formacie WebP.
PrestaShop & Lazy Load
Aby skrócić czas do pełnej interaktywności strony będziesz mógł skorzystać z leniwego ładowania. Dzięki temu najpierw będą ładowane wszystkie zasoby kluczowe, a dopiero potem obrazy znajdujące się poza widocznym ekranem. Obrazy zostaną załadowane dopiero, gdy użytkownik przewinie do nich stronę i zobaczy je na ekranie. Dzięki temu zwiększysz szybkość do pełnej interaktywności oraz zredukujesz transmisję danych dla urządzeń mobilnych z limitem Internetu lub wolnym połączeniem. Dzięki modułowi serwer nie będzie ładować elementów, których klient nie będzie chciał zobaczyć.
W trakcie ładowania obiekty przechowujące obrazki zachowują swój orgyginalny rozmiar. Moduł nie generuje przeskoków strony w trakcie jej ładowania oraz nie pokazuje zastępczych grafik. Testy dowodzą, że puste, białe miejsca wyglądają estetycznie, nie rozpraszają kupującego i zmniejszają ilość odrzuceń.
Przyjazny SEO
Twoje obrazki będą widoczne dla robotów internetowych. Linki URL do zdjęć i obrazów są cały czas w kodzie strony. Nasz moduł został przygotowany zgodnie z dobrymi praktykami SEO wg. wytycznych Google i pozytywnie wpłynie na wyniki testów Google Page Speed, Lighthouse oraz GTMetrix Twojego sklepu PrestaShop.
Zainstaluj i korzystaj
Zainstaluj moduł i włącz konwersje do formatu WebP oraz Lazy Load. Moduł nie wymaga skomplikowanych konfiguracji. Zautomatyzowaliśmy w pełni działanie rozwiązań optymalizujących grafiki i zdjęcia dla eCommerce.
Maksymalne przyśpieszenie dzięki nowoczesnym rozwiązaniom
Rys. 1 Poprawa wyników desktop uzyskana po instalacji modułu. Osiągnięte wyniki uzależnione są od wielu zmiennych, w tym wydajności i obciążenia serwera oraz optymalizacji core i modułów PrestaShop.
Biblioteka do obsługi WebP. Aby konwersja do WebP działała wydajnie i maksymalnie szybko na Twoim serwerze musi być zainstalowana jedno dowolne z poniższych rozszerzeń. Upewnij się, czy Twój hosting obsługuje dowolne z nich:
cwebp
ffmpeg
vips
imagick
gmagick
imagickbinary
gmagickbinary
gd
Rodzaj serwera. Moduł działa z każdym serwerem Apache. Dla obsługi innych serwerów www (np. nginx), należy we własnym zakresie przetłumaczyć polecenia w pliku .htaccess, dopasowując je do konfiguracji danego serwera. Usługę tą możesz zamówić po zakupie modułu otwierając zgłoszenie na helpdesk.prestashow.pl.
Dodatkowe wymagania. Moduł do działania wymaga włączonych przyjaznych adresów (Friendly URL).
WebP obsługiwany jest przez przeglądarki: Google Chrome, Firefox, Opera, Edge, GNOME Web, Midori, Falkon, Pale Moon oraz Waterfox.
Jeśli przeglądarka klienta nie obsługuje formatu WebP moduł wyświetli standardowe zdjęcia jpeg/png.
CloudFlare jest wspierany przez nasz moduł.
W galerii zdjęć znajdziesz porównanie wyników Google Page Speed przed i po instalacji modułu.
Changelog dni temu)
PSHOW LAZYIMG CHANGELOG ==========
v2.7 - 2021.05.10 * you can set whether the module should use tag for faster loading of webp graphics * fixed small bugs
v2.6 - 2021.04.27 ----- * module has been optimized for best performance * product images can be converted using cron task or manually by url * all images will be dynamically converted to webp during first load * from now clearing shop cache will not remove webp images * images in webp format are now stored next to the original files * removed lazy load with low resolution placeholder (due to lower performance) * removed lazy load with shop logo as placeholder (due to lower performance)
v2.3 - 2020.03.12 ----- * from now module support converting images to WebP format on-the-fly
v2.2 - 2019.07.25 ----- * in case of error, try to lazy load without placeholder
v2.1 - 2019.07.24 ----- * improved placeholder generator * errors will be logged in /var/logs/*_pshowlazyimg.log * other small fixes
v2.0 - 2019.07.18 ----- * changed way of loading images
v1.14 - 2019.03.08 ----- * fixed a problem with replacing urls for photos with null * fixed a problem with update of module
v1.13 - 2019.01.29 ----- * bugs fixes
v1.12 - 2019.01.18 ----- * shop logo as default loading image * fix for dynamically loaded content
v1.11 - 2019.01.02 ----- * bugs fixes
v1.1 - 2019.01.01 ----- * simplified photos uploading * added translations * added the ability to upload own loading pictures * bugs fixes
v1.0 ----- * first version of the module
Komentarze
2021-04-30 Szymon W
Po aktualizacji problemy modułu zniknęły. Wyniki mobile z 69 na 80 komputery z82 na 96. POLECAM!!!!!!
2021-02-24 Olgierd W
Polecam -wyniki w gtmetix poprawiły się
2020-04-14 Kostas
Work good but make sure you have installed one of mentioned extensions on your server if you want to use webp format.
2020-04-08 Manuel Ortiz
OK
2020-03-30 Andrzej Kula
Dziękuję za ustawienie serwera. To on był u nas problemem.
2020-03-19 Artur Kuśmierz
Efekt podobny z 67 na 81. Dobry moduł
2020-03-16 Katherine
great module: webp + 12 point, lazy load + 7 points page speed
2019-10-02 Robert Goth
Moduł robi co ma robić. Wynik page speed desktop 72 do 81, mobile 44 do 55. Polecam.
2019-08-20 prestashow.pl
Wide Print - najszybsza metoda dla czasu ładowania sklepu to "Load lazily without placeholder". Dla zdjęć i obrazków możesz wybrać jedną z następujących metod:
1. Load normally (ładowanie bez lazyload) 2. Load lazily without placeholder (fastest) (lazyload bez obrazka zastępczego) 3. Load lazily and use original image with low resolution as placeholder (looks nice) (lazyload z powolnym ładowaniem) 4. Load lazily and use shop logo with low resolution as placeholder (compromise between options 2 and 3) (lazyload z obrazkiem-zaślepką)
2019-08-09 Wide Print
Po ostatniej aktualizacji można ustawić metodę lazyload dla zdjęć produktów i dla pozostałych zdjęć w sklepie niezależnie. Która metoda jest najlepsza dla tych zdjęć?
2019-07-19 Anna Snopek
Moduł działa po prostu dobrze, dokładniej, strona w trakcie ładowania wygląda ładnie. Dzięki!
Wymagania techniczne
PHP >= 7.1. Dla maksymalnej wydajność i bezpieczeństwa zalecamy PHP 7.3
Szczegółowe informacje nt. licencji znajdziesz na tej stronie. Poniżej znajdują się najważniejsze informacje dotyczące użytkowania naszych modułów i licencji:
Moduł możesz użytkować bez ograniczeń czasowych w jednym sklepie: 1 moduł = 1 licencja = 1 domena.
Przypisanie modułu do domeny wykonasz samodzielnie po zalogowaniu się do Twojego Konta w sklepie prestashow.pl
Moduł możesz również użytkować w sklepie testowym: dev.domena.pl,test.domena.pl, beta.domena.pl.
Zmiana domeny dla licencji jest możliwa. W tym celu prosimy o kontakt pod adresem kontakt@prestashow.pl
Możesz modyfikować kod źródłowy modułów w plikach tpl i css. Modyfikacja silnika (core) modułu wiąże się z utratą gwarancji.
Po aktualizacji problemy modułu zniknęły. Wyniki mobile z 69 na 80 komputery z82 na 96. POLECAM!!!!!!
Polecam -wyniki w gtmetix poprawiły się
Work good but make sure you have installed one of mentioned extensions on your server if you want to use webp format.
OK
Dziękuję za ustawienie serwera. To on był u nas problemem.
Efekt podobny z 67 na 81. Dobry moduł
great module: webp + 12 point, lazy load + 7 points page speed
Moduł robi co ma robić. Wynik page speed desktop 72 do 81, mobile 44 do 55. Polecam.
Wide Print - najszybsza metoda dla czasu ładowania sklepu to "Load lazily without placeholder". Dla zdjęć i obrazków możesz wybrać jedną z następujących metod:
1. Load normally (ładowanie bez lazyload)
2. Load lazily without placeholder (fastest) (lazyload bez obrazka zastępczego)
3. Load lazily and use original image with low resolution as placeholder (looks nice) (lazyload z powolnym ładowaniem)
4. Load lazily and use shop logo with low resolution as placeholder (compromise between options 2 and 3) (lazyload z obrazkiem-zaślepką)
Po ostatniej aktualizacji można ustawić metodę lazyload dla zdjęć produktów i dla pozostałych zdjęć w sklepie niezależnie. Która metoda jest najlepsza dla tych zdjęć?
Moduł działa po prostu dobrze, dokładniej, strona w trakcie ładowania wygląda ładnie. Dzięki!