środa, 28 października, 2020

Jak szybko ładuje się Twój sklep?

-

Jedną z podstawowych metryk, jeśli chodzi o użyteczność Twojego sklepu, jest czas jego ładowania. Im szybciej Twój sklep się załaduje (a dokładniej, im szybciej klient zobaczy Twoją stronę), tym większe prawdopodobieństwo, że zostanie na dłużej i skonwertuje, czyli dokona zakupu.

Według badania przeprowadzonego przez Skilled (źródło: CloudFlare) strony, które ładują się w mniej niż 2.5 sekundy, mają konwersję lepszą o ponad 1.3% od tych, które ładują się w prawie 6 sekund. Jest więc o co walczyć.

Od czego zależy szybkość ładowania strony?

Musimy sobie na początek wyjaśnić, od czego tak naprawdę zależy szybkość ładowania Twojego sklepu. Są to kolejno:

Łącze internetowe Twojego klienta

Jakość połączenia internetowego Twojego klienta ma kolosalny wpływ na ładowanie się strony sklepu. Jeśli Twój klient przebywa właśnie w metrze lub gdzieś daleko na wsi i łączy się przez GPRS, strona Twojego sklepu może się nie załadować, ale nie masz na to kompletnie wpływu – więc nie ma co się przejmować. Warto jednak zdawać sobie z tego sprawę, kiedy ktoś zgłosi, że sklep ładuje się wolno.

Wydajność serwerów, na których masz postawiony sklep oraz łącza internetowego do nich, korzystanie z CDN

Jeśli przeglądarka klienta dotrze już ze swoim żądaniem do Twoich serwerów, musisz odpowiedzieć jak najszybciej to możliwe. Każda zwłoka przełoży się na stracone złotówki. Jeśli masz spory ruch warto zainwestować w CDN (Content Delivery Network), czyli dodatkową usługę, która umieści kopie twojego sklepu w różnych lokalizacjach na świecie, tak aby być jak najbliżej Twoich klientów.

Wydajność urządzania, z którego korzysta Twój klient

To z jakiego urządzenia korzysta Twój klient również ma duży wpływ na ładowanie Twojej strony. Dziś sklepy internetowe to potężne aplikacje, które mają mnóstwo kodu do uruchomienia w przeglądarce – HTML / CSS / Javascript. Słabym telefonom zajmie to dłużej, niż najnowszym modelom iPhone czy Samsung. Ale znów, nie masz na to wpływu.

Konfiguracja serwera m.in. polityka pamięci podręcznej

To w jaki sposób skonfigurowany jest serwer, czyli program, który utrzymuje strony Twojego sklepu, decyduje o tym jak szybko wczytywane będą kolejne podstrony sklepu. Czy za każdym kliknięciem trzeba będzie pobrać wszystkie obrazki od nowa? Czy serwer wykorzystuje pamięć podręczną (z ang. cache)? Czy poprawnie ma skonfigurowane nagłówki HTTP informujące przeglądarkę, które pliki Twojego sklepu trzeba pobrać przy każdym odświeżeniu, a które tylko raz. Jeśli budowałeś swój sklep od podstaw, na te elementy powinieneś zwrócić uwagę programiście, jeśli korzystasz z platformy, oni powinni to wszystko optymalnie poustawiać.

Sposób implementacji sklepu

Zasadnicza kwestia to bebechy Twojego sklepu. Czy zapytania do bazy danych zostały zoptymalizowane? Czy kod JavaScript nie blokuje wyświetlania strony. Czy nie ładujesz zbyt dużo niepotrzebnego CSS’u? Czy obrazki pobierane są w odpowiednim rozmiarze? Jeśli korzystasz z platformy sklepowej, to masz wpływ tylko na te elementy, które dotyczą Twojej skórki oraz dodatków, które zainstalowałeś. Za całą resztę odpowiada platforma. Dobra wiadomość jest taka, że oni zazwyczaj swoją część dobrze realizują.

Liczba i rodzaj dodatków

