从输入一个网址到浏览器显示页面的全过程详细分析

整体来讲分为如下几个过程：

1. DNS解析
2. TCP链接
3. 发送HTTP请求
4. 服务器处理请求并返回HTTP报文
5. 浏览器解析渲染页面
6. 断开链接

也能够分为以下几个过程：

1.DNS解析，找到IP地址
2.根据IP地址，找到对应的服务器
3.创建TCP链接(里面有个 三次握手)
4.链接创建后，发出HTTP请求
5.服务器根据请求做出HTTP响应
6.浏览器获得响应内容，进行解析与渲染，并显示
7.断开链接(四次挥手)

以上整个过程叫一次HTTP事务

---

具体过程：

DNS解析

DNS解析的过程就是寻找哪台机器上有你所须要资源的过程。当你在浏览器中输入一个地址时，例如www.baidu.com，其实不是百度网站真正意义上的地址。互联网上每一台计算机的惟一标识是它的IP地址，可是IP地址并不方便记忆。用户更喜欢用方便记忆的网址去寻找互联网上的其它计算机，也就是上面提到的百度的网址(域名)。因此互联网设计者须要在用户的方便性与可用性方面作一个权衡，这个权衡就是一个网址到IP地址的转换，这个过程就是DNS解析。它实际上充当了一个翻译的角色，实现了网址到IP地址的转换。

---

解析过程
DNS解析是一个递归查询的过程
首先在本地域名服务器中查询IP地址，若是没有找到的状况下，本地域名服务器会向根域名服务器发送一个请求，若是根域名服务器也不存在该域名时，本地域名会向com顶级域名服务器发送一个请求，依次类推下去。直到最后本地域名服务器获得IP地址并把它缓存到本地，供下次查询使用。

---

DNS优化
了解了DNS的过程，能够为咱们带来哪些？上文中请求到IP地址时，经历了许多步骤，这个步骤中存在多个请求(同时存在UDP和TCP请求，为何有两种请求方式，请自行查找)。若是每次都通过这么多步骤，是否太耗时间？如何减小该过程的步骤呢？那就是DNS缓存。
DNS缓存
DNS存在着多级缓存，从离浏览器的距离排序的话，有如下几种: 浏览器缓存，系统缓存，路由器缓存，IPS服务器缓存，根域名服务器缓存，顶级域名服务器缓存，主域名服务器缓存

TCP链接

位于传输层的TCP协议为传输报文提供可靠的字节流服务。它为了方便传输，将大块的数据分割成以报文段为单位的数据包进行管理，并为它们编号，方便服务器接收时能准确地还原报文信息。TCP协议经过 “三次握手” (三次握手的具体内容请参考个人文章)等方法保证传输的安全可靠。

发送HTTP请求

HTTP请求包括请求报头和请求主体两个部分，其中请求报头包含了相当重要的信息，包括请求的方法（GET / POST）、目标url、遵循的协议（http / https / ftp…），返回的信息是否须要缓存，以及客户端是否发送cookie等。

服务器处理请求并返回HTTP报文

这部分对应的就是后端工程师眼中的HTTP。后端从在固定的端口接收到TCP报文开始，这一部分对应于编程语言中的socket。它会对TCP链接进行处理，对HTTP协议进行解析，并按照报文格式进一步封装成HTTP Request对象，供上层使用，这一部分工做通常是由Web服务器去进行。

HTTP响应报文是由三部分组成: 状态码, 响应报头 和 响应报文 。

浏览器解析渲染页面

浏览器在收到HTML,CSS,JS文件后，它是如何把页面呈现到屏幕上的？下图对应的就是WebKit渲染的过程。 浏览器是一个边解析边渲染的过程。首先浏览器解析HTML文件构建DOM树，而后解析CSS文件构建渲染树，等到渲染树构建完成后，浏览器开始布局渲染树并将其绘制到屏幕上。

JS的解析是由浏览器中的JS解析引擎完成的。JS是单线程运行，也就是说，在同一个时间内只能作一件事，全部的任务都须要排队，前一个任务结束，后一个任务才能开始。可是又存在某些任务比较耗时，如IO读写等，因此须要一种机制能够先执行排在后面的任务，这就是：同步任务(synchronous)和异步任务(asynchronous)。JS的执行机制就能够看作是一个主线程加上一个任务队列(task queue)。同步任务就是放在主线程上执行的任务，异步任务是放在任务队列中的任务。全部的同步任务在主线程上执行，造成一个执行栈;异步任务有了运行结果就会在任务队列中放置一个事件；脚本运行时先依次运行执行栈，而后会从任务队列里提取事件，运行任务队列中的任务，这个过程是不断重复的，因此又叫作事件循环(Event loop)。

---

浏览器在解析过程当中，若是遇到请求外部资源时，如图像,iconfont,JS等。浏览器将重复下载该资源。请求过程是异步的，并不会影响HTML文档进行加载，可是当文档加载过程当中遇到JS文件，HTML文档会挂起渲染过程，不只要等到文档中JS文件加载完毕还要等待解析执行完毕，才会继续HTML的渲染过程。缘由是由于JS有可能修改DOM结构，这就意味着JS执行完成前，后续全部资源的下载是没有必要的，这就是JS阻塞后续资源下载的根本缘由。CSS文件的加载不影响JS文件的加载，可是却影响JS文件的执行。JS代码执行前浏览器必须保证CSS文件已经下载并加载完毕。

断开链接

四次挥手 (四次挥手的具体内容请参考个人文章)

以上内容由于涉及的内容比较多，因此还有好多不足之处须要补充，在此请多多见谅

---

^_<