Jak Sprawdzić Prędkość Witryny

Opublikowany dnia: 2020-06-08
Przeczytano: 1041
Autor: Barbarella
Opublikowany w kategorii: SEO

Nauka sprawdzania szybkości witryny nie musi być zniechęcająca. Ten krótki przewodnik zawiera podstawowe informacje i wskazuje właściwy kierunek.

Nie ma jednej miary

Pierwszą rzeczą do zrozumienia jest to, że nie ma jednej miary lub pomiaru dla „prędkości”. Nie ma prostej liczby, której można użyć do zmierzenia szybkości ładowania stron.

Zastanów się, co się stanie, gdy załadujesz stronę internetową. Istnieje  wiele  różnych etapów i wiele różnych części, które można zmierzyć. Jeśli połączenie sieciowe jest wolne, ale obrazy ładują się szybko, jak „szybka” jest strona? A może na odwrót?

Nawet jeśli spróbujesz uprościć to wszystko do czegoś takiego jak „ czas potrzebny do pełnego załadowania ”, nadal trudno jest podać tę przydatną liczbę.

Na przykład strona, której „ładowanie” trwa dłużej, może zapewnić funkcjonalną „lekką” wersję, podczas gdy cała strona wciąż pobiera się w tle. Czy jest to „szybsze” lub „wolniejsze” niż strona internetowa, która ładuje się szybciej, ale której nie mogę użyć, dopóki się nie załaduje?

Odpowiedź brzmi: „to zależy” i istnieje wiele różnych sposobów, w jakie możemy myśleć lub mierzyć „szybkość witryny” .

Zrozumienie procesu ładowania

Od momentu kliknięcia linku (lub naciśnięcia klawisza „enter” na pasku adresu URL) rozpoczyna się proces ładowania żądanej strony.

Ten proces składa się z wielu kroków, ale można je pogrupować w szerokie etapy, które wyglądają mniej więcej tak:

Chociaż dokumentacja Google może być nieco ambitna co do terminów tych etapów, model jest pomocny. Zasadniczo proces ten można opisać jako trzy etapy ładowania.

1. Rzeczy sieciowe

Po pierwsze, fizyczny sprzęt urządzenia musi połączyć się z Internetem. Zwykle obejmuje to przenoszenie danych przez transatlantyckie kable światłowodowe. Oznacza to, że ogranicza Cię prędkość światła i szybkość przetwarzania informacji przez urządzenie.

Trudno zmierzyć lub wpłynąć na tę część procesu!

2. Rzeczy na serwerze

Tutaj urządzenie prosi serwer o stronę, a serwer przygotowuje i zwraca odpowiedź.

Ta sekcja może być nieco techniczna, ponieważ koncentruje się na wydajności sprzętu serwera, baz danych i skryptów. Może być konieczne zwrócenie się o pomoc do swojego dostawcy hostingu lub zespołu technicznego.

Możemy zmierzyć wydajność serwera za pomocą narzędzi takich jak NewRelic  lub DataDog , które monitorują zachowanie Twojej witryny i reagują „od wewnątrz”.

Dostarczą wykresy i dane dotyczące takich rzeczy, jak  powolne zapytania do bazy danych i  powolne skrypty . Uzbrojony w te informacje, możesz lepiej zrozumieć, czy Twój hosting jest do zera i jeśli musisz wprowadzić zmiany w kodzie w temacie / wtyczkach / skryptach.

WordPress ma również świetne wtyczki do przeprowadzania tego rodzaju analiz - jestem wielkim fanem Query Monitor . Zapewnia to świetny wgląd w to, które elementy WordPressa mogą cię spowalniać - niezależnie od tego, czy są to Twoje motywy, wtyczki lub środowiska.

3. Przeglądarka

Na tym etapie strona musi zostać zbudowana, ułożona, pokolorowana i wyświetlona. Sposób wczytywania obrazów, przetwarzanie JavaScript i CSS oraz każdy pojedynczy znacznik HTML na stronie wpływa na szybkość ładowania.

