CLS 0.21 -> 0.02 by fixing font metrics
Cumulative Layout Shift scores unexpected movement; the fallback font was a different size than the web font.
— Text reflowed when the web font swapped in at 900ms, shifting everything below by 0.19
— Added size-adjust + ascent-override to the @font-face to match fallback metrics
— Swapped font-display: swap reasoning: kept it, but the metric override killed the shift
No layout movement now even though the font still loads late.
Takeaway: CLS 0.02 — match fallback metrics, don't block on the font.
Millisecond Mafia
@MillisecondMafia
CLS 0.21 -> 0.02 by fixing font metrics
Этот пост опубликован в Telegram-канале Millisecond Mafia. Подписаться можно по ссылке: @MillisecondMafia.