Optimalizace Webu | 2. Základní pojmy

WebPageTest nám na webu hodnotí celkem několik parametrů (metrik), které ovlivňují chod webu. Jedná se o Security score, First Byte Time, Keep-alive, Compress transfer, Compress images, Cache static content a případně zda web využívá CDN. Pojďme si tedy konkrétní pojmy rozebrat.

Security score

Stručně se jedná o hodnocení, jak je web zabezpečený a zda neobsahuje bezpečnostní rizika. Tím samozřejmě nejsou myšlena hesla ale například verze Javascriptu a PHP, zda web funguje na HTTPS, má řádné přesměrování nebo zda jsou nastavené důvěryhodné zdroje.

First Byte Time

Znám také jako TTFB (Time To First Byte), laicky řečeno čas, za který prohlížeč obdrží první data webu. Zde spousty lidí předpokládá, že závisí pouze na serveru (webhostingu) což není zcela pravda. Jak rychle se web načte závisí na DNS, SSL, WebServeru i na samotném webu.

Keep-alive enabled

Jedná se o hlavičku HTTP protokolu, která zajišťuje přenos více dat na jedno spojení. Tím se načtení webu tedy značně urychlí. Můžete si to představit jako kopírování dat na flash disk. Pokud je tento parametr zapnutý, můžete si nahrát veškerá data, tak jak jste zvyklí, tedy vše najednou. Pokud by byl vypnutý, disk by se po každém jednotlivém souboru odpojil a vy byste jej pro nahrání zbytku dat, museli znovu připojit.

Compress transfer

Jedná se o kompresi přenášených souborů, v tomto případě se využívá tzv. gzip. Data se přenášejí komprimovaná v archivu, aby se přenášelo co nejmenší množství dat a přenos tak byl co nejrychlejší.

Compress images

Neoptimalizované obrázky jsou největší slabinou všech webů. Při tvorbě webu neexistuje nic horšího než nahrát na web desítky až stovky fotografií, které mají až 5 MB. Zde je potřeba obrázky předem komprimovat a ideálně je převést do progresivního jpeg. V případě loga, či statických obrázků je vhodnou volbou formát webp.

Cache static content

Nejedná se samozřejmě o nic jiného než cachování souborů. Tedy jejich ukládání do mezipaměti. Pokud na webu neprovádíte změny, tak je zbytečné, aby se Váš prohlížeč stále ptal serveru na obsah webu. Uložením obsahu do mezipaměti tedy značně zrychlíte načtení webu.

CDN

Content delivery network. Jedná se o tzv síť pro doručování obsahu. Velmi stručně to znamená, že pokud máte webhosting u nás a Váš web si zobrazí návštěvník z Brazílie, velmi pravděpodobně se mu web bude načítat déle než návštěvníkovi z Německa. Je to opravdu tím, že je od serveru mnohem dále. Na světě však existují servery, které přednačítají weby a zajišťují tak stejně rychlé načtení webu pro návštěvníky z celého světa.

Web vitals

V neposlední řadě nás zajímají „Web vitals“ do kterých spadá Large Contentful Paint (LCP), Comulatiove Layout Shift (CLS) a Total Blocking Time(TBT).

LCP

Nejčastějším problémem je právě LCP. Jedná se prakticky o optimalizaci obrázků a videí na webu. Obvykle jej lze vyřešit kompresí.

CLS

Ověřuje rozložení bloků webu, tedy zda Vám „nepřetékají“. Ověřuje správná odsazení, zda je blok vidět celý nebo naopak zda není příliš malý.

TBT

Tento parametr (metrika) nám ukazuje čas, po který již vyobrazená stránka není schopná reagovat na vstupy návštěvníka. Tedy pokud se stránka již zobrazuje ale nereaguje na kliknutí myší (pokud chcete například přejít na podstránku). Toto obvykle ovlivňuje Javascript.

V následujícím článku již začneme řešit konkrétní problémy na statické stránce.