27. 6. 20221 minuta čtení
Stopa PageSpeed.cz na WebExpo 2022
Na letošním WebExpu nemohla chybět výprava PageSpeed.cz, navíc si náš Michal Matuška střihl v angličtině přednášku na téma „Optimising Core Web Vitals With Web Fonts”.Číst dále
7. 11. 2022
Za dva dny jsme s Michalem slyšeli celkem 14 špičkových přednášek v prostoru bývalého kostela. Ano, čtete správně, letošní ročník Performance.now() se konal na místě zvaném Zuidekerk, což byl původně protestantský kostel ze 17. století. Nyní tento prostor slouží ke konání akcí.
Výběr místa musím opravdu pochválit, jelikož je netradiční. Nicméně kdo alespoň trochu zná povahu Amsterdamu, nediví se. Pro uvolněnou a volnomyšlenkářskou atmosféru Amsterdamu je to velmi typické. Pauzy mezi přednáškami a volný čas jsme strávili poznáváním města.
Po skončení konference jsme samozřejmě vybrali nejlepší letošní přednášky. Níže je náš seznam:
Přednáška pro geeky, kteří chtějí vytřískat ze své frontendové performance maximum. I přes velký spoiler na začátku, že se „jedná o mikrooptimalizace“, Nolan ukázal detail toho, jak náročné je pro browser vypočítat styl a sestavit layout. Nasdílel s námi také nástroj Chrome Trace Event Profiling, který pomáhá debugovat např. rychlost selektorů.
Alex se ve své přednášce zaměřuje na věčné téma uživatelů a jejich systémových (hardwarových) a síťových podmínek. Jak v jednom slidu trefně připomíná, „váš iPhone není reálný svět“. S jakými parametry tedy pracujeme a na jaký výkon můžeme naše weby stavět? Celosvětově je telefon na 75. percentilu ve 4. čtvrtletí roku 2022 zařízení s cenou okolo 200 USD, což odpovídá Samsungu Galaxy A50 apod. Stále bychom tedy měli preferovat HTML a CSS nad JS. Dostačujícím maximem může být 150 kB HTML/CSS a 300-300 kB JS.
Harryho není třeba dlouze představovat (viz naše zápisky o pořadí prvků v <head>
) a jeho přednáška rozhodně nezklamala. Klobouk dolů před tím, jak postavil přednášku na 40 minut pouze kolem metriky LCP. Tuto přednášku bych doporučila asi všem, protože jak říká Harry „na optimalizaci LCP nic není, jen je potřeba znát jak to funguje“. Harry mimojiné vysvětlil, jak se změní metrika LCP, pokud obrázek na stránku vložíte jako <svg>
, jako background-image nebo klasicky v <img>
. Krátká odpověď: Způsob vložení na stránku má zásadní vliv na metriku LCP.
Více programátorská přednáška o Reactu 18 a jeho novém API useTransition a <Suspense>
. Ivan názorně ukázal jak lze v Reactu využívat tzv. konkurence, kdy start aplikace resp. datová hydratace či náročný UI update neblokuje uživatelský vstup. Ideální nástroj pro boj s FID a INP.
Nejenom obsah dělá skvělou přednášku, ale také forma je důležitá. Z tohoto pohledu byla přednáška Katie nezapomenutelná. Na příkladu detektiva Pikačua nás provedla svým procesem monitorování performance. Praktické nám přijde hlavně její použití Distribučních funkcí (vypadají jako „obrácené histogramy“) k vyhodnocování a porovnávání naměřených dat před a po změnách na webu.
Na závěr organizátoři oznámili skvělou zprávu. Další ročník Performance.now() se bude konat 2. a 3. listopadu 2023, na stejném místě jako letos. Těšíme se!
Všechny přednášky si můžete pustit na Youtube, kde budou postupně zveřejňovány.
Zuzana ŠumlanskáKonzultantka rychlosti a zkušená front-end kodérka na volné noze. Mimojiné pro vás připravuje náš newsletter.
Jak rychlý je váš web v porovnání s vaší konkurencí? To zjistíte
pomocí našeho online testeru.
27. 6. 20221 minuta čtení
Na letošním WebExpu nemohla chybět výprava PageSpeed.cz, navíc si náš Michal Matuška střihl v angličtině přednášku na téma „Optimising Core Web Vitals With Web Fonts”.Číst dále