Tyto dvě funkce WebPagetest ještě neznáte - ale měli byste je pravidelně používat

Jan Hornung Naposledy aktualizováno 21.10.2020
6 min.
Porovnání webových stránek s testem webové stránky

Webpagetest.org je pravděpodobně nejlepším bezplatným nástrojem pro měření doby načítání stránky. Protože WebPagetest je mnohem výkonnější než přímá konkurence. A to především díky dvěma funkcím: možnosti porovnat webové stránky a dlouhodobému srovnání.

Tento článek je součástí řady pro měření a vyhodnocení doby načítání vašich webových stránek. V předchozích článcích jsme ukázali:

Dnes vám ukážu dvě funkce Webpagetestu, které jste pravděpodobně ještě nevěděli. Je to proto, že nástroj je zvláště vhodný pro porovnání výkonu a průběžné vyhodnocování doby načítání stránky.

Proto vám dnes ukazuji:

Další klíčové metriky – index rychlosti, prvky modelu DOM a náklady

Kromě výchozích hodnot, jako je Počáteční vykreslování, Dokončení dokumentu atd., poskytuje webová stránka také další užitečná klíčová data, která umožňují odhadnout efektivitu stránky. Tyto hodnoty jsou důležité, abyste mohli správně interpretovat výsledky nástroje.

Příklad výsledku testu webové stránky, který zobrazuje důležité rozšířené vlastnosti
Ukázkový výsledek testu webové stránky. Index rychlosti, počet prvků modelu DOM a požadavky jsou tři důležité ukazatele celkového výkonu vaší stránky.

Prvky modelu DOM: Prvek modelu DOM je zhruba stavebním blokem HTML. Čím méně těchto stavebních bloků musí váš prohlížeč načíst, tím štíhlejší a rychlejší bude vaše stránka. Počet prvků modelu DOM je však pouze ukazatelem doby načítání stránky. Provedením změn Plugins , ale především Theme , lze výrazně snížit počet prvků modelu DOM.

Extrahujte ze zdrojového kódu RAIDBOXES Blogu
Každý prvek těla HTML, který je uzavřen v úhlových závorkách, je prvek modelu DOM.

Požadavky: Tato hodnota popisuje počet jednotlivých požadavků HTTP, které musí váš prohlížeč provést na webovém serveru. Požadavek HTTP požaduje jednotlivé položky, jako jsou soubory CSS, soubory JavaScriptu nebo obrázky. Opět platí, že teoretické pravidlo je, že čím méně požadavků, tím lépe. Mimochodem, vodopádový diagram vaší stránky vám vždy poskytne nejlepší přehled o načtených požádcích HTTP.

V praxi však skutečný počet požadavků HTTP nehraje tak velkou roli. Alespoň ne, pokud je stránka šifrována protokolem SSL a spuštěna na serveru se systémem HTTP/2. Je to proto, že lze vytvořit a načíst několik požadavků současně.

Index rychlosti: Tento index je vypočítán webovou stránkou a je ukazatelem vnímané doby načítání stránky. Hodnota popisuje hodnotu milisekundy , která označuje, jak rychle a efektivně se načítá viditelný obsah stránky. Test webové stránky v zásadě používá snímky obrazovky stránky k určení uživatelského prostředí a jeho měření pomocí časové hodnoty. Máte-li zájem: Webpagetest pro to také zformuoval rovnici.

Základ pro výpočet indexu rychlosti
Index rychlosti testu webové stránky je reprezentován a vypočítán jako oblast. Čím rychleji se obsah stránky načte, tím menší je obsah oblasti a tím i index rychlosti. Máte-li zájem o podrobnosti: zde Webpagetest uvádí všechny informace o tom, jak vypočítat index rychlosti.

Index rychlosti je nejvhodnější pro porovnání. Pokud optimalizační opatření výrazně sníží index, má tendenci být úspěšné a stránka je vnímána jako rychlejší. Pokud má váš web mnohem menší index rychlosti než soutěžní, můžete předpokládat, že váš web nabízí návštěvníkům lepší zážitek ze surfování.

Cena: Tato hodnota je spíše příjemná. Označuje, jak drahá je vaše stránka, když je načtena přes mobilní sítě. Údaje pocházejí z whatdoesmysitecost.com a poskytují průměr všech zde uvedených cel. Pomocí této funkce můžete zobrazit náklady na mobilní načítání stránky. Tuto hodnotu však ve většině případů považuji za skutečně relevantní. Prosím, opravte mě, jestli se mýlím.

Nejdůležitější funkce testu webové stránky: Přímé porovnání několika webových stránek

