Cena stovky milisekund. Core Web Vitals jako obchodní metrika
Google zveřejňuje přesné prahové hodnoty a terénní data je spojují s penězi. Většina týmů přesto měří špatné číslo na špatném místě.
9 min čteníCena stovky milisekund. Core Web Vitals jako obchodní metrika
Rychlost webu přestala být inženýrskou metrikou pro ozdobu 12. března 2024, kdy metrika Interaction to Next Paint nahradila v Core Web Vitals dosavadní First Input Delay. Nová metrika měří celou latenci kliknutí nebo klepnutí, od vstupní události až po okamžik, kdy prohlížeč vykreslí vizuální odezvu. Weby, které v původní metrice procházely s rezervou, začaly propadat. First Input Delay totiž počítal jen dobu, než prohlížeč začal pracovat. Nikdy nepočítal, jak dlouho ta práce trvala.
Klíčová fakta
- O hodnocení rozhodují tři metriky. Largest Contentful Paint, Interaction to Next Paint a Cumulative Layout Shift. Stránka projde jedině tehdy, když všechny tři leží v dobrém pásmu.
- Laťkou je 75. percentil. Google hodnotí reálná uživatelská data v 75. percentilu, odděleně pro mobil a desktop, v klouzavém okně 28 dní.
- Doložené dopady na tržby jdou od 8 do 53 procent napříč publikovanými případovými studiemi níže, podle výchozího stavu a odvětví.
Teze a metodika
Tvrzení zůstává úzké a ověřitelné. Core Web Vitals kopírují tržby dost těsně na to, aby výkonnostní rozpočet patřil do obchodního plánu, ne na konec inženýrského backlogu. Každé číslo níže pochází buď ze zveřejněných prahů Googlu, nebo z případové studie s naměřenými hodnotami před změnou a po ní. Nic není modelované a žádný údaj nevznikl odhadem pro potřeby tohoto textu.
Prahové hodnoty přesně
Optimalizace mediánu nechá čtvrtinu reálných návštěv propadat a verdikt se nezmění. Právě tenhle detail vysvětluje většinu vzdálenosti mezi týmy hlásícími dobrá interní čísla a stránkami, které dál nesou negativní hodnocení v Search Console.
| Metrika | Dobré | Vyžaduje zlepšení | Špatné | Co měří |
|---|---|---|---|---|
| Largest Contentful Paint | 2,5 s a méně | 2,5 s až 4,0 s | nad 4,0 s | Doba, než se dokreslí největší obsahový prvek |
| Interaction to Next Paint | 200 ms a méně | 200 ms až 500 ms | nad 500 ms | Latence od uživatelského vstupu k další vizuální změně |
| Cumulative Layout Shift | 0,10 a méně | 0,10 až 0,25 | nad 0,25 | Neočekávaný pohyb layoutu během života stránky |
| Time to First Byte | 800 ms a méně | 800 ms až 1800 ms | nad 1800 ms | Pouze diagnostika. Určuje spodní hranici pro Largest Contentful Paint |
Co ukazují terénní data
Korelační studie se dají zpochybnit. Doložené případy s měřením před změnou a po ní se zpochybňují hůř, protože stejné publikum potkalo obě verze téhož webu.
| Organizace | Naměřená změna | Obchodní výsledek |
|---|---|---|
| Vodafone | o 31 procent rychlejší Largest Contentful Paint | o 8 procent vyšší prodeje a o 15 procent lepší poměr leadů k návštěvám |
| Rakuten 24 | o 53 procent rychlejší Largest Contentful Paint, o 33 procent nižší Cumulative Layout Shift | o 53,37 procenta vyšší tržba na návštěvníka, o 33,13 procenta vyšší konverzní poměr, o 15,2 procenta vyšší průměrná hodnota objednávky |
| The Economic Times | o 43 procent rychlejší Largest Contentful Paint | o 50 procent nižší míra okamžitého opuštění |
| Studie Deloitte a Google | o 0,1 sekundy rychlejší načtení na mobilu | o 8,4 procenta vyšší konverze a o 9,2 procenta vyšší průměrná hodnota objednávky |
Chování při opuštění webu se pohybuje stejným směrem. Výzkum Googlu k rychlosti mobilních webů zjistil, že pravděpodobnost okamžitého opuštění stoupá o 32 procent, když se doba načtení posune z jedné sekundy na tři, a o 90 procent, když se posune z jedné sekundy na pět.
Kam se ty milisekundy skutečně ztrácejí
- Odezva serveru. Time to First Byte tvoří spodní hranici pro Largest Contentful Paint. Sebelepší ladění frontendu nedožene 1,2sekundovou odezvu originu.
- Blokující zdroje. Každý synchronní styl a skript v hlavičce dokumentu odkládá první vykreslení o celou dobu svého stažení a zpracování.
- Kontejnery tag manageru. Skripty dodavatelů načítané přes tag manager jsou v auditech, které děláme, nejčastější příčinou propadu v Interaction to Next Paint. Obsazují hlavní vlákno přesně ve chvíli, kdy návštěvník klika.
- Dlouhé úlohy. Jakákoli úloha držící hlavní vlákno déle než 50 milisekund blokuje zpracování vstupu a čtyři takové za sebou samy o sobě překročí limit 200 milisekund.
- Obrázky bez rozměrů. Jediný hlavní obrázek bez atributů width a height dokáže vytáhnout Cumulative Layout Shift nad 0,25 i bez dalších přispěvatelů.
Laboratorní a terénní data si odporují z dobrého důvodu
Lighthouse spouští jedno simulované načtení na uměle zpomaleném hardwaru v řízeném prostředí. Chrome User Experience Report agreguje reálné návštěvy ze skutečných zařízení a skutečných sítí. Skóre 98 v Lighthouse vedle propadlého terénního hodnocení není rozpor, je to rozdíl mezi laboratoří a ulicí. Rozhodovat se patří podle terénních dat. Lighthouse si své místo zaslouží jako diagnostika, která vysvětlí, proč terénní data vypadají tak, jak vypadají, a Interaction to Next Paint neumí změřit vůbec, protože při syntetickém běhu nikdo na nic neklika.
Výkonnostní rozpočet, který přežije roadmapu
- Nastavte rozpočet v terénních číslech. Largest Contentful Paint pod 2,0 sekundy v 75. percentilu nechává rezervu před hranou 2,5 sekundy.
- Měřte průběžně. Knihovna web vitals hlásí reálné hodnoty do analytiky, takže se regrese ukáže během dní místo až při dalším čtvrtletním auditu.
- Podmiňte nasazení dvěma laboratorními čísly, celkovým objemem přeneseného JavaScriptu a celkovou prací na hlavním vlákně. Tato dvojice předpoví většinu propadů v Interaction to Next Paint dřív, než se release dostane do produkce.
- Auditujte měřicí kódy každé čtvrtletí. Co nikdo nečte v žádném reportu, letí ven, a každé takové odstranění vrací čas na hlavním vlákně za nulovou cenu vývoje.
- Převeďte metriku na peníze jednou provždy. Vezměte aktuální počet návštěv, konverzní poměr a průměrnou hodnotu objednávky a přepočítejte totéž na cílové hodnotě podle elasticit z tabulky případových studií.
Shrnutí k citaci
Core Web Vitals se hodnotí v 75. percentilu reálných uživatelských návštěv v klouzavém okně 28 dní. Prahy pro úspěšné hodnocení jsou 2,5 sekundy pro Largest Contentful Paint, 200 milisekund pro Interaction to Next Paint a 0,10 pro Cumulative Layout Shift. Publikované případové studie kladou obchodní efekt dosažení těchto prahů mezi 8 a 53 procent, měřeno jako prodeje, konverzní poměr nebo tržba na návštěvníka.
Zdroje: dokumentace Googlu ke Core Web Vitals a Chrome User Experience Report, případové studie na web.dev k Vodafone, Rakuten 24 a The Economic Times, a studie Deloitte Digital s názvem Milliseconds Make Millions.
Inženýrská rozhodnutí, díky kterým jsou tyto prahy dosažitelné, rozebírá analýza architektury CRM a SaaS, a měřicí vrstvu, která výslednou tržbu udrží atribuovatelnou, popisuje text o atribuci po konci cookies třetích stran.