2022-09-19HTML00
请注意,本文编写于 614 天前,最后修改于 614 天前,其中某些信息可能已经过时。

渲染页面时常见哪些不良现象?(浏览器渲染过程)

  • FOUC:主要指的是样式闪烁的问题,由于浏览器渲染机制(比如firefox),在 CSS 加载之前,先呈现了 HTML,就会导致展示出无样式内容,然后样式突然呈现的现象。会出现这个问题的原因主要是 CSS 加载时间过长,或者 CSS 被放在了文档底部。

  • 白屏:有些浏览器渲染机制(比如chrome)要先构建 DOM 树和 CSSOM 树,构建完成后再进行渲染,如果 CSS 部分放在 HTML 尾部,由于 CSS 未加载完成,浏览器迟迟未渲染,从而导致白屏;也可能是把 JS 文件放在头部,脚本的加载会阻塞后面文档内容的解析,从而页面迟迟未渲染出来,出现白屏问题。

详细资料可以参考: 《前端魔法堂:解秘 FOUC》 《白屏问题和 FOUC》

本文作者:前端小毛

本文链接:

版权声明:本博客所有文章除特别声明外,均采用 BY-NC-SA 许可协议。转载请注明出处!