Dzisiaj każdy sklep korzysta z wielu rodzajów zewnętrznych dodatków. Zaczynając od wtyczek do oddzwaniania, przez wtyczki do pop-upów, kończąc na integracjach z CRM’ami, czatami, analyticsami itp. Każdy dodatek to jedna cegiełka, która obciąża Twój sklep. Warto zastanowić się cz wszystkie są potrzebne i czy nie nakładają się funkcjonalnościami.

Jak sprawdzić szybkość ładowania Twojego sklepu?

Do testowania ładowania stron internetowych mamy dobre i darmowe narzędzia. Wystarczy skorzystać z któregoś z nich, wybraliśmy dla Was 3 najpopularniejsze:

Na początek polecamy Wam PageSpeed Insights od Google. Podpowiemy Wam na co zwrócić uwagę.

Wchodzimy do narzędzia i wprowadzamy adres swojego sklepu. Do naszych celów użyjemy jednego z sklepów testowych Shopera – https://devshop-922627.shoparena.pl/

Ocena ogólna

Otrzymujemy dwa wyniki. Zauważ zakładki „Na komórki” oraz „Na komputery”, osobno bowiem otrzymujesz wyniki do konkretnego typu urządzenia.

Na samej górze widzisz ocenę wydajności. 97/100 dla komputerów stacjonarnych oraz 85/100 dla mobile. Jak widać, w kwestii mobilnej jest pole do poprawy, zwłaszcza, że ruch mobilny na Twoim sklepie, jest z pewnością większy niż ten z komputerów stacjonarnych.

Dane laboratoryjne

Poniżej masz zestawienie kilku „stoperów”. Najważniejszy wskaźnik to „Czas do pełnej interaktywności„, czyli to czas od momentu kliknięcia w link do sklepu do momentu w którym, klient ma w pełni funkcjonalną stronę, na której wszystkie elementy są w pełni załadowane i „obsługiwalne”. Wynik bliższy 3 sekund byłby zapewne zielony.

PageSpeed Insight, Dane laboratoryjne, Na telefon

Możliwości

Dalej macie sekcję Możliwości, to tu Google podpowiada, co można poprawić na stronie, aby zwiększyć jej szybkość ładowania. W badanym przypadku są elementy, które blokują renderowanie (czyli wyświetlanie) strony na ekranie. Tutaj są to elementy CSS, które mogą wymagać optymalizacji

PageSpeed Insight, Możliwości Na telefon

Diagnostyka

Kolejna sekcja – Diagnostyka – również pokazuje, które elementy spowalniały ładowanie. Różnica w stosunku do „Możliwości” polega na tym, że o ile tam Google jasno stwierdził, że to można śmiało poprawić, to tutaj, jedynie informuje, co blokuje stronę i niejako nakazuje raz jeszcze sprawdzić czy oby na pewno tak ma być, jak jest. Zwróćcie uwagę na drugi podpunkt „Wyświetlaj zasoby statyczne, stosując efektywne zasady pamięci podręcznej” to jest właśnie sekcja, która pokazuje, jakie elementy nie muszą być w wcale za każdym razem / często pobierane z serwer, można poprawić ich cachowanie.

PageSpeed Insight, Diagnostyka, Na telefon

Zaliczone audyty

Na końcu badania wyświetlone są audyty, które zostały zaliczone, czyli spełniają wymogi dobrze zoptymalizowanej strony. To są Wasze zwycięstwa!

PageSpeed Insight, Zaliczone audyty, Na telefon

Podsumowanie

W ten prosty i szybki sposób macie możliwość sprawdzenia jak szybko Wasz sklep się ładuje i co można w nim jeszcze poprawić. Jeśli macie programistę, z którym współpracujecie, warto podesłać mu te wyniki, zapewne da się z nimi coś zrobić. Łatwo też sprawdzicie czy wykonał dobrze swoją pracę – po prostu wykonacie ten test ponownie. Miłego testowania!

Mamy 2020!
Rozbrykaj swój sklep na dobre!
Raz w tygodniu dostaniesz od nas konkretną porcję wiedzy: 1 artykuł, 1 szybką poradę, 1 narzędzie.
Mamy 2020!
Rozbrykaj swój sklep na dobre!
Raz w tygodniu dostaniesz od nas konkretną porcję wiedzy: 1 artykuł,
1 szybką poradę,
1 narzędzie.