Pokud měříte dobu načítání stránky, obvykle existují dva důvody: buď jste provedli změnu a chcete vědět, jak ovlivňuje dobu načítání, nebo chcete stránku porovnat s ostatními.

Pro takové prohlášení samozřejmě potřebujete srovnávací hodnotu. A to je přesně to, proco byla funkcevizuálního porovnání vytvořena. To vám umožní přímo porovnat dobu nabíjení a chování nabíjení více adres URL.

Funkce Vizuální porovnání umožňuje porovnat webové stránky přímo mezi sebou.
Funkci porovnání najdete hned vedle standardní analýzy webpagetestu.

Pomocí této funkce můžete například:

  • Porovnejte své vlastní stránky s stránkami konkurence
  • zkontrolujte, co změna hostitele přinesla
  • Testování dvou nebo více podstránky proti sobě
  • zkontrolujte, jak rychle se načítají podstránky ve srovnání s domovskou stránkou

Pro přímé porovnání je třeba stránky pojmenovat, vložit adresy URL a spustit test s dříve nastavenými parametry.

Pro účely testování porovnáváme dvě z našich produktových stránek mezi sebou. Výsledek umožňuje porovnat stránky na základě několika metrik. Nejživější lze nalézt přímo na začátku výsledného dokumentu: Zobrazení filmového pásu. Zde můžete vidět, kdy návštěvník vnímá vaši stránku jako dokončenou (příslušná charakteristika se nazývá Vizuálně dokončená).

Referenční hodnotu lze také změnit tak, aby bylo možné zobrazit i další metriky, například Plně načtené a Dokončeno dokumentu.

Výsledek, pokud porovnáte dvě webové stránky v testu webové stránky
Nejilustrativní metrika je uvedena hned na začátku: Zobrazení filmového pásu. Můžete jej nakonfigurovat z nastavení v pravém dolním rohu. Vodopádové diagramy lze přepínat tam a zpět přes posuvník doleva přes diagramy.

Níže naleznete čtyři pruhové grafy, které vám ukážou, jak testované stránky porovnají dobu načítání plsti, nejdůležitější doby načítání, počet požadavků HTTP a velikost stránky.

S těmito metrikami můžete na první pohled vidět, která z testovaných stránek se načítá rychleji, je štíhlejší a nabízí návštěvníkovi lepší zážitek.

Pro uživatele Google nabízí test webových stránek také možnost dlouhodobého porovnávání

Když se přihlásíte k webovému serveru pomocí svého účtu Google, jednotlivé testy se zaznamenávají. To vám dává možnost zobrazit a porovnat všechny testy za poslední rok.

Dlouhodobé porovnání v testu webové stránky za porovnání více verzí webu
Naše webová stránka testuje historii za posledních sedm dní. Kdykoli se přihlásíte pomocí účtu Google, vaše testy se uloží a poté je můžete zobrazit.

Tento přehled je velmi praktický zejména díky dvěma funkcím: K historickým testovacím datům můžete přistupovat kliknutím na adresu URL. To znamená, že můžete vidět kompletní výsledky všech testů za poslední rok.

A můžete označit jednotlivé testy a porovnat je, abyste rychle získali přehled o vývoji vašich stránek.

Verdikt: Test webové stránky je mnohem výkonnější než jiné bezplatné nástroje

Přímé porovnání více stránek je jistě nejvýkonnější funkcí testování webových stránek. Protože vám umožňuje podívat se na svou stranu ve vztahu k konkurenci, vzorům nebo průmyslovým měřítkům. Výsledky, které dostanete, jsou také dobře připraveny a snadno pochopitelné pro poměry testů webových stránek.

Analýza časových řad také umožňuje získat komplexní obrázek o vývoji doby načítání stránky. To vám umožní přesně zjistit, která optimalizační opatření nebo změny ovlivnily váš web, jeho dobu načítání a uživatelské prostředí.

S těmito dvěma funkcemi budete moci zachytit všechny relevantní změny na vašich stránkách a co je důležitější, analyzovat je.

Stále znáte užitečnou funkci webovou stránku, na kterou jsme zapomněli? Pak se těšíme na váš komentář!

Jeden z prvních členů u RAIDBOXES a vedoucí podpory. Na Bar a WordCamps, preferuje mluvit o PageSpeed a výkonnosti webových stránek. Nejlepší způsob, jak ho podplatit, je espresso – nebo bavorský preclík.

Komentáře k tomuto článku

Napsat komentář

Vaše e-mailová adresa nebude zveřejněna. Povinná pole jsou označena *.