谷歌PageSpeed Insights速度得分指标CLS讲解

根据你提供的内容进行：

累积布局偏移（CumulativeLayoutShift，CLS）是谷歌现在非常关注的一个指标，因为它直接影响到客户的网页体验度。在2021年8月，页面体验度被升级到了主核心算法中的一个重要考评维度。那么，什么是累积布局偏移呢？当你在浏览某个网页时，原本在顶部的一行文字突然被挤到了下面，原来顶部显示文字的地方可能被其他内容所占据。这种情况通常是由于异步加载资源或DOM元素动态添加到现有内容页面的上方而发生的。造成这种情况的“罪魁祸首”往往是尺寸未知的图像或视频，或者呈现比其后备更大或更小的字体，或者是动态调整自身大小的第三方广告或小部件。

CLS会测量在页面的生命周期中版式发生意外位移的所有布局位移分数的总和。为了提高速度测评项目的分值，我们可以采取一些相关手段来避免布局意外移动。一些指导优化原则：

1. 确保在图片和视频元素上添加size属性，或者至少使用CSS宽高比来保留所需的空间。这种方法可以确保浏览器在加载图像时能够分配正确的空间量。

2. 避免在现有内容上方插入内容，除非是相应用户的交互。这样可以预期任何版式的移动位置，从而减少布局意外移动的发生。

请注意，以上内容仅作为参考信息，并不代表港勤的观点和立场。