How Some Developers Fake a 100 Score on Shopify Google PageSpeed

Jak niektórzy deweloperzy fałszują wynik 100 w Shopify Google PageSpeed

Codziennie przeglądamy dziesiątki stron internetowych i dostarczamy bezpłatne zalecenia dotyczące poprawy szybkości ładowania. Dzięki temu regularnie spotykamy się z wszelkiego rodzaju podejściami optymalizacyjnymi — niektórymi uzasadnionymi, a niektórymi wątpliwymi.

Na pierwszy rzut oka, sklep Shopify, który ostatnio analizowaliśmy, wyglądał świetnie. Wszystko wydawało się czyste i profesjonalnie wykonane.

Jednak, kiedy przeprowadziliśmy test wydajności za pomocą Google PageSpeed Insights, wyniki nie były idealne, ale wciąż dość wysokie:

96/100 na urządzeniach mobilnych
98/100 na komputerach stacjonarnych

Na pierwszy rzut oka, może to wydawać się doskonałym wynikiem. Ale kiedy zaczęliśmy dokładniej analizować techniczne ustawienia sklepu Shopify, zauważyliśmy kilka rzeczy, które wzbudziły pytania o to, jak te wyniki zostały osiągnięte.

W tym artykule wyjaśnimy:

• Jak niektórzy deweloperzy sztucznie podwyższają wyniki Shopify PageSpeed
• Dlaczego wynik 100 na Shopify nie zawsze oznacza, że strona jest szybka
• Jak naprawdę wygląda optymalizacja szybkości Shopify

Zrozumienie różnicy między rzeczywistą optymalizacją wydajności a zmanipulowanymi wynikami PageSpeed może pomóc właścicielom sklepów uniknąć kosztownych błędów przy zatrudnianiu programistów lub specjalistów SEO.


Pomiar Webpagetest jest zepsuty. GTmetrix pokazuje ponad 20 sekund, ale wykresy ładowania zasobów pokazują czas około 8 sekund.

Pomiar Webpagetest z błędem

Test GTmetrix

Jeśli weźmiemy pod uwagę, że wynik GTmetrix również obejmuje 17-sekundowe opóźnienie spowodowane przez zewnętrzny skrypt śledzący, wynik nadal wygląda akceptowalnie.

W takich sytuacjach raporty optymalizacyjne zazwyczaj mówią, że strona internetowa jest niemal doskonała i pozostało tylko kilka drobnych ulepszeń — takich jak włączenie serwerowego pusha, dostosowanie ładowania zasobów lub optymalizacja kilku skryptów.

Na pierwszy rzut oka wszystko wydaje się normalne.

Ale prawdziwe pytanie brzmi:

Co tak naprawdę dzieje się za kulisami tego „idealnego wyniku PageSpeed”?

Witaj – Jestem Botem PageSpeed

Przyjrzyjmy się bliżej, co dzieje się, gdy Google PageSpeed Insights (Lighthouse) skanuje stronę internetową.

Kiedy bot Lighthouse otwiera stronę, niekoniecznie widzi dokładnie tę samą wersję strony, którą widzą prawdziwi użytkownicy w swoich przeglądarkach.

Niektórzy programiści celowo konfigurują swoje witryny tak, aby PageSpeed otrzymywał uproszczoną lub zoptymalizowaną wersję strony, podczas gdy zwykli odwiedzający ładują pełną wersję.

Może to sztucznie zwiększyć wyniki wydajności.


Co może widzieć Lighthouse

Kiedy bot PageSpeed ładuje witrynę, może otrzymać minimalną strukturę HTML, taką jak ta:

 

<html>
  <head>
    <title>arsagro</title>
    <style>
      body {
        background: url(/image/templates/mob.jpg);
        background-size: cover;
      }
    
</style>
    <link href="catalog/view/theme/revolution/stylesheet/stylesheet_min.css" rel="stylesheet">
    <style>
      #top2 .search {margin-top: 22px;}
      #top2 #logo {margin-top: 8px;}
    
</style>
    <link href="/catalog/view/theme/default/stylesheet/blog/module.min.css" type="text/css" rel="stylesheet" media="screen" />
    <script src="/catalog/view/javascript/jquery/jquery-2.1.1.min.js"></script>
    <script src="/catalog/view/javascript/jquery/owl-carousel/owl.carousel.min.js"></script>
    <script src="/catalog/view/javascript/revolution/javascript_min.js"></script>
  </head>
  <body>
  </body>
</html>

Ta wersja strony ładuje się niemal natychmiast, ponieważ zawiera tylko niewielką ilość kodu.

W rezultacie PageSpeed może zgłosić bardzo wysokie wskaźniki wydajności.

Co dzieje się za kulisami

W niektórych przypadkach witryny wykrywają, kiedy odwiedzający jest botem PageSpeed lub Lighthouse.

Jeśli żądanie zawiera agenta użytkownika Lighthouse, serwer może odpowiedzieć inną wersją strony, która jest specjalnie zoptymalizowana dla narzędzi testowych.

Przykład logiki stosowanej na niektórych stronach internetowych:

Ta technika sprawia, że strona wydaje się ładować niezwykle szybko w testach wydajności.

Jednakże prawdziwi użytkownicy mogą nadal doświadczać wolniejszych czasów ładowania, ponieważ otrzymują pełną wersję strony ze wszystkimi włączonymi skryptami, aplikacjami i narzędziami śledzącymi.


Dlaczego jest to ważne dla sklepów Shopify

Dla sklepów Shopify optymalizacja wydajności powinna koncentrować się na rzeczywistym doświadczeniu użytkownika, a nie tylko na wynikach testów.

Wysoki wynik Shopify PageSpeed nie oznacza automatycznie, że Twój sklep jest prawidłowo zoptymalizowany.

Prawdziwa optymalizacja Shopify obejmuje:

• redukcję niepotrzebnych aplikacji
• optymalizację obrazów i multimediów
• poprawę struktury kodu motywu
• minimalizowanie wykonywania JavaScriptu
• optymalizację skryptów zewnętrznych

Te ulepszenia wpływają na rzeczywistą wydajność sklepu, a nie tylko na metryki Lighthouse.

Kluczowy wniosek

Jeśli widzisz sklep Shopify z doskonałym wynikiem PageSpeed 100, nie zawsze oznacza to, że strona jest naprawdę zoptymalizowana.

Czasami oznacza to po prostu, że narzędzie testowe otrzymuje inną wersję strony niż prawdziwi odwiedzający.

Oceniając wydajność Shopify, zawsze patrz poza wynik i skup się na rzeczywistym zachowaniu ładowania i doświadczeniu użytkownika.