0

谷歌报告我的网站有一个很大的 CLS,所以我正在检查网站的加载方式。我注意到在打印出 HTML 之前加载了 CSS。这怎么可能?不是应该先加载HTML文档,再加载所有资源吗?

在我的情况下,问题在于元素的顺序,在我的 HTML 中:

  • 首先是标题
  • 然后是页脚
  • 然后是内容。

然后 CSS 将页脚定位到底部(这完全是因为 z-indexes 和固定的页脚位置)。

我设置了网络和 CPU 限制,我在检查器中看到 HTML 文档正在加载和添加新的 HTML 元素,而网站已经在设置样式。这是正常行为吗?我的网站使用 Smarty 生成 HTML,它可能是连接的吗?

4

2 回答 2

2

对我来说听起来很正常。

您脑海中的任何样式 javascript 等都会带来成本。

您的 HTML 文档会从上到下读取。记住这一点。所以你放在头上的东西会先出现。

如果您试图实现无缝加载美学但保持相对较快的速度,您应该阅读上述折叠和延迟加载。

从本质上讲,这是您只加载关键内容以使页面立即按预期显示并将其他所有内容留在 HTML 底部以供稍后加载的地方,以确保用户可以相当快速地看到和使用有形的东西。

于 2021-08-25T14:51:34.623 回答
0

我过去用于类似情况的一种潜在解决方法是显示完全不透明的全页面加载覆盖,直到页面的所有部分都完全加载。

于 2021-08-25T14:51:42.013 回答