WebKit资源加载机制
资源
网络和资源加载是网页的加载和渲染过程中的第一步，也是必不可少的一步。网页本身就是一种资源，而且网页一般还需要依赖很多其他类型的资源。因为资源的加载涉及网络和资源的缓存等机制，而且它们在整个渲染过程中占的比例并不少。
WebKit如何获取资源以及如何高效地管理资源
HTML支持的资源主要有一下类型：
- HTML: HTML页面，包括各式各样的HTML元素
- JavaScript: JavaScript代码，可以内嵌在HTML文件中，也可以单独的文件存在
- CSS样式表：CSS样式资源
- 图片： 各种编码格式的图片资源，包括png、jpeg等。
- SVG: 用于绘制SVG的2D矢量图形表示。
- CSS Shader: 支持CSS Shader文件，目前WebKit支持该功能。
- 视频、音频和字幕：多媒体资源及支持音视频的字幕文件。
- 字体文件： CSS支持自定义字体，CSS3引入的自定义字体文件。
-
XSL样式表： 使用XSLT语言编写的XSLT代码文件。
上面这些资源在WebKit中均有不同的类来表示它们，它们的公共基类是CachedResource。
image.png
资源缓存
资源的缓存机制是提高资源使用效率的有效方法。它的基本思想是建立一个资源的缓存池，当WebKit需要请求资源的时候，先从资源池中查找是否存在相应的资源。如果有，WebKit则取出以便使用；如果没有，WebKit创建一个新的CachedResource子类的对象，并发送真正的请求给服务器，WebKit收到资源后将其设置到该资源类的对象中去，以便于缓存后下次使用。这里的缓存指的是内存缓存，而不同于后面在网络栈部分的磁盘缓存。
image.png
资源加载器
WebKit总共有三种类型的加载器
-
针对每种资源类型的特定加载器，其特点是仅加载某一种资源。
image.png
-
-
资源缓存机制的资源加载器的特点是所有特定加载器都共享它来查找并插入缓存资源，CachedResourceLoader类。
image.png
-
- 通用的资源加载器 ResourceLoader类，是在WebKit需要从网络或者文件系统获取资源的时候使用该类只负责获得资源的数据，因此被所有特定资源加载器所共享。
Chromium多进程资源加载
Chromium采用的是多进程的资源加载机制
image.png
网络栈
- WebKit的网络设施
WebKit的资源加载其实是交由各个移植来实现的，所以WebCore其实并没有什么特别的基础设施，每个移植的网络实现是非常不一样的。
高效地资源使用策略
- DNS 和 TCP连接
减少链接的重定向。有些网页中使用了大量的重定向，可能还会有很多次重定向，这不仅要求浏览器建立多次链接，同时也需要多次DNS解析，这会阻碍DNS预取技术的应用，应该尽量避免。
利用DNS预取机制。网页的开发者当然知道需要链接的URL，为了让浏览器也知道这些链接，开发者可以指定需要预取的URL
搭建支持SPDY协议的服务器，当然指的是那些需要使用HTTPS协议的网站
避免错误的链接请求。有些网页中包含了一些失效的链接，当浏览器试图获取链接对应的资源的时候，就会占用网络资源。
-
资源的数量
通过减少网页中需要的资源数量来改善网页的加载：
在HTML网页中内嵌小型的资源，也就是当资源比较小的时候，开发者可以将它们直接放在网页中，可能的资源如CSS、JavaScript和图片等。对图片而言，当图片比较小的时候，开发者可以通过base64编码技术将它变成字符串，直接放入网页中。
合并一些资源，将小图片合并成一张大的图片使用，因为我们知道浏览器建立TCP连接需要比较长的时间，所以这样做不仅能减少TCP连接建立的数量，而且对后面的渲染也会有帮助。 -
资源的数据量
对于每个资源而言，可以通过减少它的数据量来提高网页的加载速度：
- 使用浏览器本地磁盘缓存机制。因为我们知道HTTP协议支持资源的失效机制，可以通过对资源设置适当的失效期来减少浏览器对资源的重复获取
- 启用资源的压缩技术。对于图片资源而言，可以使用zip压缩技术，然后在HTTP消息头中说明该资源经过压缩，这样可以有效减少网络传输的数据量。
PageSpeed是一个非常有用的资源加载性能分析工具。
网友评论