在Chromium 85中,content-visibility属性可能是在提高页面加载性能方面最具影响力的新CSS属性之一。因为content-visibility-auto可跳过不在屏幕上的内容渲染,包括布局和渲染,直到真正需要布局渲染的时候为止。所以利用它可以使初始用户加载速度更快,还能与屏幕上的内容进行更快的交互。
它有三个值:
visible — 元素渲染正常进行
hidden — 跳过元素渲染时,无论是在屏幕外还是在屏幕上
auto — 当元素在屏幕外时,将跳过其渲染; 当它出现在屏幕上时,将自动渲染