„Masz za dużo wtyczek” to najczęstsza diagnoza, jaką słyszy właściciel wolnego sklepu. Zwykle jest nietrafiona. Przejrzeliśmy czterdzieści sklepów, które trafiły do nas na audyt w ciągu ostatniego roku, i liczba wtyczek okazała się kiepskim wskaźnikiem czegokolwiek.
Co zobaczyliśmy
Najszybszy sklep w zestawieniu miał 34 wtyczki i czas do pierwszego bajtu poniżej 300 ms. Najwolniejszy miał 11 i ładował się ponad cztery sekundy.
Różnica nie brała się z liczby, tylko z tego, co te wtyczki robiły. Jedenaście wtyczek, z których dwie odpytywały zewnętrzne API przy każdym wczytaniu strony, zabiło sklep skuteczniej niż trzydzieści cztery, które siedziały cicho.
Trzy rzeczy, które faktycznie spowalniają
1. Zapytania do zewnętrznych usług przy renderowaniu strony
Wtyczka, która przy każdym wczytaniu sprawdza kurs waluty, stan magazynu w hurtowni albo ważność licencji, dokłada do czasu odpowiedzi tyle, ile zajmie odpowiedź cudzego serwera. Jeśli ten serwer ma gorszy dzień, ma go też Twój sklep.
To jeden z powodów, dla których nasze wtyczki nie łączą się z niczym na zewnątrz.
2. Zapytania do bazy w pętli
Wtyczka wyświetlająca odznakę przy każdym produkcie potrafi wykonać osobne zapytanie dla każdej pozycji w katalogu. Przy dwunastu produktach na stronie to dwanaście dodatkowych zapytań zamiast jednego.
Sprawdzisz to wtyczką Query Monitor — zakładka „Queries”, sortowanie po komponencie.
3. Skrypty ładowane wszędzie
Wtyczka do formularzy kontaktowych, która ładuje swój JavaScript i CSS na każdej podstronie, w tym na kartach produktów, gdzie nie ma żadnego formularza. Kilkanaście kilobajtów razy każda odsłona.
Jak to sprawdzić u siebie
- Zainstaluj Query Monitor i otwórz kartę produktu.
- Zobacz, ile zapytań do bazy generuje strona. Poniżej 60 to dobrze, powyżej 150 warto się przyjrzeć.
- W zakładce „Queries by Component” sprawdź, która wtyczka odpowiada za największą część.
- W „Scripts” i „Styles” poszukaj plików, które nie mają prawa być na tej stronie.
Wniosek
Nie licz wtyczek. Sprawdź, co robią. Sklep z czterdziestoma lekkimi wtyczkami będzie szybszy niż sklep z pięcioma, z których jedna czeka na odpowiedź cudzego API przy każdym wczytaniu strony.