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

输入地址

浏览器查找域名的 IP 地址

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

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

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

浏览器跟踪重定向地址

服务器处理请求

服务器返回一个 HTTP 响应

浏览器显示 HTML

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

浏览器发送异步请求

 

 

 

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

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

三、获得 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 函数一个返回，将他唤醒。

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

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

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

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

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

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