Explanatory article here: https://web.dev/articles/content-visibility
tl;dr, if you add content-visibility: auto; to container elements, entities, blocks, and layout builder regions are the obvious ones, then chrome >= 85 won't render it until it comes into the viewport, dramatically speeding up total page rendering and time to interactivity.
content-visibility: auto;
contain-intrinsic-size: auto 300px;
A classic example where this would help us is comment rendering, especially the infamous https://drupal.org/node/2429699 which nearly crashes my browser every time I load it.
However it would also help less dramatically but still a lot on teaser listings, large pages built with layouts, and we could probably use it for rows in tables on views admin pages and large forms like the permissions form maybe.
There doesn't seem to be any downside to using this, so I think we should apply it to all the places that make sense at least in Claro, Olivero, and Umami. However it's tempting to add the CSS in system module somewhere so that everywhere can just add a class. It's also a bit tempting to add that class centrally too, but we could discuss whether to do that in a follow-up and just apply it to individual themes for now.
Closed: duplicate
11.0 🔥
One thing that made me hesitate here is that the article above only mentioned this was being considered for Chrome, but @naeluh pointed out that caniuse shows broad support (and this would gracefully degrade to the current behavior anyway).
Duplicate of 🌱 Consider using the "content-visibility" property as a progressive performance enhancement Active .