浏览器渲染过程:
1.读取HTML和css,构建cssom树和dom树
,这两个是同步进行的。构建DOM树期间,如果遇到JS,阻塞DOM树及CSSOM树的构建,优先加载JS文件,加载完毕,再继续构建DOM树及CSSOM树。
2.构建渲染树
根据Dom树和cssom树来构建渲染树(Render Tree),设置为display:none的元素不在渲染树中。
3.重排、重绘:
重排(回流):当渲染树节点位置发生变化时(标签节点的宽、高、内外边距),重新生成渲染树,重排必定引起重绘,而重绘不一定会引起重排
重绘:当渲染树节点发生变化时,但是不影响节点位置时,比如颜色,字体等