Shopware 6 Wydajność i szybkość

Nasze najlepsze wtyczki Shopware do szybkości sklepu

Trzy wtyczki i kolejność według wagi, a nie według widoczności.

Dobry wynik PageSpeed to nie szybki sklep, bo Lighthouse mierzy laboratorium, a wasz klient przeżywa coś odwrotnego. A największa waga jest niemal zawsze ta sama: zdjęcia.

Problem

Brzmi znajomo?

Wynik, który mierzy coś innego

95 w laboratorium, wolno w rzeczywistości. Wynik nie mierzy tego, co przeżywa wasz klient.

Zdjęcia zapychające łącze

Jedno niezoptymalizowane zdjęcie waży więcej niż cały wasz CSS.

Skrypty w złym miejscu

Skrypt marketingowy na początku strony blokuje renderowanie, nawet jeśli przydaje się później.

Strojenie drobiazgów przed wagą

Optymalizować milisekundy, podczas gdy megabajty pozostają nietknięte.

Krótka lista

Nasz wybór w rankingu

Każdy moduł poniżej jest budowany, utrzymywany i wspierany przez nasz zespół. Ranking odzwierciedla to, co zainstalowalibyśmy najpierw w sklepie klienta.

  1. WebP, AVIF, dobre wymiarowanie, CDN. Zdjęcie produktu często waży więcej niż cały wasz CSS.

    Natywna optymalizacja obrazów dla Shopware 6.6 i 6.7. Automatyczne generowanie WebP i AVIF obok każdego obrazu, rekompresja JPEG i PNG bez widocznej straty, usuwanie…

  2. Każdy snippet, który dodaliście, gdzieś się ładuje. Zobaczyć, który, i umieścić go we właściwym miejscu, a nie wszędzie.

    Wstrzykuj i porządkuj swoje snippety CSS i JavaScript wprost w kompilacji motywu Shopware 6. Wbudowany edytor kodu, kontenery per sales channel, historia wersji, biblioteka…

  3. PWA cache'uje to, co się nie zmienia, i nagradza powracającego odwiedzającego. Nie pierwsze wrażenie, tylko powrót.

    Zamień swój sklep Shopware 6.5, 6.6 i 6.7 w instalowalną PWA (dynamiczny manifest i service worker, strona offline, baner instalacji) i wysyłaj powiadomienia Web…

Porównanie obok siebie

Dobry wynik PageSpeed to nie szybki sklep

To pułapka, w którą wpadają wszyscy. Lighthouse mierzy stronę laboratoryjną, na symulowanym łączu, bez waszych cookies, bez skryptu zgody i bez waszych tagów marketingowych. Wasz klient przeżywa coś odwrotnego: prawdziwy telefon, obciążoną sieć i wszystkie skrypty naraz.

A największa waga jest niemal zawsze ta sama

Zdjęcia. Nie wasz motyw i nie Shopware. Jedno niezoptymalizowane zdjęcie produktu waży więcej niż cały wasz CSS. Zanim tkniecie cokolwiek innego, zważcie to, co naprawdę idzie po łączu.

A właściwa kolejność nie jest ta, o której się myśli

Najpierw zdjęcia, czyli największa waga. Potem skrypty, które sami dodaliście. I dopiero potem strojenie drobiazgów. W drugą stronę optymalizujecie milisekundy, ignorując megabajty.

Przewodnik zakupowy

Jak wybrać

Najpierw przestańcie wierzyć wynikowi

Dobry wynik PageSpeed to nie szybki sklep. Lighthouse mierzy laboratorium: symulowane łącze, bez waszych cookies, bez skryptu zgody i bez tagów. Wasz klient przeżywa coś odwrotnego. Mierzcie na prawdziwym urządzeniu i w prawdziwej sieci, czyli tam, gdzie się sprzedaje.

Potem zdjęcia, czyli największa waga

Jedno niezoptymalizowane zdjęcie produktu często waży więcej niż cały wasz CSS. WebP i AVIF, dobrze wymiarowane, z CDN: to tam jest największy zysk, i nic nie kosztuje w jakości.

Potem to, co sami dodaliście

Każdy skrypt marketingowy i każdy snippet gdzieś się ładuje, często w złym miejscu, gdzie blokuje renderowanie. Kontrolowanie, gdzie i kiedy się uruchamiają, bywa silniejsze niż jakakolwiek optymalizacja motywu.

A PWA nagradza tego, kto zostaje

Nie przyspiesza pierwszej wizyty, tylko drugą stronę: cache czyni powrót niemal natychmiastowym. Idzie ostatnia, bo pierwsze wrażenie rozgrywa się na zdjęciach.

