Szybkość motywu Shopify na prawdziwych telefonach
Praca nad szybkością w Shopify ma przewidywalny przebieg: zespoły optymalizują Liquid, spierają się o motyw i zostawiają obraz główny w rozmiarze czterokrotnie większym niż renderowany oraz jedenaście skryptów zewnętrznych ładujących się przed wyrenderowaniem strony.
Najpierw zmierz, potem naprawiaj w kolejności, która się opłaca.
Gdzie faktycznie ucieka czas#
| Przyczyna | Typowy udział w problemie | Trudność naprawy |
|---|---|---|
| Zbyt duże lub nieoptymalizowane obrazy | Duży | Łatwa |
| Skrypty zewnętrzne i aplikacji | Duży | Średnia — polityczna, nie techniczna |
| Czcionki webowe | Umiarkowany | Łatwa |
| Ciężkie suwaki i sekcje wideo w hero | Umiarkowany | Łatwa, jeśli uda się wygrać dyskusję |
| Renderowanie Liquid | Mały | Średnia |
Kolejność pracy#
- Mierz na telefonie średniej klasy przy prawdziwym połączeniu, nie na laptopie.
- Napraw obrazy: właściwe wymiary, nowoczesny format, lazy-load dla wszystkiego poniżej linii zgięcia.
- Zrób audyt skryptów: usuń nieużywane aplikacje; odrocz wszystko, co nie jest potrzebne do wyrenderowania.
- Ogranicz hero: jeden obraz wygrywa z automatycznie odtwarzanym karuzelą wideo w każdej metryce, która się liczy.
- Ogranicz i wstępnie załaduj czcionki albo używaj czcionek systemowych.
- Dopiero wtedy zajmij się kodem motywu.
Mierz to, co czują klienci#
Largest contentful paint na stronie produktu przez połączenie mobilne to liczba, która koreluje z przychodami. Wyniki syntetyczne są przydatne do wykrywania regresji i fatalne jako cele — sklep może mieć dobry wynik i nadal wydawać się wolny klientowi w pociągu.
Zapisz wartość bazową przed każdą zmianą i po każdej z nich. Bez wartości bazowej praca nad szybkością zamienia się w spór o opinie.
Rozmowa o aplikacjach#
Większość problemów z szybkością to czyjaś ulubiona aplikacja. Przynieś liczby: ta aplikacja kosztuje 400 ms na każdej stronie produktu i używają jej dwie osoby. Taka rozmowa idzie lepiej niż „strona jest wolna" i to ona przynosi prawdziwe korzyści.
Najczęstsze pytania
Czy wybór motywu ma znaczenie dla szybkości?
Mniejsze niż obrazy i skrypty. Dobrze zbudowany motyw pomaga, ale nie przegoni jedenastu skryptów zewnętrznych.
Czy warto gonić za idealnym wynikiem?
Nie. Goń za czasem wyrenderowania strony produktu na telefonie średniej klasy; to właśnie tego doświadczają klienci.
Czy aplikacje naprawdę tyle kosztują?
Te działające po stronie sklepu — tak. Zmierz każdą, wyłączając ją i testując ponownie — liczby zwykle rozstrzygają debatę.
szybkość shopifyszybkość strony shopifywydajność shopifyshopify core web vitalsszybkość motywu shopify
