输入url到渲染出页面的过程

输入地址

浏览器查找域名的 IP 地址

这一步包括 DNS 具体的查找过程，包括：浏览器缓存->系统缓存->路由器缓存...

浏览器向 web 服务器发送一个 HTTP 请求

服务器的永久重定向响应（从 http://example.com 到 http://www.example.com）

浏览器跟踪重定向地址

服务器处理请求

服务器返回一个 HTTP 响应

浏览器显示 HTML

浏览器发送请求获取嵌入在 HTML 中的资源（如图片、音频、视频、CSS、JS等等）

浏览器发送异步请求

 

 

 

1、我们开始在浏览器中输入网址的时候，浏览器其实就已经在智能的匹配可能得 url 了，他会从历史记录，书签等地方，找到已经输入的字符串可能对应的 url，然后给出智能提示。

2、在例如输入了 baidu 或者 qq 之类的域名后，我们可以按下 ctrl + enter ，来自动补全，生成 qq.com 或者 baidu.com 的网址，然后发起请求。请求一旦发起，浏览器首先要做的事情就是解析这个域名，一般来说，浏览器会首先查看本地硬盘的 hosts 文件，看看其中有没有和这个域名对应的规则，如果有的话就直接使用 hosts 文件里面的 ip 地址，说道这里，大家可能想到，这个地方就存在安全隐患了，如果有病毒把一些常用的域名，修改 hosts  文件，指向一些恶意的 ip，那么浏览器也会不加判断的去连接，是的，这正是很多病毒的惯用手法。如果在本地的 hosts 文件没有能够找到对应的 ip 地址，浏览器会向 dns 域名解析服务器发起域名解析请求，dns 的域名解析是递归的，（还有另外 dns 是迭代的），递归的 dns 首先会查看自己的 dns 缓存，如果缓存能够命中，那么就从缓存中把 ip 地址返回给浏览器，如果找不到对应的域名的 ip 地址，那么就向上转发请求，不管怎么说，这个递归查询的过程，对于浏览器来说是透明的，他只要坐等 ip地址送回来就可以了。

3、得到 ip 地址后，浏览器会开始构造一个 http 请求，一个典型的 http request header 一般需要包括请求的方法，例如 GET 或者 POST 等，不常用的还有 PUT 和 DELETE 方法，更加不常用的还有 HEAD 和 OPTION 以及 TRACE 方法，一般的浏览器只能发起 GET 或者 POST 请求，

应用层的 http 请求准备好后，

浏览器在传输层发起一条到达服务器的 tcp 连接，这个时候应该开始三次握手的过程，tcp 包被封装到网络层的 ip 包里面，ip 包再被封装到数据链路层的数据帧结构中，再通过物理层的比特流送出去，这些分层的意义在于分工合作，数据链路层通过 CSMA/CD 协议保证了相邻两台主机之间的数据报文传递，而网络层的 ip 数据包通过不同子网之间的路由器的路由算法和路由转发，保证了互联网上两台遥远主机之间的点对点的通讯，不过这种传输不可靠，于是可靠性就由传输层的 tcp 协议来保证，tcp 通过慢开始，乘法减小等手段来进行流量控制和拥塞避免，同时提供了两台遥远主机上进程到进程的通信，最终保证了 http 的请求头能够被远方的服务器上正在监听的 http 服务器进程收到，终于，数据包在跳与跳之间被拆了又封装，在子网与子网之间被转发了又转发，最后进入了服务器的操作系统的缓冲区，服务器的操作系统由此给正在被阻塞住的 accept 函数一个返回，将他唤醒。

4、http 服务器首先会查看重写规则，然后如果是文件真实存在，例如一些图片，或者 css js 等的静态文件，就会直接把这个文件返回

5、历经千辛万苦，我们请求的响应终于到达了客户端的浏览器，响应到达浏览器之后，浏览器首先判断状态码，如果是 200 开头的就好办，直接进入渲染流程，如果是 300 开头的就要去相应头里面找 location 域，根据这个 location 的指引，进行跳转，这里跳转需要开启一个跳转计数器，是为了避免两个或者多个页面之间形成的循环的跳转，当跳转次数过多之后，浏览器会报错，同时停止。如果是 400 开头或者 500 开头的状态码，浏览器也会给出一个错误页面。

当浏览得到一个正确的 200 响应之后，接下来面临的一个问题就是多国语言的编码解析了。

6、解决了字符集的问题，接下来就是构建 dom 树了，构建出来的 dom 本质上还是一棵抽象的逻辑树，构建 dom 树的过程中，如果遇到了由 script 标签包起来的 js 动态脚本代码，那么会把代码送到 js 引擎里面去跑，如果遇到了 style 标签包围起来的 css 代码，也会保存下来，用于稍后的渲染。如果遇到了 img 等引用外部文件的标签，那么浏览器会根据指定的 url 再次发起一个新的 http 请求，去把这个文件拉取回来，值得一提的是，对于同一个域名下的下载过程来说，浏览器一般允许的并发请求是有限的，通常控制在两个左右，所以如果有很多的图片的话，一般出于优化的目的，都会把这些图片使用一台静态文件的服务器来保存起来，负责响应，从而减少主服务器的压力。

7、dom 树构造好了之后，就是根据 dom 树和 css 样式表来构造 render 树了，这个才是真正的用于渲染到页面上的一个一个的矩形框的树，对于 render 树上每一个框，需要确定他的 x y 坐标，尺寸，边框，字体，形态，等等诸多方面的东西，render 树一旦构建完成，整个页面也就准备好了。

需要说明的是，下载页面，构建 dom 树，构建 render 树这三个步骤，实际上并不是严格的先后顺序的，为了加快速度，提高效率，让用户不要等那么久，现在一般都并行的往前推进的，现代的浏览器都是一边下载，下载到了一点数据就开始构建 dom 树，也一边开始构建 render 树，构建了一点就显示一点出来，这样用户看起来就不用等待那么久了。