Optimizing CLS: Unsized Images, Late Content, Font Swaps and @defer Placeholders
To lower CLS, reserve the space of every piece of late content from the start: sized images, placeholders at their final size and skeletons. We measure the impact × distance calculation of the "Similar books" block added to Bookstore's book page, show that @defer (on viewport) moves the shift to the moment the user scrolls (0.1079 on a phone), and bring CLS to 0 in every scenario with a slot, a skeleton and a margin-collapse fix.
15 Nov 2026
·
14 min
·
7
