content-visibility: the new CSS property that boosts your rendering performance
The content-visibility property is coming to Chome shortly and will help page load performance from within CSS alone. The new property will flag to the browser that it can skip the rendering work for its region until it’s needed. This means that if you’ve got a long list of blog posts, you could offset the render on those that are much further down the page allowing for the top blog post to complete rendering faster and provide a faster time to interactive.
The
An excerpt from content-visibility: the new CSS property that boosts your rendering performancecontent-visibility
property, launching in Chromium 85, might be one of the most impactful new CSS properties for improving page load performance.content-visibility
enables the user agent to skip an element’s rendering work, including layout and painting, until it is needed. Because rendering is skipped, if a large portion of your content is off-screen, leveraging thecontent-visibility
property makes the initial user load much faster. It also allows for faster interactions with the on-screen content. Pretty neat.