从输入url到页面显示的过程（简化）

流程概述

1. URL

在浏览器地址栏内输入url地址

2. DNS

Domain Name System 域名解析系统，DNS解析就是域名解析。

2.1 查找缓存 cache

1. Browser，从浏览器缓存内查找DNS缓存
2. Operation System，从操作系统内查找DNS缓存
3. Router，从本地路由器内查找DNS缓存
4. ISP (internet service provider)，1 2 3 都没有，就会发送到ISP，ISP有更大范围的DNS缓存

2.2 递归查找

1. 根域名服务器，DNS查询会先发送到根域名服务器，根域名服务器重定向到管理.com.cn.net域名的顶级服务器
2. 顶级域名服务器（TDL服务器），顶级域名服务器再转向权威域名服务器
3. 权威域名服务器，此服务器有该域名正确的IP地址

2.3 返回ip地址

• 权威服务器把查到的IP，返回到客户电脑

2.4 递归查找

• 返回的IP，一般会被缓存到浏览器，操作系统，路由器和ISP缓存内，以便以后快速使用

3. TCP

TCP(Transmission Control Protocol) 传输控制协议，TCP是一种面向连接的协议，用于在网络中的两个端点之间建立可靠的会话，为HTTP请求提供准确/可靠的通讯通道。

3.1 TCP链接建立过程，俗称三次握手：

1. 第一次握手，client -> SYN包 -> server
2. 第二次握手，server -> SYN-ACK响应包 -> client
3. 第三次握手，client -> ACK包 -> server

4. requese

1. 请求头
2. 请求体
3. 请求方式

5. response

1. 响应头
2. 响应体

6. render

6.1 解析HTML CSS

HTML → DOM Tree →  合并domtree和cssom →  RenderTree 渲染树 →  →  →  →  → 绘制 →  →  →  → 显示
↓                        ↑               ↓ ↑                            ↓ ↑       
csslink → css → CssOM  → ↑               Layout 计算大小/位置      计算/合成生成布局树

6.2 渲染Render，布局layout，绘制Paint

6.3 composite 合成

1. 普通图层
2. 复合涂层，会开启GPU线程，图层单独绘制。如：fixed / transforms 旋转 透明度 / animation 动画 / will-change 高速浏览器那些属性会变化