Skip to content
On this page

输入网址后会发生什么

当我们输入网址时,浏览器会对url进行解析,确定请求协议和请求的地址,如果出现非法字符会进行转译,如果带非法字符,会使用搜索,否则先会寻找该域名对应的IP地址,这里涉及到第一个知识点。

DNS查询

DNS的作用就是通过域名查询到具体的IP

当浏览器访问www.google.com时,会进行一下操作:

  1. 本地客户端先在本地缓存中查找IP
  2. 查找不到,则会到系统配置的DNS服务器(如8.8.4.4)中查询
  3. 如果还是查找不到,会直接到DNS根服务器(13个根,其中10个在美国,英国和瑞典各1个,日本1个)查询,会先找出负责com这个一级域名的服务器
  4. 然后回去该服务器查询google这个二级域名
  5. 接下来查询三级域名,其实也是我们自己配置的

以上是DNS的迭代查询,还有一种是递归查询,区别在于,前者是客户端发送请求,后者是系统配置的DNS服务器发送请求,得到结果再返回给客户端。

普通DNS查询基于UDP实现的原因?

  • 查询内容不超过512字节
  • 不需要TCP三次握手,负载更低,响应更快 DNS在进行区域传输的时候使用TCP协议?
  • 两种类型:主DNS服务器辅助DNS服务器
  • 当一个辅助DNS服务器启动时,它需要与主DNS服务器通信,并加载数据信息,这就叫做区域传送
  • 对准确性要求比较高,而且会产生大于512字节的数据包,因此使用TCP协议。

TCP连接

TCP连接过程

拿到IP地址后,接下来是 TCP 握手,应用层会下发数据给传输层,这里 TCP 协议会指明两端的端口号,然后下发给网络层。网络层中的 IP 协议会确定 IP 地址,并且指示了数据传输中如何跳转路由器。然后包会再被封装到数据链路层的数据帧结构中,最后就是物理层面的传输了。

HTTPS连接

HTTPS连接过程

当 TCP 握手结束后就会进行 TLS 握手,然后就开始正式的传输数据。

服务器响应

数据在进入服务端之前,可能还会先经过负责负载均衡的服务器,它的作用就是将请求合理的分发到多台服务器上,这时假设服务端会响应一个 HTML 文件。

常见HTTP状态码

首先浏览器会判断状态码是什么,如果是 200 那就继续解析,如果 400 或 500 的话就会报错,如果 300 的话会进行重定向,这里会有个重定向计数器,避免过多次的重定向,超过次数也会报错。

浏览器渲染

浏览器渲染流程

浏览器开始解析文件,如果是 gzip 格式的话会先解压一下,然后通过文件的编码格式知道该如何去解码文件。

文件解码成功后会正式开始渲染流程,先会根据 HTML 构建 DOM 树,有 CSS 的话会去构建 CSSOM 树。如果遇到 script 标签的话,会判断是否存在 async 或者 defer ,前者会并行进行下载并执行 JS,后者会先下载文件,然后等待 HTML 解析完成后顺序执行。

如果以上都没有,就会阻塞住渲染流程直到 JS 执行完毕。遇到文件下载的会去下载文件,这里如果使用 HTTP/2 协议的话会极大的提高多图的下载效率。

HTTP协议演进

CSSOM 树和 DOM 树构建完成后会开始生成 Render 树,这一步就是确定页面元素的布局、样式等等诸多方面的东西

在生成 Render 树的过程中,浏览器就开始调用 GPU 绘制,合成图层,将内容显示在屏幕上了。

这一部分就是渲染原理中讲解到的内容,可以详细的说明下这一过程。并且在下载文件时,也可以说下通过 HTTP/2 协议可以解决队头阻塞的问题。

MIT Licensed | Copyright © 2021 - 2022