Pierwszym krokiem do poprawy wskaźników internetowych witryny jest zebranie danych na ich temat. Kompleksowa analiza obejmuje dane o skuteczności zebrane zarówno w środowisku rzeczywistym, jak i laboratoryjnym. Pomiar podstawowych wskaźników internetowych wymaga minimalnych zmian w kodzie i może być przeprowadzany za pomocą bezpłatnych narzędzi.
Mierzenie wskaźników internetowych za pomocą danych RUM
Dane monitorowania rzeczywistych użytkowników (RUM), zwane też danymi z pól, odzwierciedlają wydajność, jaką odczuwają prawdziwi użytkownicy witryny. Dane RUM są wykorzystywane przez Google do określania, czy witryna spełnia zalecane wartości progowe podstawowych wskaźników internetowych.
Pierwsze kroki
Jeśli nie masz skonfigurowanego monitorowania rzeczywistych użytkowników, poniższe narzędzia szybko dostarczą Ci danych o rzeczywistej wydajności Twojej witryny. Wszystkie te narzędzia są oparte na tym samym zbiorze danych (Raporcie na temat użytkowania Chrome), ale mają nieco inne zastosowania:
- Narzędzia deweloperskie w Chrome są zintegrowane z zestawem danych CrUX w widoku danych na żywo na panelu Wydajność. Porównując lokalne wrażenia z wrażeniami prawdziwych użytkowników na tej samej stronie, możesz podjąć bardziej świadomą decyzję o tym, na czym skupić się podczas debugowania. Jeśli szukasz jednej czynności, którą możesz wykonać, aby rozpocząć pomiary i ulepszanie wskaźników internetowych witryny, zalecamy użycie panelu Wydajność w Narzędziach deweloperskich w Chrome.
- PageSpeed Insights (PSI) podaje zagregowane dane o skuteczności na poziomie strony i źródła z ostatnich 28 dni. Dodatkowo zawiera sugestie dotyczące poprawy skuteczności. PSI jest dostępny w internecie i jako interfejs API.
- Search Console raportuje dane o skuteczności poszczególnych stron. Dzięki temu doskonale nadaje się do identyfikowania konkretnych stron, które wymagają ulepszenia. W przeciwieństwie do PageSpeed Insights raporty Search Console zawierają dane historyczne dotyczące skuteczności. Search Console można używać tylko w przypadku witryn, których jesteś właścicielem i w przypadku których masz potwierdzone prawo własności.
- CrUX Vis to gotowy panel, który wyświetla dane historyczne raportu na temat użytkowania Chrome dotyczące wybranego adresu URL lub źródła (jeśli są dostępne w zbiorze danych raportu na temat użytkowania Chrome). Jest on oparty na interfejsie CrUX History API, a proces konfiguracji trwa około minuty. W porównaniu z PageSpeed Insights i Search Console CrUX Vis zawiera więcej danych, np. podział LCP, typy nawigacji itp.
- CrUX Vis to panel historyczny, który wyświetla dane CrUX dotyczące wybranego pochodzenia lub adresu URL. Działa w oparciu o interfejs CrUX History API. W porównaniu z PageSpeed Insights i Search Console raporty CrUX Vis zawierają więcej szczegółów, np. w CrUX Vis dostępne są typy nawigacji oraz dane LCP i RTT.
Warto zauważyć, że chociaż wymienione wcześniej narzędzia dobrze nadają się do „rozpoczęcia” pomiaru podstawowych wskaźników internetowych, mogą być przydatne również w innych kontekstach. Zarówno CrUX, jak i PSI są dostępne jako interfejs API i można ich używać do tworzenia paneli i innych raportów.
Zbieranie danych RUM
Narzędzia oparte na danych z raportu na temat użytkowania Chrome to dobry punkt wyjścia do analizowania wydajności wskaźników internetowych, ale zdecydowanie zalecamy uzupełnienie ich własnymi danymi RUM. Dane RUM, które zbierasz samodzielnie, mogą dostarczać bardziej szczegółowych i natychmiastowych informacji o skuteczności Twojej witryny. Ułatwia to identyfikowanie problemów i testowanie możliwych rozwiązań.
Możesz zbierać własne dane RUM, korzystając z usługi specjalizującej się w RUM lub konfigurując własne narzędzia.
Specjalistyczni dostawcy RUM specjalizują się w zbieraniu i raportowaniu danych RUM. Aby korzystać z Core Web Vitals w tych usługach, zapytaj dostawcę RUM o włączenie monitorowania podstawowych wskaźników internetowych w Twojej witrynie.
Jeśli nie masz dostawcy RUM, możesz rozszerzyć obecną konfigurację analityczną, aby zbierać i raportować te dane, korzystając z web-vitals
biblioteki JavaScript. Ta metoda jest szczegółowo opisana poniżej.
Biblioteka JavaScript web-vitals
Jeśli wdrażasz własną konfigurację RUM dla Podstawowych wskaźników internetowych, najprostszym sposobem zbierania pomiarów tych wskaźników jest użycie biblioteki JavaScript web-vitals
. web-vitals
to mała, modułowa biblioteka (ok. 2 KB), która udostępnia wygodny interfejs API do zbierania i raportowania każdego z mierzalnych w terenie wskaźników internetowych.
Wskaźniki, które składają się na Web Vitals, nie są bezpośrednio udostępniane przez wbudowane w przeglądarkę interfejsy API wydajności, ale są na nich oparte. Na przykład skumulowane przesunięcie układu (CLS) jest implementowane za pomocą interfejsu Layout Instability API. Korzystając z web-vitals
, nie musisz samodzielnie wdrażać tych danych. Zapewnia to też, że zbierane przez Ciebie dane są zgodne z metodologią i sprawdzonymi metodami w przypadku poszczególnych danych.
Więcej informacji o implementowaniu web-vitals
znajdziesz w dokumentacji i w przewodniku Sprawdzone metody pomiaru podstawowych wskaźników internetowych w terenie.
Agregacja danych
Konieczne jest zgłaszanie pomiarów zebranych przez web-vitals
. Jeśli te dane są mierzone, ale nie są raportowane, nigdy ich nie zobaczysz. web-vitals
Dokumentacja zawiera przykłady pokazujące, jak wysyłać dane do ogólnego punktu końcowego interfejsu API, Google Analytics lub Menedżera tagów Google.
Jeśli masz już ulubione narzędzie do raportowania, możesz go użyć. Jeśli nie, możesz bezpłatnie używać Google Analytics.
Zastanawiając się, którego narzędzia użyć, warto pomyśleć o tym, kto będzie potrzebować dostępu do danych. Firmy zwykle osiągają największe sukcesy, gdy cała firma, a nie tylko jeden dział, jest zainteresowana poprawą wyników. Więcej informacji o tym, jak uzyskać poparcie różnych działów, znajdziesz w artykule Rozwiązywanie problemów z szybkością witryny we współpracy z różnymi działami.
Interpretacja danych
Podczas analizowania danych o skuteczności warto zwrócić uwagę na końce rozkładu. Dane RUM często pokazują, że wydajność jest bardzo zróżnicowana – niektórzy użytkownicy mają szybkie połączenie, a inni wolne. Jednak użycie mediany do podsumowania danych może ukryć to zachowanie.
W przypadku Podstawowych wskaźników internetowych Google używa odsetka „dobrych” wrażeń, a nie statystyk takich jak mediana czy średnia, aby określić, czy witryna lub strona spełnia zalecane progi. Aby witryna lub strona została uznana za spełniającą progi podstawowych wskaźników internetowych, 75% wizyt na stronie musi spełniać próg „dobrze” w przypadku każdego wskaźnika.
Pomiar wskaźników internetowych za pomocą danych laboratoryjnych
Dane laboratoryjne, zwane też danymi syntetycznymi, są zbierane w kontrolowanym środowisku, a nie od rzeczywistych użytkowników. W przeciwieństwie do danych RUM dane laboratoryjne można zbierać w środowiskach przedprodukcyjnych, a tym samym włączać je do przepływów pracy deweloperów i procesów ciągłej integracji. Przykłady narzędzi, które zbierają dane syntetyczne, to Lighthouse i WebPageTest.
Uwagi
Zawsze będą występować rozbieżności między danymi RUM a danymi laboratoryjnymi, zwłaszcza jeśli warunki sieciowe, typ urządzenia lub lokalizacja środowiska laboratoryjnego znacznie różnią się od warunków, w jakich działają użytkownicy. Jeśli chodzi o zbieranie danych laboratoryjnych dotyczących wskaźników podstawowych, warto pamiętać o kilku kwestiach:
- Największe wyrenderowanie treści (LCP) mierzone w środowiskach laboratoryjnych może się różnić od wartości mierzonych w terenie za pomocą danych RUM z powodu opóźnień w ładowaniu strony (przez przekierowania, opóźnienia w połączeniu z serwerem lub dane niepobrane z pamięci podręcznej), różnej zawartości wyświetlanej różnym użytkownikom w zależności od ekranu lub z innych powodów (w tym banerów z prośbą o zgodę na stosowanie plików cookie czy personalizacji).
- Skumulowane przesunięcie układu (CLS) mierzone w środowiskach laboratoryjnych może być sztucznie niższe niż CLS obserwowane w danych RUM. Wiele narzędzi laboratoryjnych tylko wczytuje stronę, ale nie wchodzi z nią w interakcję. W efekcie rejestrują one tylko przesunięcia układu, które występują podczas początkowego wczytywania strony. Natomiast CLS mierzony przez narzędzia RUM rejestruje nieoczekiwane przesunięcia układu, które występują w całym okresie działania strony.
- Interakcji do kolejnego wyrenderowania (INP) nie można mierzyć w środowiskach laboratoryjnych, ponieważ wymaga ona interakcji użytkownika ze stroną. Dlatego Total Blocking Time (TBT) jest zalecanym wskaźnikiem laboratoryjnym dla INP. TBT mierzy „całkowity czas między pierwszym wyrenderowaniem treści a czasem do pełnej interaktywności, w którym strona jest zablokowana i nie może reagować na dane wejściowe użytkownika”. Chociaż INP i TBT są obliczane w różny sposób, oba te wskaźniki odzwierciedlają zablokowanie wątku głównego podczas procesu uruchamiania. Gdy główny wątek jest zablokowany, przeglądarka z opóźnieniem reaguje na interakcje użytkownika.
Narzędzia
Do zbierania pomiarów w warunkach laboratoryjnych dotyczących podstawowych wskaźników internetowych można używać tych narzędzi:
- Narzędzia deweloperskie w Chrome mierzą i raportują podstawowe wskaźniki internetowe danej strony w widoku danych na żywo na panelu Wydajność. Ten widok zapewnia programistom informacje zwrotne o wydajności w czasie rzeczywistym podczas wprowadzania zmian w kodzie.
- Lighthouse – raporty Lighthouse zawierają informacje o LCP, CLS i TBT, a także wskazują możliwe ulepszenia wydajności. Lighthouse jest dostępny w Narzędziach deweloperskich w Chrome jako pakiet npm. Można go też włączyć do przepływów pracy ciągłej integracji za pomocą Lighthouse CI.
- WebPageTest uwzględnia podstawowe wskaźniki internetowe w ramach standardowego raportowania. WebPageTest przydaje się do zbierania informacji o podstawowych wskaźnikach internetowych w określonych warunkach urządzenia i sieci.