WebKit技术内幕(第三,四章读书笔记)

375 阅读4分钟

JavaScriptCore引擎是WebKit中的默认JavaScript引擎。 在Google的Chromium开源项目中,JavaScriptCore引擎被替换为V8引擎

WebKit资源加载机制

HTML,CSS, JavaScript,SVG等资源,WebKit中均有不同的类来表示它们,它们的公共基类是CachedResource。
资源的缓存机制是提高资源使用效率的有效方法。webkit的基本思想是建立一个资源的缓存池,当WebKit需要请求资源的时候,先从资源池中查找是否存在相应的资源。如果有,WebKit则取出以便使用;如果没有,WebKit创建一个新的CachedResource子类的对象,并发送真正的请求给服务器,WebKit收到资源后将其设置到该资源类的对象中去,以便于缓存后下次使用

资源的获取和加载不会阻碍当前WebKit的渲染过程,例如图片、CSS文件

JavaScript代码文件会严重影响WebKit下载资源的效率。因为后面可能还有许多需要下载的资源,WebKit怎么做呢? 因为主线程被阻碍了,后面的解析工作没有办法继续往下进行,所以对于HTML网页中后面使用的资源也没有办法知道并发送下载请求。当遇到这种情况的时候,WebKit的做法是这样的:当前的主线程被阻碍时,WebKit会启动另外一个线程去遍历后面的HTML网页,收集需要的资源URL,然后发送请求,这样就可以避免被阻碍。与此同时,WebKit能够并发下载这些资源,甚至并发下载JavaScript代码资源。这种机制对于网页的加载提速很是明显。

资源的生命周期:资源池是采用LRU(Least Recent Used最近最少使用)算法。与强缓存和协商缓存相结合。

Chromium采用的是多进程的资源加载机制。

高效的资源使用策略

DNS和TCP连接

(1) 减少链接的重定向 (2) 一次DNS查询的平均时间大概是60~120ms之间或者更长,而TCP的三次握手时间大概也是几十毫秒或者更长。看似一个很短的时间,但是相对于网页的渲染来说,这是一个非常长的时间。如何有效地减少这段时间,Chromium给出了自己的答案——DNS预取和TCP预连接。
首先是DNS预取技术。它的主要思想是利用现有的DNS机制,提前解析网页中可能的网络连接。具体来讲,当用户正在浏览当前网页的时候,Chromium提取网页中的超链接,将域名抽取出来,利用比较少的CPU和网络带宽来解析这些域名或IP地址,这样一来,用户根本感觉不到这一过程。当用户单击这些链接的时候,可以节省不少时间,特别在域名解析比较慢的时候,效果特别明显。
具体做法如下所示:<link rel=“dns-prefetch”href=“this-is-a-dns-prefetch-example.com”> DNS预取技术不仅应用于网页中的超链接,当用户在地址栏中输入地址后,候选项同输入的地址很匹配的时候,在用户敲下回车键获取该网页之前,Chromium已经开始使用DNS预取技术解析该域名了,更进一步,还可以预先建立TCP连接.
管线化(Pipelining)技术,Chromium当然也支持这一技术,但它需要服务器的支持,两者配合才能实现HTTP管线化。HTTP管线化技术是一项同时将多个HTTP请求一次性提交给服务器的技术,因此无需等待服务器的回复,因为它可能将多个HTTP请求填充在一个TCP数据包内.
(3)搭建支持SPDY协议的服务器 SPDY就是为了解决网络延迟和安全性,根据Google的官方数据,使用SPDY协议的服务器和客户端可以将网络加载的时间减少64%. (4)避免错误的链接请求

资源的数量

(1) 当资源比较小的时候,开发者可以将它们直接放在网页中. 比如对于图片而言,当图片比较小的时候,开发者可以通过base64编码技术将它变成字符串,直接放入网页中。 (2)合并一些资源。比如雪碧图。

资源的数据量

(1) 强缓存和协商缓存
(2) 启用资源的压缩技术。可以使用zip压缩技术,然后在HTTP消息头中说明该资源经过压缩,这样可以有效减少网络传输的数据量