Nástroj zdarma: Výkon

Test rychlosti webu

Načteme vaši stránku jako telefon střední třídy na pomalém připojení 4G, změříme, jak rychle se zobrazí hlavní obsah a jak moc stránka poskakuje, a ukážeme, co ji zatěžuje. Pokud má Google pro váš web data od skutečných uživatelů, uvidíte i ta.

Zdarma. Obvykle hotovo za méně než minutu.

Co tento nástroj kontroluje

  • Telefon na pomalém 4G

    Stránka se načte v prohlížeči Chromium jako telefon třídy Moto G Power (412 × 823) s latencí 150 ms, rychlostí stahování zhruba 1,6 Mbps a odesílání 750 Kbps a se 4× zpomaleným procesorem. Tento profil používá Lighthouse pro mobilní testy.

  • Largest Contentful Paint (LCP)

    Kdy se dokončilo vykreslení největšího obrázku nebo bloku textu na první obrazovce a o jaký prvek šlo.

  • Cumulative Layout Shift (CLS)

    Jak moc se viditelný obsah během načítání nečekaně posunul.

  • Total Blocking Time (TBT)

    Jak dlouho skripty zaměstnávaly prohlížeč natolik, že nemohl reagovat na klepnutí: sečtená část každé dlouhé úlohy nad 50 ms. V laboratoři zastupuje metriku Interaction to Next Paint.

  • Co stránka stahuje

    Celkový objem v bajtech a počet požadavků, rozdělené na obrázky, skripty, CSS a fonty, a podíl, který pochází od třetích stran.

  • Těžké obrázky a soubory blokující vykreslení

    Obrázky nad 150 KB nebo mnohem širší než prostor, ve kterém se zobrazují, a soubory CSS a skriptů, které zdržují první vykreslení.

  • Data od skutečných uživatelů Chromu

    Přehled Chrome UX Report od Googlu pro váš origin na telefonech v 75. percentilu: LCP, INP a CLS, pokud má Google pro web dost návštěvnosti.

Co zkontrolovat nedokáže

  • Dávat při každém spuštění stejná čísla. Laboratorní výsledky se liší podle sítě, zatížení serveru a skriptů třetích stran, proto porovnávejte trendy, ne jednotlivá měření.
  • Přesně odpovídat PageSpeed Insights. Oba používají podobný profil telefonu, ale běží na jiných strojích a sítích.
  • Změřit INP v laboratoři. INP potřebuje skutečné interakce, takže laboratorní test ukazuje TBT a data od uživatelů ukazují INP, pokud existují.
  • Ukázat data od uživatelů pro každý web. Chrome UX Report pokrývá posledních 28 dní a jen originy s dostatečnou návštěvností z Chromu.
  • Otestovat víc než jednu stránku, kterou zadáte. Placený Report výkonu otestuje 3 klíčové stránky a seřadí příčiny i s opravami.

Proč na tom záleží

Stránka, která se na kancelářské Wi-Fi a rychlém notebooku zdá okamžitá, se může na telefonu střední třídy se slabým signálem načítat několik sekund. Právě tuto situaci test napodobuje, protože tam těžké obrázky a skripty napáchají nejvíc škody.

Core Web Vitals jsou měřítka Googlu pro tento zážitek: načítání (LCP), odezva (INP) a vizuální stabilita (CLS). Google je používá při řazení výsledků, ale uvádí, že dobrý uživatelský dojem ze stránky nepřeváží relevantní obsah. Větší vliv mají na lidi: pomalá nebo poskakující stránka ztrácí návštěvníky dřív, než si cokoli přečtou.

Příčiny bývají konkrétní: nekomprimovaný úvodní obrázek o velikosti několika megabajtů, chatovací widget, který se načte před obsahem, webový font, který skrývá text, nebo banner vložený nad stránku poté, co se zobrazí. Test uvede prvek LCP a nejtěžší soubory, abyste viděli, co z toho platí.

Jak číst výsledky

