Te dwie funkcje WebPagetest, których jeszcze nie znałeś - ale powinieneś regularnie z nich korzystać

Jan Hornung Aktualizacja w dniu 21.10.2020 r.
6 Min.
Porównaj strony internetowe z Webpagetest

Webpagetest.org jest prawdopodobnie najlepszym darmowym narzędziem do pomiaru czasu ładowania strony. Ponieważ WebPagetest jest znacznie potężniejszy niż bezpośrednia konkurencja. I to głównie dzięki dwóm funkcjom: Możliwość porównania stron internetowych i porównania długoterminowego.

Ten artykuł jest częścią serii do pomiaru i oceny czasu ładowania stron internetowych. W poprzednich artykułach, które pokazaliśmy:

Dzisiaj pokażę wam dwie funkcje Webpagetestu, których prawdopodobnie jeszcze nie wiedzieliście. Ponieważ narzędzie to jest szczególnie przydatne do porównywania wydajności i ciągłej oceny czasu obciążenia strony.

Dlatego dzisiaj pokażę ci...

Inne kluczowe wskaźniki - Wskaźnik prędkości, elementy DOM i koszt

Oprócz wartości standardowych - jak Start Render, Document Complete etc. - Webpagetest dostarcza również inne użyteczne kluczowe dane, które pozwalają ocenić wydajność Twojej strony. Wartości te są ważne, aby można było prawidłowo interpretować wyniki narzędzia.

Przykładowy wynik testu strony internetowej, który pokazuje ważne rozszerzone parametry
Przykładowy wynik testu strony internetowej. Wskaźnik prędkości, liczba elementów DOM i liczba zgłoszeń to trzy ważne wskaźniki ogólnej wydajności Twojej strony.

Elementy DOM: Element DOM to, z grubsza, moduł HTML. Im mniej Twoja przeglądarka potrzebuje załadować te elementy, tym szczuplejsza i szybsza będzie Twoja strona. Dlatego też liczba elementów DOM jest tylko wskazaniem czasu ładowania strony. Liczba elementów DOM może być znacznie zmniejszona poprzez zmianę Plugins, ale przede wszystkim Theme, .

Wyciąg z kodu źródłowego wpisu na bloguRAIDBOXES
Każdy element korpusu HTML, który jest zamknięty w nawiasach kątowych jest elementem DOM.

Prośby: Ta wartość opisuje liczbę indywidualnych żądań HTTP, które przeglądarka musi wykonać na serwerze WWW. Poszczególne elementy, takie jak pliki CSS, pliki JavaScript lub obrazy, są wymagane za pomocą żądania HTTP. Teoretycznie, im mniej wniosków, tym lepiej. Przy okazji. Wykres wodospadów Twoja strona zawsze ma najlepszy przegląd załadowanych żądań HTTP.

W praktyce jednak rzeczywista liczba wniosków HTTP nie jest aż tak ważna. Przynajmniej nie wtedy, gdy Twoja strona jest zaszyfrowana przez SSL i znajduje się na serwerze z HTTP/2 biegnie. Ponieważ wtedy można wykonać i załadować kilka żądań jednocześnie.

Indeks prędkości: Indeks ten jest obliczany przez Webpagetest i jest wskaźnikiem postrzeganego czasu obciążenia strony. Wartość ta opisuje wartość milisekundową - tak niskie wartości są lepsze od wysokich - co wskazuje jak szybko i sprawnie ładowana jest widoczna zawartość Twojej strony. W zasadzie Webpagetest wykorzystuje zrzuty ekranu z twojej strony internetowej do określenia doświadczenia użytkownika i mierzy je za pomocą wartości czasu. Jeśli jesteś zainteresowany: Webpagetest posiada również Równanie sformułowane.

Podstawa obliczeń wskaźnika prędkości
Indeks prędkości Webpagetest jest wyświetlany i obliczany jako obszar. Im szybciej zawartość strony jest ładowana, tym mniejszy jest jej obszar, a tym samym indeks prędkości. Jeśli jesteś zainteresowany szczegółami: tutaj Webpagetest zawiera listę wszystkich informacji dotyczących obliczania wskaźnika prędkości.

Indeks prędkości najlepiej nadaje się do porównań. Jeśli pomiar optymalizacyjny prowadzi do znaczącej redukcji indeksu, ma on tendencję do osiągania sukcesu, a strona jest postrzegana jako szybsza. Jeśli Twoja strona ma znacznie niższy wskaźnik prędkości niż konkurencja, możesz założyć, że Twoja strona oferuje lepsze wrażenia z surfowania dla odwiedzających.

Koszt: Ta wartość jest raczej ładna. Pokazuje on, jak kosztowna jest twoja strona, gdy jest ładowana przez sieci komórkowe. Dane pochodzą z whatdoesmysitecost.com i tworzą średnią wartość dla wszystkich wymienionych tu taryf krajowych. Dzięki tej funkcji możesz zobaczyć koszty mobilnego załadunku Twojej strony. Ale myślę, że ta wartość jest tylko w bardzo niewielu przypadkach naprawdę istotna dla optymalizacji. Proszę mnie poprawić, jeśli się tu mylę.

Najważniejsza funkcja Webpagetest: Porównaj bezpośrednio kilka stron internetowych

Kiedy mierzysz czas ładowania strony, zazwyczaj są dwa powody: Albo dokonałeś zmiany i chcesz wiedzieć, jaki ma ona wpływ na czas ładowania, albo chcesz porównać swoją stronę z innymi.

Oczywiście do takiego stwierdzenia potrzebna jest wartość porównawcza. I to jest dokładnie to, co funkcja "porównanie wizualne" stworzony. Bo dzięki niemu można bezpośrednio porównać czas ładowania i zachowanie się kilku adresów URL.