Co zyskujesz

Zdjęcia, które nie zapychają już łącza

WebP i AVIF, dobrze wymiarowane, z CDN. Najpierw największa waga, a nie to, co najbardziej widać.

Kontrola nad tym, co sami dodaliście

Każdy skrypt, który dodaliście, gdzieś się ładuje. Zobaczyć, który, i kiedy się uruchamia.

Skrypty we właściwym miejscu, a nie wszędzie

Snippet na końcu strony nie blokuje renderowania jej początku. Miejsce ma znaczenie.

Druga strona, natychmiastowa

PWA zamienia drugą stronę w stronę natychmiastową. Cache pracuje dla powracającego odwiedzającego.

Właściwy wskaźnik

Nie wynik Lighthouse. Czas do pierwszego widocznego produktu jest liczbą, która sprzedaje.

Właściwa kolejność

Ważycie przed optymalizacją. Najpierw megabajty, potem milisekundy.

Wdrożenie

Od instalacji do efektów

  1. Przestańcie wierzyć wynikowi

    Lighthouse mierzy laboratorium. Mierzcie na prawdziwym urządzeniu i w prawdziwej sieci.

  2. Najpierw zważcie zdjęcia

    Zdjęcie produktu często waży więcej niż cały wasz CSS.

  3. Zoptymalizujcie największą wagę

    WebP, AVIF, CDN. Ta sama jakość, ułamek wagi.

  4. Kontrolujcie własne skrypty

    Snippet na początku strony blokuje renderowanie. Miejsce ma znaczenie.

  5. Mierzcie właściwą liczbę

    Nie wynik. Czas do pierwszego widocznego produktu.

“Byliśmy dumni z naszych 92 w PageSpeed. Potem przetestowaliśmy na prawdziwym telefonie w pociągu: osiem sekund do pierwszego zdjęcia. Problemem nigdy nie były skrypty, tylko cztery megabajty zdjęć produktowych na stronę.”

Opinia klienta — Sklep Shopware, moda

Najczęściej zadawane pytania

Mam 95 w PageSpeed, dlaczego mój sklep jest wolny?

Bo Lighthouse mierzy stronę laboratoryjną: symulowane łącze, bez waszych cookies, bez skryptu zgody i bez tagów marketingowych. Wasz klient przeżywa coś odwrotnego: prawdziwy telefon, obciążona sieć, wszystkie skrypty razem. Dobry wynik to dobra wiadomość o laboratorium, a nie o waszym sklepie.

Co najbardziej spowalnia sklep na Shopware?

Niemal zawsze zdjęcia. Jedno niezoptymalizowane zdjęcie produktu często waży więcej niż cały wasz CSS. Zanim poprawicie skrypty albo motyw, zważcie to, co idzie po łączu, a zobaczycie, gdzie są megabajty.

Czy tracę na jakości przy WebP albo AVIF?

Nie. WebP i AVIF to nowsze formaty: ta sama jakość, ułamek wagi. Wersja zapasowa obsługuje bardzo stare przeglądarki. Zysk jest realny i nic nie kosztuje w jakości obrazu.

Dlaczego umiejscowienie skryptów ma znaczenie?

Bo skrypt uruchamiający się na początku strony blokuje renderowanie, nawet jeśli przydaje się dopiero na końcu. Kontrolowanie, gdzie i kiedy uruchamiają się snippety, jest często skuteczniejsze niż zmniejszanie samego skryptu.

Do czego służy PWA przy szybkości?

Dla powracającego odwiedzającego. PWA cache'uje to, co się nie zmienia, i czyni drugą stronę niemal natychmiastową. Nie przyspiesza pierwszej wizyty, tylko nagradza tego, kto zostaje i dalej klika.

Który wskaźnik śledzić?

Czas do pierwszego widocznego produktu, a nie wynik Lighthouse. Klient nie czeka na pełne załadowanie, tylko na zobaczenie swojego produktu. Mierzcie to, na prawdziwym urządzeniu i w prawdziwej sieci.

Od czego zacząć?

Od zdjęć, bo są największą wagą. Potem skrypty, które sami dodaliście. PWA na końcu, bo poprawia powrót, a nie pierwsze wrażenie. Kolejność według wagi, a nie według widoczności.

Ta potrzeba na innych platformach

Nie wiesz, który pasuje do Twojego sklepu?

Napisz nam swój kontekst, odpowiemy prostą rekomendacją, a nie ofertą sprzedaży.