由于里面原理三两句讲不完,本文只罗列简要过程
1.网络部分:
- 构建请求
- 查找强缓存
- DNS解析
- 建立TCP连接(三次握手、四次挥手)
- 发送HTTP请求
- 网络响应
完成了网络请求和响应,如果响应头中Content-Type
的值是text/html
,那么接下来就是解析
和渲染
工作了。
2.解析部分:
- 构建DOM树
- 样式计算
- 生成布局树(Layout Tree)
3.渲染部分:
前面解析部分中,已经有了DOM节点、样式和位置,但是并不可以开始绘制页面,因为比如:一些3D动画如何呈现出变化效果、当元素含有层叠的时候如何显示和隐藏,为了姐姐这个问题,浏览器在构建完布局树之后,还会对特定的节点进行分层,构建一颗图层树。
-
建立图层树
-
生成绘制列表
-
生成图块并栅格化
-
显示器显示内容
重绘:过程5,6,7
回流:从goujianDOM树开始,整个过程