content-visibility, measured on a real page
One property that tells the browser to skip work for anything off screen. The numbers are good, and the caveats are real.
On a long article page, content-visibility: auto cut our style and layout time by roughly 60%. The browser simply stops laying out sections nobody can see.
The catch is that skipped sections have no height until they are rendered, so the scrollbar jumps unless you tell it what to expect.
.section {
content-visibility: auto;
contain-intrinsic-size: auto 720px;
}It breaks in-page search
Browsers have improved find-in-page for skipped content, but it is not universal. Test Ctrl+F on the page before you ship it.