我们都可能知道浏览器有一个渲染引擎,他可以渲染html,xml,还有一些图片,但是大部分人都不知道浏览器是如何渲染这些文件的,还有浏览器安装安装一个扩展可以打开pdf,是如何做到的呢?
一、首先 浏览器引擎通过网络获取到html ,
1、解析html 转化为dom;
2、解析css 转化为cssom;
3、结合dom 和cssom 生成一颗渲染 tree,并且生成每一个节点的视觉信息;
4、生成布局(layout),将所有的渲染tree的节点进行平面合成;
5、将布局绘制(paint)屏幕上;
1-3步的速度是非常快的,4-5步比较耗时;
生成布局(flow)和绘制(paint)这两步,合成为“render”渲染;
二、重绘和重排
1、页面生成时候,最少渲染一次页面,用户访问过程中,在继续渲染;
在以下情况中会发生重绘:
1、用户点击事件
2、修改dom
2、修改样式表
重新渲染 就是需要重新布局重新绘制,重绘不一定会重排;但是重排一定会重绘;