LCP和页面呈现顺序

Question

我有个LCP问题我想弄清楚。

在我的页面模板中，有一个div，它是最后一个body dom元素。它意味着一个接受/拒绝cookie切换，所以虽然它是最后一个dom元素，但是它通过CSS定位为始终在初始页面加载/直到验收已经被接受的视图中。

当我在本地运行灯塔时，我发现它是LCP的最后一项。在我们实施它的时候，我们的LCP分数显著下降。

在这个场景中，因为它是最后一个body dom元素，这是否意味着CSS必须应用于所有较高的元素，然后才能到达该元素？如果是这样的话，将该元素移动为第一个body dom元素会有帮助吗？

Answer 1

有关优化LCP的一般建议，请参阅https://web.dev/optimize-lcp。

但是，由于这个问题是专门针对cookie同意书对话框的LCP的，本指南可能是最好的起点：https://web.dev/cookie-notice-best-practices/。关于如何以性能的方式加载这些对话框，有很多很好的建议--DOM顺序在其中所起的作用非常小(如果有的话)。