Know-how
To nejdůležitější o rychlosti webu.
📄️ Proč rychlost webu?
Psychologie, konverze a Google. Proč byste měli i vy mít rychlý web?
📄️ LCP element
Pro optimalizaci LCP je zásadní umět najít „prvek LCP“, což je největší prvek ve viditelné části prohlížeče.
📄️ LCP optimalizace
Pojďme se společně podívat, jaké problémy s metrikou Largest Contentful Paint (LCP) vás mohou potkat a jak metriku také co nejefektivněji optimalizovat.
📄️ CLS optimalizace
Pojďme se společně podívat, jak se problémům s CLS vyvarovat a také, jak je můžete odstranit, když už se stanou.
📄️ INP optimalizace
INP není úplně nejjednodušší metrikou k optimalizaci, proto jsme z naší praxe vybrali nejčastější problémy a způsoby jak je vyřešit.
📄️ BFcache
Back/forward cache (nebo BFcache) je optimalizace prohlížeče, která umožňuje okamžitou navigaci zpět a vpřed. Výrazně zlepšuje zážitek z prohlížení, zejména pro uživatele s pomalejšími sítěmi nebo zařízeními.
📄️ Komprese Gzip a Brotli
V PageSpeed.cz často rozebíráme velmi konkrétní problémy. I tak se nestačím divit, do jakých detailů se dostaneme. Stejné to bylo s kompresí dat, na kterou se podíváme v tomto článku.
📄️ Navigation Types
Znát různé typy navigace je důležité, protože některé z nich jsou daleko rychlejší než jiné. Cílem z pohledu optimalizace rychlosti webu je převést co nejvíce uživatelů na rychlé typy navigace.
📄️ Speculation Rules
Speculation Rules API nám přináší možnost jak přednačíst, nebo dokonce předběžně vykreslit jinou stránku. Tímto způsobem můžeme dosáhnout téměř instantního načtení stránky, na kterou uživatel přechází a zlepšit tak jeho celkový zážitek z webu.
📄️ CLS: Jak držet výšku?
V tomto textu se dozvíte, proč a jak je potřeba na úrovni HTML nebo CSS zajistit rozměry elementů, které se do stránky vkládají asynchronně, jako jsou prvky <img>, <iframe> nebo javascriptové komponenty.
📄️ Web Vitals v prohlížeči
Core Web Vitals jsou Metriky, které používáme k hodnocení výkonu webových stránek v oblastech jako jsou rychlost načítání, interaktivita a stabilita layoutu. Tyto metriky jsou stále více důležité pro zajištění dobré uživatelské zkušenosti a Google je používá jako jedno z hledisek pro umístění ve výsledcích vyhledávání.
📄️ INP a setTimeout()
Metoda s použitím funkce setTimeout() slouží k optimalizaci dlouhých úloh v JavaScriptu, které blokují uživatelské interakce a zhoršují tím metriky jako Total Blocking Time (TBT) nebo Interaction to Next Paint (INP), která je důležitou součástí sady Core Web Vitals.
📄️ Optimalizace Reactu
React je oblíbený nástroj pro vývoj moderních webů, ale rychlost a interaktivita nemusí být vždy automatická. V tomto článku představíme klíčové techniky pro optimalizaci Core Web Vitals – od hydratace přes až po práci s DOMem – a ukážeme vám, jak je využít k zrychlení vašich React projektů.
📄️ Optimalizace backendu
Backend hraje v optimalizaci rychlosti webu zásadní roli, protože správná optimalizace na straně kódu a serveru může eliminovat zpoždění, které často vzniká při zpracování požadavků a doručování obsahu.
📄️ Cookie lišty a rychlost webu
Máte vyladěnou rychlost webu? Výborně, ale to jste možná ještě nenasadili cookie lištu.
📄️ HTML <head> a rychlost
Máme rádi WebExpo a máme rádi performance. A navíc máme rádi Harryho Robertse, protože jeho přednášky a články jdou vždy do hloubky.
📄️ WebP obrázky
Rychlost načítání webu je často otázkou vteřin. A právě obrázkový formát WebP může být tajnou zbraní, jak ušetřit kilobajty a přiblížit se dokonalému výkonu.
📄️ Studie: Chaty a rychlost
Live chat používá dvacet procent provozovatelů českých e-shopů. Jak ale tyto komponenty ovlivní rychlost webu?
📄️ Studie: CSS jeden nebo více?
V týmu PageSpeed.cz máme hned několik „evergreen“ diskuzí, na kterých se neshodne celý tým. Jedná z věčných otázek zní: Je rychlejší mít hodně malých CSS souborů rozdělených po komponentách, nebo jeden velký?
📄️ Synth vs. CrUX vs. RUM
Pojďme si v tomto textu ujasnit rozdíly mezi různými typy měření rychlosti webu. Pobavme se o syntetice („synth“), datech od uživatelů Googlu („CrUX“) a datech od všech uživatelů („RUM“).
📄️ Chrome UX Report (CrUX)
Chrome UX Report (CrUX) je veřejný datový soubor poskytovaný společností Google, který shromažďuje a anonymně analyzuje údaje o skutečné uživatelské zkušenosti při prohlížení webu pomocí prohlížeče Chrome.