IMPACT STORY

Błyskawiczny frontend dla e-delikatesów – przewaga konkurencyjna dzięki szybkości

Czas ładowania strony głównej skrócony z 8 do 1,3 sekundy dla wyświetlenia pełnej treści i do 3 sekund do uzyskania pełnej interaktywności – włącznie z ładowaniem ukrytych obszarów strony.

Screenshot 2020-04-03 at 11.25.24

Klient

Jeden z największych podmiotów na polskim rynku e-commerce, notujący dwucyfrowy wzrost sprzedaży przy rocznych obrotach ponad 30 mln zł.

Potrzeba

Budowa przewagi konkurencyjnej na polskim rynku e-grocery i zwiększanie wolumenu sprzedaży o 40 procent rok do roku. Poprawa działania e-sklepu.

Wyzwanie

Stworzenie nowej architektury frontendu, która:

    • znacznie przyspieszy pierwsze załadowanie strony (trwało wówczas 8 sekund) przy zachowaniu zdjęć bardzo dobrej jakości,
    • znacząco przyspieszy nawigację w sklepie,
    • poprawi SEO,
    • umożliwi szybkie przebudowy, generujące mniejszą liczbę błędów,
    • zmniejszy uzależnienie działu marketingu od IT, dzięki ułatwieniu tworzenia nowych stron w CMS.

Rozwiązanie

Po przeprowadzeniu audytu zarekomendowaliśmy oparcie nowego frontendu na nowoczesnych, szybkich technologiach – React.js, ClojureScript oraz DataScript. Stworzona i rozwijana przez m.in. programistów Facebooka biblioteka React.js świetnie sprawdza się w tworzeniu dużych serwisów, które korzystają z dynamicznie zmieniających się danych. 

– Struktura nowego frontendu przypomina kafelki. Można dowolnie zmieniać położenie slidera, wyszukiwarki czy pola z polecanymi produktami. Powszechnie stosowane „silniki” e-commerce nie oferuje takiej swobody – mówi Michał Stachurski, lider działu R&D w Retailic.

Wykorzystanie React.js w połączeniu z przebudową struktury e-sklepu poprawiło także widoczność sklepu w wynikach wyszukiwania. Wcześniej nie wszystkie dane były indeksowane przez roboty Google. Aby skrócić czas ładowania strony głównej, Retailic opóźnił moment wczytywania skryptów zbierających dane o użytkownikach – odbywa się to dopiero po wyświetleniu elementów wizualnych. W ten sposób pogodzono cele konsumentów i sklepu: użytkownicy mogą szybciej przystąpić do zapoznawania się z ofertą, a Klient nadal zbiera potrzebne dane.

Rezultaty

Wdrożenie nowego frontendu pozwoliło zrealizować wszystkie założone cele. Czas ładowania strony głównej skrócił się z 8 do 1,5 sekundy (w 2020 roku: 1,3 sekundy) przy zachowaniu zdjęć wysokiej jakości (strona „waży” około 8 megabajtów – to dużo!). Dział marketingu zyskał dużo większą samodzielność i tworzy większość stron contentowych zupełnie samodzielnie z poziomu CMS (systemu zarządzania treścią).

– Korzyści ze zmniejszenia narzutu komunikacyjnego i skrócenia czasu tworzenia akcji promocyjnych wykraczają poza zwykłe oszczędności – twierdzi koordynator e-commerce Klienta – Widzimy bardzo dużą wartość w tym, że nasza organizacja stała się zwinniejsza, a dział marketingu może skoncentrować się na realizacji kluczowych zadań.

Dzięki nowej architekturze frontendu firma może w bardziej elastyczny sposób prowadzić działania testowe i zarządzać doświadczeniami swoich odbiorców. Rozwój sklepu przyspieszył. Zamiast wprowadzania dużych i długotrwałych zmian, każdego dnia modyfikowane są niewielkie fragmenty sklepu, co w efekcie daje regularną poprawę wskaźników i wyników sklepu, przy jednoczesnym zmniejszeniu ryzyka nieefektywnych decyzji projektowych.

We've been working with Retailic for almost 6 years now. They significantly improved our frontend and customer experience. They also provided us with efficient e-commerce tools that help us delivering additional shopping comfort to our customers.
Grzegorz Bielecki
Chief Operating Officer at Frisco S.A. (Eurocash Group)

Newsletter Retailic

Dołącz do grona najlepiej poinformowanych!

ODKRYJ INNE
Poprawa efektywności sprzedaży w salonach mody damskiej, dzięki oparciu pro…
Sprzedaż online gwałtownie zmienia swój charakter. Konieczne jest wprowadze…
“If you want to spin up a relatively fast developer-friendly cloud server f…