Funkcja porównywania wizualnego pozwala na bezpośrednie porównywanie stron internetowych.
Funkcja porównania znajduje się bezpośrednio po prawej stronie standardowej analizy Webpagetest.

Dzięki tej funkcji można na przykład:

  • porównaj własne strony z konkurencją
  • sprawdzić, co przyniosła zmiana hostera
  • przetestować dwie lub więcej podstron przeciwko sobie
  • sprawdzić jak szybko ładują się podstrony w porównaniu do strony startowej

W celu bezpośredniego porównania należy tylko nazwać strony, wstawić adresy URL i przeprowadzić test z wcześniej ustawionymi parametrami.

Do celów badawczych porównujemy ze sobą dwie strony naszych produktówWynik pozwala na porównanie stron przy użyciu kilku metryk. Najbardziej opisowy z nich znajduje się na samym początku dokumentu wynikowego: The Filmstrip View. Tutaj możesz zobaczyć, kiedy odwiedzający postrzega Twoją stronę jako całkowicie załadowaną (odpowiedni parametr jest nazywany Visually Complete).

Wartość referencyjna może zostać zmieniona tak, aby można było wyświetlić również inne charakterystyki, takie jak W pełni załadowany i Kompletny dokument.

Wynik, jeśli porównasz dwie strony internetowe na Webpagetest
Najbardziej żywe metryki są przedstawione na samym początku: Widok paska filmowego. Nadal można go skonfigurować za pomocą ustawień na dole po prawej stronie. Schematy wodospadów można przełączać za pomocą suwaka po lewej stronie nad schematami.

Poniżej znajdują się jeszcze cztery wykresy słupkowe, które pokazują jak działają testowane strony pod względem postrzeganego czasu ładowania, czasu ładowania kluczy, liczby żądań HTTP oraz rozmiaru strony.

Dzięki tym metrykom można na pierwszy rzut oka zobaczyć, które z testowanych stron ładują się szybciej, są szczuplejsze i oferują lepsze wrażenia dla odwiedzających.

Dla użytkowników Google Webpagetest oferuje również możliwość długoterminowych porównań.

Po zalogowaniu się do Webpagetest za pomocą konta Google każdy test jest rejestrowany. Daje to możliwość obejrzenia i porównania wszystkich testów z ubiegłego roku.

Długoterminowe porównania w Webpagetest w celu porównania kilku wersji strony internetowej
Nasza historia Webpagetest z ostatnich siedmiu dni. Za każdym razem, gdy zalogujesz się na swoje konto Google, Twoje testy są zapisywane i mogą być oglądane później.

Ten przegląd jest niezwykle praktyczny dzięki dwóm funkcjom: dostęp do historycznych danych testowych można uzyskać klikając na adres URL. Oznacza to, że można zobaczyć kompletne wyniki wszystkich testów z ubiegłego roku.

Możesz oznaczyć poszczególne testy i porównać je ze sobą, aby uzyskać szybki wgląd w rozwój swoich stron.

Wniosek: Webpagetest jest znacznie bardziej wydajny niż inne darmowe narzędzia.

Bezpośrednie porównanie kilku stron jest z pewnością najpotężniejszą funkcją Webpagetest. Pozwala to zobaczyć Twoją stronę w porównaniu z konkurencją, wzorcami lub wzorcami branżowymi. Wyniki, które otrzymujesz, są - w warunkach webpagetest - również dobrze przygotowane i łatwe do zrozumienia.

Analiza szeregów czasowych pozwala również na uzyskanie kompleksowego obrazu rozwoju czasu ładowania strony. Dzięki temu można dokładnie zobaczyć, jakie działania optymalizacyjne lub zmiany wpłynęły na Twoją stronę, czas jej ładowania i wrażenia użytkownika.

Dzięki tym dwóm funkcjom możesz rejestrować wszystkie istotne zmiany na swoich stronach i, co ważniejsze, analizować je.

Znasz inną przydatną funkcję Webpagetest, o której zapomnieliśmy? W takim razie czekamy na Państwa komentarz!

RAIDBOXER z pierwszej godziny i kierownik działu wsparcia. W Bar- i WordCamps lubi rozmawiać o PageSpeed i wydajności strony internetowej. Najlepszym sposobem na przekupienie go jest espresso - lub bawarski precel.

Artykuły pokrewne

Komentarze do tego artykułu

A
Andi

Cześć, mam jedno pytanie
dlaczego webpagetest.org pokazuje czasem dłuższy czas wczytywania strony niż w rzeczywistości - po wpisaniu domeny w wybranej przeglądarce internetowej?

Przykładowo wg narzędzia webpagetest strona impreza.us-themes.com w sieci prawie 3GB wczytuje się ok. 8,5 sekundy (wykonałem 3 testy na serwerze California - tam strona ma założony hosting, sprawdzałem również na serwerze w Warszawie),a w rzeczywistości strona na moich dwóch komórkach wczytywała się ok. 3 sekundy.

Podobne różnice widziałem na innych stronach . Przykładowo strona senorysenorade.com - w ustawieniu "Cable (5/1 Mbps 28 ms RTT)" wczytywała się ponad 18 sekund, a w rzeczywistości na moich dwóch komputerach i w różnych przeglądarkach wczytywała się o połowę krócej, po zmianie ustawienia na "Native Connection" wynik to ok. Trzy sekundy. Oczywiście za każdym razem czyściłem "ciasteczka".

Byłbym wdzięczny za krótką odpowiedź 🙂 Pozdrawiam, Andrzej

Napisz komentarz

Twój adres e-mail nie zostanie opublikowany. Wymagane pola oznaczone są * Zaznaczone.