Meetupy WebPerf.cz

Cílem PageSpeed.cz je zrychlovat uživatelům weby. Snažíme se o to prostřednictvím poradenství k rychlosti a našeho monitorovacího nástroje.

Samozřejmě víme, že na to zrychlování nemůžeme být sami. Proto jsme založili komunitu WebPerf.cz a letos zorganizovali už dva meetupy, jeden v Praze a jeden v Bratislavě.

Podívejte se s námi na sumarizační report z těchto povedených akcí.

WebPerf.cz #1
(Praha, Alma Career, 21. 3. 2024)

Na historicky prvním meetupy fanoušků rychlých webů jsme zaplnili pražskou Alma Career.

O čem byla v Praze řeč?

Webperf novinky (Michal Matuška)

• Nová metrika INP nahrazuje FID.
• Performance Inequality Gap.
• Long Animation Frames API (LoAF).

Optimalizace webových fontů (Aleš Roubíček)

• Používejte vlastnost font-display.
• Nezapomeňte na fallback do lokálního písma.
• Vlastnost unicode-range umožní vyfiltrovat stažení konkrétních znaků.
• Variabilní fonty jsou efektivní z pohledu datového objemu.
• Dělejte subsetting, omezení velikosti fontu.
• Používejte moderní stack, vycházející ze systémových písem.

Performance Culture (Martin Michálek)

• Performance Culture = způsob organizace firmy, směřující k rychlejšímu webu.
• Kdo může za pomalý web? Většinou je to management.
• Kde jste ve Web Performance Maturity Model?
• Co je nejdůležitější? Aby byla rychlost řízena jako projekt a aby rychlost dostala peníze a čas.
• Jaké argumenty fungují? Vliv rychlosti na konverze.

Performance Culture (panelová diskuze)

• Martin Michálek (PageSpeed.cz)
• Libor Vaněk (CDN77)
• Martin Kocourek (Sazka.cz)

Podívejte se na playlist z celé akce.

WebPerf.cz #2
(Bratislava, ESET, 22. 5. 2024)

Druhý meetup fanoušků rychlých webů se odehrál v krásných prostorách bratislavského ESETu:

Fixing developer experience: Vite a optimalizace performance (Milan Holeš)

• Rychlost může být také o rychlosti kompilování u vývojáře.
• Vite.js je velmi rychlý, tak proč bývá občas pomalý?
• Jak postupovat, aby se rychlost zlepšila?
• Pozor na „barrel files“.

Hydratace React aplikace: klíč k optimalizaci INP (Michal Matuška)

• Co je metrika INP a jak se měří?
• Jak funguje hydratace v Reactu? Render/commit fáze.
• Komponenty + HTML + data = hydratace.
• Jaký vliv má hydratace na INP?
• Jak optimalizovat? Bacha na velký DOM, lazy loading, React.lazy(), konkurenční rendering, Suspense.

Ako web performance zlepšuje výsledky online kampaní (Vladimír Cintula)

• Pár milisekund může mít vliv na UX.
• Vyšší rychlost = nižší cena za proklik v PPC.
• Ad Rank = CPC bid * Quality Score (součástí je rychlost).
• V Riešenia změřili 25 svých e-commerce projektů.
• S každým sekundovým zpožděním načtení vzroste bounce rate o 3,61 %.
• S každým sekundovým zpožděním načtení se zhorší konverzní poměr o 0,4 %.

Web performance a SEO (Tomáš Ďurovič)

• Co jsou podstatné metriky rychlosti pro SEO.
• John Mueller z Googlu říká, že zelené metriky jsou maximální boost, oranžové podle hodnoty, červené žádný boost.
• Rychlost není určitě jeden z top ranking faktorů.
• Důležitá je pro SEO také metrika rychlosti odezvy serveru, TTFB.
• Rychlost může mít vliv také na vnímání značky nebo ochotu vrátit se (dwell time).
• Důležitý obsah musí vždy být dostupný ve zdrojovém kódu. Roboti vyhledávačů neklikají, nescrollují.
• Megamenu je důležité pro interní prolinkování.
• Důležité je mít proindexované obrázky, takže odkazy na ně nevkládat pomocí JS.

Dva meetupy a tolik znalostí! A navíc… tolik zajímavých rozhovorů během networkingu.

Jsme moc rádi, že jsme mohli být při vzniku této nové komunity.

Co dále?

• Na podzim chystáme další meetup v Praze.
• Chcete se o našich akcích dozvědět jako první? Sledujte nás na Meetup.com.
• Všechny videa z budoucích akcí se budou objevovat na našem YouTube kanálu.
• Komunita má také svůj vznikající Slack.