WebKit/Blink 如何加载网页资源?

[本文属原创,如有转载,请注明出处http://blog.csdn.net/yl02520/article/]

在浏览器渲染网页并呈现给用户之前,首先需要通过网络加载网页资源,这里把资源分成两种,一种是类似Frame的主资源文件,另外一种为类似图片,JavaScript,音频或视频的子资源文件。

从WebKit的官方博客上https://www.webkit.org/blog/1188/how-webkit-loads-a-web-page/可以得知,WebKit加载这两种资源的方式不同,在代码中采用两种不同的路径来获取资源文件。对于Frame类型的文件,WebKit通过一个DocumentLoader的类来加载。而对于图片,脚本类似的资源文件,WebKit通过一个DocLoader的类来加载,与Frame加载不同的是,DocLoader首先会从缓存中询问是否有资源的备份,如果存在,直接返回备份的资源,这大大减少了文件的下载时间,如果是图片或音视频文件,还可以减少解压时间。如果缓存中不存在文件备份,就新创建一个该文件的备份,为下次加载时使用,这将减少网页重新加载(Reload/Refresh)的时间。

后来Google的工程师对WebKit的这种加载机制做了改进,尽管Frame主资源和图片类的子资源文件有所不同,但是加载的过程实质上类似,所以WebKit/Blink就把两者合并,都采用ResourceFetcher来加载。在网页的加载过程中一般只存在一个ResourceFetcher的实例,当一个网页比较复杂时,需要的加载的资源文件可能会很多,例如网页可能是多个Frame组成的,网页中可能包含图片、JS脚本、CSS脚本、音视频文件和Worker脚本文件等,另外由于网络带宽的影响,资源加载的时间可能会很长,那么如何能快速的让主界面显示给用户来提高用户体验呢(尤其在资源受限的移动设备上)?这里WebKit/Blink对资源文件设定了优先级,把优先级分为五类,即最高优先级,高优先级,中等优先级,低优先级和最低优先级。很明显Frame作为主资源文件享有最高优先级,其他子资源中CSS资源享有高优先级,JS脚本、字体文件被设为中等优先级。

郑重声明:本站内容如果来自互联网及其他传播媒体,其版权均属原媒体及文章作者所有。转载目的在于传递更多信息及用于网络分享,并不代表本站赞同其观点和对其真实性负责,也不构成任何其他建议。