Chrome是如何打造高性能网络栈的?

·  阅读 290

image.png

在chrome的网络模块中有两个重要的目标,safety and speed,没错,就是安全与速度。这也是chrome一直坚持做的两件事。

DNS预取与TCP预连接

一次DNS查询的平均时间大概在60~120ms之间甚至更长,而TCP的三次握手的时间大概几十毫秒甚至更久。虽然是毫秒,看似很短,但是对于网页的渲染,已经是很长的时间了,那么如何有效的缩短这段时间就显得尤为重要了。而chrome给了我们它的答案————DNS预取和TCP预连接。

DNS预取

首先来看DNS预取技术。字面意思,就是利用现在的DNS机制,提前解析网页中可能的网络连接。简单来说,就是可能在你浏览网页的时候,chrome就会提取网页中的超链接,将所涉及的域名抽取出来,利用较少的CPU和网络带宽取解析这些域名,这样来看,就可以做到在用户无感知的情况下,快速打开这些链接,尤其在域名解析比较慢的时候,效果尤其明显。

DNS预取技术不是使用我们标题所说的网络栈😂,而是直接利用系统的域名解析机制,这样不回阻碍当前网络栈的工作。DNS预取技术针对多个域名采取并行处理的方式,每个域名的解析必须新开一个线程去处理,处理完会推出此线程。

同时,我们也可以指定哪些域名可以让chrome解析,如:

<link rel="dns-prefetch" href="http://xxx.com">
复制代码

除了在网页中预取DNS,chrome还会在你输入url后,按下回车键之前就已经开始DNS预取解析域名了

chrome会使用追踪技术取预测你从什么网页跳转到另一网页,这些会从你平时的使用习惯,规则,数据分析来分析预测,在有足够把握的时候,就会进行DNS预取,除了DNS预取外,chrome可能会在你输入url,撬下回车键之前就开始尝试建立TCP链接了。

HTTP管线化

正常来说,浏览器和服务端的通信是这样的:浏览器发送一个请求到服务器,等服务器回复后,才会发送下一个请求,这样做显然效率是极低的。

在http1.1中增加了http管线化技术。这是一项同时将多个http请求一次性提交给服务端的技术。因此无需等待回复,因为可能会将多个http请求填充在一个tcp数据包内。管线化需要通过永久连接,同时只有GET和HEAD等请求可以使用

image.png

SPDY

从上面了解到HTTP管线化有很大的局限性,所以这个SPDY就是未来弥补这个局限产生的,它主要的作用就是解决网络延迟和安全性问题。根据Google的官方数据显示,使用SPDY协议的服务器和客户端可以降网络加载时间减少64%。

SPDY协议所处的层次 image.png

SPDY的核心思想就是多路复用(我想就是现在所说HTPP2.0特性),仅用一个连接就可以传输网页中众多资源。它本质上并没有更改http协议,只是将http的协议头使用SPDY进行封装和传输。数据传输也还是使用TCP。使用方式:服务器只需要插入SPDY的解释层,然后从SPDY各个消息头获取哥哥资源的http头即可。其次SPDY协议必须建立在SSL层之上,它有四个比较大的特征:

  • 利用一个TCP连接传输不限个数的资源请求的数据读写流
  • 根据资源请求的的特性和优先级,SPDY会调整这些资源请求的优先级
  • 只对这些请求进行压缩
  • 当用户浏览某个网页时,支持SPDY的服务器会在发送网页内容时,尝试多发送一些信息给浏览器,告诉其后面可能需要哪些资源,浏览器可以提前知道并决定是否提前下载。极端情况下,服务器会主动发送资源

chrome引入SPDY后的网络栈后的三个不同点

  • 虚线框表示可能有多个SpdyStream和SpdyHttpStream对象,也就是多个流使用一个SpdySession绘画,同时使用一个socket连接,对多个Stream对象的管理、删除、创建、数量限制等都是由SpdySession来处理
  • 对于之前的一些类,Spdy有专门的实现,因为需要支持新的协议的关系。
  • SpdyHttpStream类继承自之前的HttpStream类,所充当的角色相同————就是一个HttpStream类,但是SpdyHttpStream类会对应一个SpdyStream并将Spdy协议部分等十几工作交给SpdyStream

image.png

本文内容取自《webkit技术内幕》

分类:
前端
标签:
分类:
前端
标签:
收藏成功!
已添加到「」, 点击更改