Saijo George

Curated by Saijo George

Read more

friday7 Aug 2020

content-visibility: The New CSS Property That Boosts Your Rendering Performance

content-visibility relies on primitives within the the CSS Containment Spec but  content-visibility is only supported in Chromium 85 for now.

This new property can help you improve initial load time by skipping the rendering of offscreen content. content-visibility enables the user agent to skip an element’s rendering work, including layout and painting, until it is needed. In their example, they see a boost from a 232ms rendering time to a 30ms rendering time. That’s a 7x performance boost.

The content-visibility property accepts several values, but auto is the one that provides immediate performance improvements.

Another use is thecontent-visibility: hiddenproperty which is an alternative to display: none and visibility: hidden.

Update 04/12/2020:

Looks like google supports both


Saijo's tl;dr marketing newsletter has a perfect balance. You are sure to get the best SEO news without being overwhelmed by them. v6.0 is Out 1 - SEO News

Jean-Christophe Chouinard Sr. SEO Specialist Seek