Webkit底层原理(2)--资源加载和网络栈
版权声明：本文为博主原创文章，遵循 CC 4.0 BY-SA 版权协议，转载请附上原文出处链接和本声明。
本文链接：[https://blog.csdn.net/caomage/article/details/101990551](https://blog.csdn.net/caomage/article/details/101990551) 资源加载和网络栈
使用网络栈下载网页和网页中的资源是渲染引擎工作的第一步，也是非常耗时间的一步。
一、Webkit资源加载机制
1. 资源
网页本身就是一种资源，例如图片、视频等。HTML支持的资源主要有以下类型：
- HTML：HTML元素；
- JavaScript：JavaScript代码，可以内嵌在HTML文件中，也可以单独以文件形式存在；
- CSS：层叠样式表，可以内嵌在HTML文件中，也可以单独以文件形式存在；
- 图片：各种编码格式的图片；
- SVG：用于绘制SVG的2D矢量图形表示；
- 字体文件：CSS3支持自定义字体； ……
2. 资源缓存
资源的缓存机制是提高资源使用效率的有效方法。它的基本思想是建立一个资源的缓存池，当Webkit需要请求资源的时候，先从资源池中查找相应的资源，如果存在，测从资源池中取，如果不存在，则发送请求到服务器获取。如下图：
3. 资源加载器
按照加载器的类型，Webkit一共有三种类型的加载器：
- 针对每种资源类型的特定加载器，其特点是仅加载某一种特定的资源。例如：图片加载器、字体加载器；
- 资源缓存机制的资源加载器，其特点是所有特定加载器都共享它来查找并插入缓存资源。特定加载器先通过缓存机制的资源加载器来查找是否有缓存资源；
- 通用资源加载器，Webkit需要从网络或者文件系统获取资源的时候使用它，因此它被所有的特定资源加载器共享。
4. 整个加载资源的过程
具体的加载过程可以看之前我写的一篇关于浏览器缓存原理的文章，很详细！
二、Chromium多进程资源加载
资源的实际加载在各个Webkit移植中有不同的实现。Chromium采用的是多进程的资源加载机制。Renderer进程在网页的加载过程中需要获取资源，但是由于安全性和效率上的考虑，Renderer进程的资源获取实际上是通过进程间通信将任务交给Browser进程来完成，Browser进程有权限从网络或者本地获取资源。
三、网络栈
1. 网络栈的基本组成
网络栈的基本组成如下图：
2. 网络栈的调用过程
首先是URLRequest被上层调用并启动的时候，它会根据URL的scheme来决定需要创建什么类型的请求。scheme就是URL的协议类型，例如：“http://” 、“file://”，也可以是自定义的协议。其次，会创建一个对象URLRequestHttpJob，该对象从Cookie管理器获取与该URL相关联的信息。之后，开启一个HTTP连接的事务。再然后是建立套接字。如果用户设置了代理，则还需要其他代理相关的对象提供支持。
3. 域名解析（DNS）
通常情况下，用户都是使用域名来访问网络资源的，所以在建立TCP连接前需要解析域名。当然，Chromium使用一个单独的线程来处理它。同样，为了考虑效率，也会使用相应缓存对象对域名和地址映射关系进行保存。我们可以在地址栏输入：chrome://net-internals/#dns来清除Chrome浏览器的DNS缓存信息。
4. Cookie机制
Cookie是一项很古老的技术，因为简单易用，所以从诞生就收到广泛的应用。Cookie格式就是一系列的键值对，如下：
test=webkit;test2=chromium;Expires=2019-10-19T10:33:18.797Z;Domain=.test.con
其中test和test2是自定义关键字，Expires和Domain是预定义关键字，表示失效时间和该Cookie对应的域。基于安全性考虑，一个网页的Cookie只能被该网站自身访问。根据失效时间Cookie分为会话型（Session Cookie）和持久型（Persistent Cookie）。会话型当浏览器退出的时候即清除，没有失效时间的Cookie就是会话型。而持久型Cookie当浏览器退出的时候仍然保留，直到失效时间。在有效期内，每次访问服务器，浏览器都自动将Cookie带上。
5. 高性能网络栈-DNS预取和TCP预连接（preconnect）
DNS预取技术，主要思想是利用现有的DNS机制，提前解析网页中可能的网络连接。具体来讲，当用户正在浏览当前网页的时候，Chromium提取网页中的超链接，将域名抽取出来，利用比较少的CPU和网络带宽来解析这些域名或IP地址，用户根本感觉不到这一过程。当用户点击这些超链接的时候会省不少时间。
写网页的时候可以指定预取哪些域名，具体做法是：
<link rel="dns-prefetch" href="http://test.com">
当然，DNS预取技术不仅应用于网页中的超链接，当用户在地址栏中输入地址后，候选项同输入的地址很匹配的时候，在用户敲下回车键之前，Chromium已经开始使用DNS预取技术解析该域名了。