从输入一个URL到页面渲染的流程简介

首先说明如下是我参考网上答案和本身的思考，给出本身的想法，若是有问题，欢迎你们吐槽
从用户在浏览器中输入一个URL，到整个页面渲染，这个过程当中究竟发生了什么呢？今天先简单写下整个过程，后面再一点点完善。

1、获取IP地址

为何要获取IP地址？

IP地址对应一台真实的物理机器，并且IP地址就像人的身份证是惟一的，用户请求服务器，只须要输入为该服务器分配的惟一的IP地址便可。但因为IP地址不便于记忆，于是使用较为语义化的域名来替代IP地址，并且一个域名可能对应了对个IP地址，好比用户输入www.baidu.com,该域名下对应了多个IP，域名解析服务器会根据必定的规则分配给用户其中一个IP地址。

1. 首先会在浏览器的缓存中查找，是否缓存了URL，若是有，就直接向该URL对应的服务器发送请求；若是没有则进行下一步;
2. 在本地的hosts文件中是否保存了该URL和其对应的IP地址，若是保存了，就直接向该URL对应的服务器发送请求；若是没有则进行下一步；
3. 向本地DNS服务器（通常由本地网络接入服务器提供商提供，好比移动）发送DNS请求，本地DNS服务器会首先查询它的缓存记录，若是有就将该域名对应的IP地址返回给用户，若是没有则进行下一步；
4. 首先向根域名服务器发送DNS查询请求，根域名服务器返回给可能保存了该域名的一级域名服务器地址；本地主机再根据返回的地址，向一级域名服务器发送DNS查询请求；...一直迭代，直到找到对应的域名存放的服务器，向其发送DNS查询请求，该域名服务器返回该域名对应的IP地址；

2、TCP/IP链接

三次握手：

为何要进行三次握手？若是是两次握手，以下面的对话只有前两句，有可能出现的问题是：客户端以前发送了一个链接请求报文，因为网络缘由滞留在网络中，后来到达服务器端，服务器接收到该请求，就会创建链接，等待客户端传送数据。而此时客户端压根就不知道发生了什么，白白形成了服务器资源浪费。

注：图片来源于https://baijiahao.baidu.com/s...

1. 客户端：我要请求数据能够吗？
2. 服务器：能够的
3. 客户端：好的

3、浏览器向web服务器发送http请求

客户机与服务器创建链接后就能够通讯了，这里就暂时先不详细展开说http请求了。讲下客户端请求静态资源和动态资源。

1. 静态资源：若是客户端请求的是静态资源，则web服务器根据URL地址到服务器的对应路径下查找文件，而后给客户端返回一个HTTP响应，包括状态行、响应头和响应正文。
2. 动态资源：若是客户端请求的是动态资源，则web服务器会调用CGI/VM执行程序完成相应的操做，如查询数据库，而后返回查询结果数据集，并将运行的结果--HTML文件返回给web服务器。Web服务器再将HTML文件返回给用户。

4、浏览器渲染

浏览器拿到HTML文件后，根据渲染规则进行渲染：

1. 解析HTML，构建DOM树
2. 解析CSS，生成CSS规则树
3. 合并DOM树和CSS规则树，生成render树
4. 布局render树
5. 绘制render数、树，即绘制页面像素信息
6. GPU将各层合成，结果呈如今浏览器窗口中。

5、四次挥手

客户端没有数据发送时就须要断开链接，以释放服务器资源。

注：图片来源于https://baijiahao.baidu.com/s...

1. 客户端：我没有数据要发送了，打算断开链接
2. 服务器：你的请求我收到了，我这还有数据没有发送完成，你等下
3. 服务器：个人数据发送完毕，能够断开链接了
4. 客户端：ok，你断开链接吧（客户端独白：我将在2倍的最大报文段生存时间后关闭链接。若是我再次收到服务器的消息，我就知道服务器没有收到个人这句话，我就再发送一遍）。

最终服务器收到该客户端发送的消息断开链接，客户端也关闭链接。