Możemy monitorować część tego z poziomu „na zewnątrz” za pomocą narzędzi, które skanują stronę internetową i mierzą, jak się ładuje. Zalecamy korzystanie z wielu narzędzi, ponieważ mierzą one różne rzeczy i są przydatne do różnych ocen. Na przykład:

• WebPageTest  doskonale nadaje się do zapewnienia widoku „wodospadu” witryny oraz sposobu ładowania wszystkich zasobów.
• Google PageSpeed ​​Insights  jest nieco uproszczony, ale zapewnia „rzeczywiste dane użytkownika” Twojej witryny, prosto z Google.
• Lighthouse for Chrome  zapewnia niezwykle wyrafinowaną analizę wydajności i zachowania strony, ale może być trudna do strawienia!
• Konsola programisty Chrome  pokazuje dokładnie, co dzieje się podczas ładowania witryny na komputerze w przeglądarce.
• Raport prędkości w Google Search Console pokazuje, jak szybko lub wolno ładują się Twoje strony w danym czasie.

Tego rodzaju narzędzia doskonale nadają się do wykrywania takich rzeczy, jak obrazy, które należy zoptymalizować, gdzie CSS lub JavaScript działają wolno lub gdy czekasz na załadowanie zasobów z innych domen.

Uniwersalne wskaźniki

Mimo tych wszystkich ruchomych części, nie  są kilka uniwersalnych metryki, które mają sens dla wszystkich witryn do pomiaru i optymalizacji dla. To są:

• Czas do pierwszego bajtu , czyli ile czasu zajmuje serwerowi odpowiedź pewnymi informacjami. Nawet jeśli Twój fronton płonie szybko, to Cię utrzyma. Mierz za pomocą Query Monitor lub NewRelic .
• Czas do pierwszej zadowalającej (i znaczącej) farby , czyli ile czasu zajmuje wyświetlenie kluczowych treści wizualnych (np. Obrazu bohatera lub nagłówka strony) na ekranie. Mierz za pomocą  Lighthouse for Chrome .
• Czas do interaktywności , czyli tyle, ile czasu potrzeba, aby doświadczenie było widoczne, i zareaguj na mój wkład. Mierz za pomocą  Lighthouse for Chrome .

Są to znacznie bardziej wyrafinowane wskaźniki niż „ile czasu zajęło załadowanie” i, co ważniejsze, koncentrują się na użytkowniku. Poprawa tych wskaźników powinna bezpośrednio korelować z satysfakcją użytkownika, co jest bardzo ważne dla SEO .

Możesz przeczytać więcej o tych danych w dokumentacji Google .

Zawinięcie tego w proces

1. Użyj narzędzia „na zewnątrz”, takiego jak WebPageTest,  aby wygenerować schemat wodospadu, w jaki sposób strona się ładuje.
2. Zidentyfikuj wąskie gardła z serwerami  i zapleczem.  Szukaj wolnego czasu połączenia, powolnego uzgadniania protokołu SSL i powolnego wyszukiwania DNS. Użyj wtyczki, takiej jak Query Monitor , lub usługi takiej jak NewRelic,  aby zdiagnozować problemy. Wprowadź zmiany w serwerze, sprzęcie, oprogramowaniu i skrypcie.
3. Zidentyfikuj wąskie gardła za pomocą  interfejsu . Szukaj wolnego czasu ładowania i przetwarzania obrazów, skryptów i arkuszy stylów. Skorzystaj z narzędzia, takiego jak  Google PageSpeed ​​Insights  lub Lighthouse for Chrome,  aby uzyskać sugestie dotyczące usprawnienia ładowania strony.
4. Użyj  Lighthouse for Chrome,  aby zmierzyć swoje kluczowe parametry , takie jak  czas do pierwszej znaczącej farby i czas do interaktywnej .