CSS 内容可见性是否会提高图像解码时间？

Question

CSS content-visibility 属性是否可以改善 Chrome 等浏览器中的图像解码时间？

Answer 1

至少从 Chrome 浏览器的角度来看，不认为使用 content-visibility:auto 可以显着节省图像解码。

content-visibility 允许我们现在在它们不在屏幕时设置布局样式，从而提供渲染优势。然而，当涉及到图像解码时，需要记住两个主要的事情：图像是否被绘制？我们是否对使用此图像的内容进行了栅格化？

对于第一点，我们确实不会为content-visibility 受影响的图像绘制图像内容，因此这里可能会节省一些小额费用。然而，在光栅化时，我们只对光栅化所需的图像进行解码。我们只保留视口周围的一小块区域。这意味着，无论是否设置了内容可见性，我们都不太可能解码一个更远的离屏图像。

注意：对于绘画，可能存在浏览器解码图像的情况（例如确定我们是否应该将其反转为深色主题）。但是，这些情况很少见，因为我们希望避免在绘制时进行解码。