Largest Contentful Paint (LCP)
Dobré pod 2,5 s, špatné nad 4 s. Pokud je prvkem LCP obrázek, nejvíc záleží na jeho velikosti a prioritě načítání; pokud je to text, podívejte se na webové fonty a CSS blokující vykreslení.
Cumulative Layout Shift (CLS)
Dobré pod 0,1, špatné nad 0,25. Bezrozměrné skóre, které kombinuje, jak velká část obrazovky se pohnula a jak daleko.
Total Blocking Time (TBT)
Dobré pod 200 ms, špatné nad 600 ms. Vysoké TBT předpovídá pomalé reakce na klepnutí u skutečných uživatelů.
Bajty a požadavky
Žádný oficiální limit neexistuje; sledujte, který typ převládá. Obrázky mají obvykle největší podíl a vysoký podíl třetích stran ukazuje na aplikace, tagy a widgety.
Těžké obrázky
Každý obrázek nad 150 KB nebo stažený v mnohem větší šířce, než v jaké se zobrazuje, s velikostí souboru a rozměry.
Soubory blokující vykreslení
CSS a synchronní skripty, které musí prohlížeč stáhnout, než může cokoli zobrazit.
Data od uživatelů (75. percentil)
Skuteční uživatelé Chromu na telefonech za posledních 28 dní. 75. percentil znamená, že tři ze čtyř načtení stránky byla alespoň takto rychlá. INP je dobré pod 200 ms a špatné nad 500 ms.
Bez dat od uživatelů
Google nemá pro váš origin dost návštěvnosti z Chromu. O vaší rychlosti to nic neříká; spolehněte se na laboratorní výsledky.

Jak opravit nejčastější problémy

  • Pomalý obrázek LCP

    Úvodní obrázek poskytujte ve velikosti, v jaké se zobrazuje, pomocí srcset, ve formátu WebP nebo AVIF. Nenačítejte ho líně (lazy-load), přidejte fetchpriority="high" a vložte ho do HTML jako prvek img, ne přes skript nebo jako pozadí v CSS.

  • Obsah, který při načítání poskakuje

    Dejte obrázkům, videím a vloženému obsahu atributy width a height nebo CSS aspect-ratio. Vyhraďte místo pro bannery, cookie lišty a reklamy, nebo je zobrazujte jako překryvné vrstvy, které obsah neodsouvají dolů. U webových fontů použijte font-display: optional nebo záložní font s odpovídající velikostí.

  • Vysoké Total Blocking Time

    Nejdřív odstraňte aplikace, tagy a pluginy, které už nepoužíváte; jejich skripty často zůstávají i potom, co je přestanete používat. Chat, recenze a analytiku načítejte s defer nebo až poté, co je stránka interaktivní. V Shopify zkontrolujte v administraci Online Store › Themes › Customize › App embeds.

  • CSS a skripty blokující vykreslení

    Skriptům, které nemusejí běžet před prvním vykreslením, přidejte defer, malé množství CSS potřebné pro první obrazovku vložte přímo do stránky a odstraňte styly pro funkce, které stránka nepoužívá.

  • Příliš těžké obrázky

    Obrázky před nahráním zmenšete (pro banner na celou šířku stačí zhruba 2000 px na šířku) a zkomprimujte je. Shopify i WordPress umějí automaticky poskytovat menší verze, když si o ně šablona řekne, proto ověřte, že vaše šablona používá responzivní velikosti obrázků.

Otázky k tomuto nástroji

Proč se moje výsledky liší od PageSpeed Insights?

Laboratorní testy závisejí na stroji, síti a okamžiku. PageSpeed Insights spouští Lighthouse na serverech Googlu a pomalé připojení simuluje, zatímco my omezení rychlosti uplatňujeme ve skutečném prohlížeči. Počítejte s podobnými rozsahy, ne se stejnými čísly.

Jaká hodnota LCP je dobrá?

Podle web.dev 2,5 sekundy nebo méně u alespoň 75 % načtení stránky. Víc než 4 sekundy je špatná hodnota.

Proč pro můj web nejsou data od skutečných uživatelů?

Chrome UX Report zahrnuje jen originy, které jsou veřejně dohledatelné a mají dost návštěv od uživatelů Chromu, kteří sdílejí statistiky využití. Mnoho malých webů na tuto úroveň nedosáhne; laboratorní test i tak ukáže, co opravit.

Proč testovat na pomalém telefonu, a ne na počítači?

Protože problémy se tam projeví nejdřív. Rychlý notebook skryje těžké obrázky a skripty, které na telefonu střední třídy stojí sekundy, a Lighthouse používá pro mobilní testy stejný profil telefonu.

Co se stalo s First Input Delay?

Metrika Interaction to Next Paint (INP) nahradila v březnu 2024 metriku First Input Delay jako součást Core Web Vitals. INP sleduje zpoždění interakcí během celé návštěvy, nejen té první.

Zdroje

Související nástroje

Report výkonu ($55, jednorázově) vychází z úplného bezplatného skenu a přidává další stránky, změnu ke každému zjištění, PDF a opakované testy k ověření vašich oprav.

Co obsahuje Report výkonu