pengzhanbo
634字约2分钟
2022-04-14
提问
无样式内容闪烁
由于浏览器的渲染机制,在CSS加载之前,先呈现了HTML,就会导致展示出无样式的内容,然后样式突然呈现的现象。 这个问题出现的原因是由于CSS加载时间过长,或者CSS被放在了文档的底部。
白屏
有些浏览器渲染机制要先构建DOM树和 CSSOM树,构建完成后在进行渲染,如果CSS部分放在HTML尾部,由于CSS加载未完成, 浏览器迟迟未渲染,从而导致白屏;也可能是把JS文件放在头部,脚本的加载会阻塞后面文档的内容解析,从而页面迟迟未 渲染出来,导致了白屏问题。
优化关键渲染路径,首要是尽快完成首次渲染。要达到这个目的,就需要尽快让 文档解析完成并渲染。
所以需要最大限度的减小以下三种可变因素:
优化关键路径的常规步骤如下: