Czy Twój sklep oparty na Magento działa powoli? Nie martw się! W naszym najnowszym poście podajemy kilka skutecznych sposobów, jak przyspieszyć działanie Magento i zapewnić lepsze doświadczenie zakupowe dla Twoich klientów.
Dodatkowo pokażemy Ci, jakie kroki podjąć i jakie optymalizacje zastosować, aby wyniki w Google Page Speed były wyższe niż obecnie.
Jak przyspieszyć działanie Magento?
Co oznaczają wyniki na Google PageSpeed?
Jak przyspieszyć Magento – rozwiązanie #1
Jak przyspieszyć Magento – rozwiązanie #2
Które rozwiązanie wybrać?
Jak przyspieszyć Magento? – podsumowanie
Jak przyspieszyć działanie Magento?
Jak zawsze, na samym początku, prosta odpowiedź. Mamy dwa rozwiązania. Pierwsze to jest naprawdę duży kaliber, drugie trochę mniejszy.
Pierwszym rozwiązaniem jest wdrożenie nowego front-endu, który będzie bazował na Hyvie. Jeśli chodzi o to ile kosztuje wdrożenie Hyvy, należy w to zainwestować od 780 do 1070 godzin, więc jest to dosyć dużo. Natomiast wtedy możemy liczyć na wyniki w wersji mobilnej w okolicach 90 oraz w wersji desktopowej w okolicach 95.
Drugie rozwiązanie jest mniejszego kalibru. Jeśli mamy obecnie front-end na Magento, który bazuje na Lumie, możemy wykonać cztery działania, które łącznie będą kosztowały około 60-80 godzin pracy programisty. Powinno nam się udać osiągnąć wyniki rzędu 90 na wersji desktop i około 45-47 na wersji mobile.
To tyle dla tych mniej zainteresowanych tematem, którzy chcieli po prostu mieć szybką odpowiedź na to pytanie. Zachęcam tych, którzy chcą i dowiedzieć się o większej liczbie szczegółów, do czytania dalej.
Co oznaczają wyniki na Google PageSpeed?
Przede wszystkim zacznijmy od tego, że wyniki na Google PageSpeed nie oznaczają, paradoksalnie, czy witryna będzie dla użytkowników działać szybciej czy też nie. A dokładniej mówiąć czy w ich odczuciu witryna będzie działać szybciej. To jest prawidłowe określenie całej sytuacji.
Oczywiście witryna będzie działać szybciej, ale to nie jest tak, że podniesienie wyników na Google PageSpeed do 100 na mobile i 100 na desktop sprawi, że witryna będzie działać szybciej. No, to oczywiście nie działa w taki sposób. Wszystkim zależymy na tym, aby wyniki Google PageSpeed były jak najwyższe, ponieważ ułatwia to pozycjonowanie witryny, przyciąga więcej ruchu z organica, obniża koszty pozyskania użytkowników i ogólnie czyni biznes bardziej opłacalnym.
Oczywiście, im wyższe wyniki na Google PageSpeed, tym mniejsza jest korelacja, ale zasadniczo wyższy współczynnik konwersji oraz konwersje, które generuje strona internetowa.
Nie ma tu idealnej korelacji, ale wyniki Google PageSpeed wpływają w jakimś stopniu na współczynnik konwersji.
Jak przyspieszyć Magento – rozwiązanie #1
Pierwszym rozwiązaniem jest to, że jeśli mamy obecnie frontend, który w jakiś sposób bazuje na Lumie, czyli to jest albo mocno przerobiona Luma, albo temat zbudowany na Lumie, to możemy całkowicie wymienić ten frontend i zastąpić go Hyvą.
Jak mówiłem w jednym z poprzednich filmów, Hyva to rodzaj frontendu Magento, napisany od samego początku, od podstaw, jako zupełnie nowy typ frontendu Magento. Pojawił się kilka lat temu na rynku jako świeże rozwiązanie. Korzysta z Tailwind CSS oraz Alpine JS, a oprócz tych technologii, kod jest niesamowicie odchudzony.
Dzięki temu, że Hyva jest mniej skomplikowana i ma mniejszą liczbę powiązań, witryna działa szybciej. Zresztą, jak sami twórcy Hyvy mówią, stworzyli ją, aby osiągać jak najwyższe wyniki w Google PageSpeed. Jeśli zależy nam na wynikach Google PageSpeed, to jest to świetne rozwiązanie.
Oczywiście wersje demo Hyvy notują wyniki bliskie 100, około 99 na wersji mobilnej i może 100 na wersji desktopowej. Jeżeli zrobimy projekt customowy, dodamy trochę modułów oraz zmienimy sposób działania frontendu, wyniki pogorszą się, ale nadal dają nam możliwość osiągnięcia produkcyjnych przebiegów na poziomie około 95 w wersji desktop i powyżej 90 w wersji mobile.
Jakie są minusy tego rozwiązania? Inwestycja. Naprawdę zmiana całego frontendu, łącznie z całym project managementem, wykonywaniem testów i przygotowaniem nowych projektów graficznych, będzie inwestycją rzędu 780 do 1070 godzin i ciężko będzie nam to zrobić w mniejszym budżecie.
Oprócz tego za samą licencję Hyvy trzeba będzie zapłacić w tym momencie 1000 euro, co sprawia, że ten budżet ma swoją pojemność.
Oczywiście przy okazji wdrażania nowego frontendu możemy też poprawić współczynnik konwersji e-commerce. Jeśli myślimy o redesignie, a nadal pozostajemy na Magento, podniesiemy ten współczynnik konwersji o 40% lub nawet tylko o 30%, to inwestycja w Hyvę przy większej skali biznesu bardzo szybko nam się zwróci.
A jeśli chcesz wykorzystać Hyvę do swojego Magento 2 – pogadajmy!
Jak przyspieszyć Magento – rozwiązanie #2
Drugim rozwiązaniem problemu jest podjęcie działań zmierzających do optymalizacji samej Lumy. To nie jest idealne rozwiązanie, ponieważ nie będzie ono wytrzymywać następnych pięciu lat. Poza tym wymagania Google’a dotyczące sposobu działania witryny będą coraz wyższe.
No, umówmy się, Luma była całkiem stara, gdy wychodziła na rynek. Więc, co możemy zrobić? Możemy zrobić taki zestaw, combo, powiedzmy, czterech działań, które mogą sprowadzić się do czterech punktów.
- Pierwszym punktem jest odchudzenie Magento z niepotrzebnych paczek PHP, które nadmiernie obciążają całość.
- Drugą rzeczą jest wdrożenie modułu do blokowania i optymalizacji JS-ów.
- Trzecią rzeczą jest wdrożenie modułów do obsługi obrazu w formacie WebP.
- Ostatnią rzeczą jest skonfigurowanie i usprawnienie lazy load’a, czyli TclPath’a, przenoszenia JS, aby nie blokować HEDL-a. Oczywiście minifikacja HTML, JS i CSS. Jeżeli zrobimy tę samą paczkę, to możemy liczyć na wyniki na Lumie i produkcyjnie działającym serwisie w wersji desktopowej około 85, a w wersji mobilnej około 45-47.
No i teraz pytanie brzmi, czy da się osiągnąć lepsze wyniki z Lumą? Prawdę mówiąc, będzie to naprawdę trudne. Temat Lumy jest już bardzo trudny. No, i jak mówiłem, korzysta z dosyć starych technologii. W efekcie będzie trudno nam poprawić ten wynik w Google PageSpeed o więcej niż o te dane, o których wspomniałem.
Które rozwiązanie wybrać?
Więc mamy dwa rozwiązania.
Powiedziałbym, że temat optymalizacji Lumy jest rozwiązaniem tymczasowym, które wystarczy nam na szybko. Jeśli więc potrzebujemy coś zrobić szybko, poprawić wyniki, bo mamy obecnie np. 10 na wersji mobilnej i 50 na wersji desktopowej, to są to dobre działania.
Inwestycja wymagająca od programisty 60-80 godzin pracy nie jest duża, a przyniesie znaczną poprawę.
Jeżeli szukamy trwałego rozwiązania, które całkowicie odmieni wyniki w Google PageSpeedzie, to wdrożenie Hyvy jest najlepszym rozwiązaniem. Jest to świetny wybór zarówno dla sklepu B2C oraz platformy B2B.
Na sam koniec jedno słowo na temat rozwiązań zgodnych z PWA, to znaczy wdrożenia PWA Studio albo coś, co bazuje na Vue Storefront.
Są to rozwiązania, które w swojej definicji powinny być szybkie. W czasie swojej przygody z Magento widziałem bardzo dużo wdrożeń na tych dwóch technologiach, które zdecydowanie gorzej performowały w ocenie Google PageSpeed niż Luma. Więc nie jest tak, że wdrożenie tej technologii daje nam gwarancję szybkości.
W tych technologiach dosyć łatwo jest wdrożyć sklep, który będzie po prostu wolny. Natomiast budżet zdecydowanie przekroczy wdrożenie Hyvy i oczywiście zajmie więcej niż 60 lub 80 godzin, które trzeba przeznaczyć na optymalizację Lumy.
Jak przyspieszyć Magento? – podsumowanie
Podsumowując, co możemy zrobić, aby poprawić wyniki w Google PageSpeed.
Przykładowo mamy obecnie taki problem, że w ocenie Google PageSpeed na mobile mamy około 10 punktów, a na desktopie około 50 punktów. Bazujemy na starej Lumie i nasz frontend jest zbudowany na jej podstawie.
Co możemy zrobić? No, mamy dwa sprawdzone wyjścia. Pierwsze to po prostu wdrożenie zupełnie nowego frontendu, który będzie oparty na Hyvie. Będzie wiązało się to z inwestycją od kilkuset do około 1000 godzin, które są potrzebne do zaprojektowania nowego frontendu, wdrożenia go oraz zarządzania całym procesem i projektem.
Drugim rozwiązaniem jest po prostu optymalizacja Lumy, według czterech kroków, o których wspomniałem. Będzie to zdecydowanie mniejsza inwestycja, ponieważ będzie wiązała się z wydatkiem rzędu 60-80 godzin pracy programisty.
Mamy nadzieję, że udało mi się przekonać Cię do przetestowania tych rozwiązań! Jeśli wiedzę zawartą w tym artykule uważasz za wartościową to koniecznie sprawdź wpis na naszym blogu mówiący o tym jak często aktualizować Magento oraz ile taka operacja kosztuje!
Jeżeli zależy Ci na kolejnych porcjach wartościowej wiedzy – już teraz zapraszam Cię do śledzenia mojego profilu LinkedIn, na którym regularnie publikuje informacje ze świata Magento i ecommerce developmentu!
