1.CSS和JS在网页中的放置顺序是怎样的?
css放置与<header>处,JS放置在<body>的末尾
2.解释白屏和FOUC
- 白屏:CSS在HTML之后加载便会出现白屏现象
- FOUC(无样式内容闪烁):加载一部分CSS内容便进行对应DOM的渲染,而不是等CSS完全加载后渲染
3.async和defer的作用是什么?有什么区别
- 作用:并行加载
- async:加载和渲染后续文档元素的过程将和js的加载与执行并行进行
- defer:加载和渲染后续文档元素的过程将和js的加载与执行并行进行,但js的执行要在所有元素解析完成之后,DOMContentLoaded时间触发之前完成
- 区别:js执行的时间点有点区别
4.简述网页的渲染机制
- 解析HTML标签,构建DOM树
- 解析CSS标签,构建CSSOM树
- 把DOM和CSSOM组合成渲染树(render tree)
- 在渲染树的基础上进行布局,计算每个节点的几何结构
- 把每个节点绘制到屏幕上