ref:https://www.webkit.org/blog/1188/how-webkit-loads-a-web-page/

Before WebKit can render a web page, it needs to load the page and all of its subresources from the network. There are many layers involved in loading resources from the web. In this post, I’ll focus on explaining how WebCore, the main rendering component of WebKit, is involved in the loading process.

WebKit contains two loading pipelines, one for loading documents into frames and another for loading the subresources (such as images and scripts). The diagram below summarizes the major objects involved in the two pipelines:

Loading Frames

The FrameLoader is in charge of loading documents into Frames. Whenever you click a link, the FrameLoader begins by creating a new DocumentLoader object in the “policy” state, where it awaits a decision by the WebKit client about how it should handle this load. Typically, the client will instruct the FrameLoader to treat the load as a navigation (instead of blocking the load, for example).

Once the client instructs the FrameLoader to treat the load as a navigation, the FrameLoader advances the DocumentLoader to the “provisional” state, which kicks off a network request and waits to determine whether the network request will result in a download or a new document.

The DocumentLoader, in turn, creates a MainResourceLoader, whose job is to interact with the platform’s network library via the ResourceHandle interface. Separating the MainResourceLoader from DocumentLoader serves two purposes: (1) the MainResourceLoader insulates the DocumentLoader from details of handling the callbacks from the ResourceHandle and (2) the lifetime of the MainResourceLoader is decoupled from the lifetime of the DocumentLoader (which is tied to the Document).

Once the loading system has received sufficient information from the network to determine that the resource actually represents a document, the FrameLoader advances the DocumentLoader to the “committed” state, which transitions the Frame to displaying the new document.

Loading Subresources

Of course, displaying a web page requires more than just the HTML that comprises the document. We also need to load the images, scripts, and other subresources referenced by the document. The DocLoader is in charge of loading these subresources. (Note that although DocumentLoader and DocLoader have similar names, their roles are quite different.)

Let’s take loading an image as a typical example. To load an image, the DocLoader first asks the Cache whether it already has a copy of the image in memory (as a CachedImage object). If the image is already in the Cache, the DocLoader can respond immediately with the image. For even greater efficiency, the Cache often keeps the decoded image in video memory so that WebKit does not have to uncompress the same image twice.

If the image is not in the Cache, the Cache creates a new CachedImage object to represent the image. The CachedImage object asks the “Loader” object to kick off a network request, which the Loader does by creating a SubresourceLoader. The SubresourceLoader plays a similar role in the subresource loading pipeline as the MainResourceLoader does in the main resource loading pipeline in that it interacts most directly with the ResourceHandle interface to the platform.

Areas for Improvement

There are many areas in which we can improve WebKit’s loading pipelines. The FrameLoader is significantly more complex than necessary and encompasses more tasks than simply loading a frame. For example, FrameLoader has a several subtly different methods named “load,” which can be confusing, and is responsible for creating new windows, which seems only tangentially related to loading a frame. Also, the various stages of the loading pipeline are more tightly coupled than necessary and there are a number of “layering” violations in which a lower-level object interacts directly with a higher-level object. For example, the MainResourceLoader delivers bytes received from the network directly to FrameLoader instead of delivering them to DocumentLoader.

If you study the diagram above, you will notice that the Cache is used only for subresources. In particular, main resource loads do not get the benefits of WebKit’s memory cache. If we can unify these two loading pipelines, we might be able to improve the performance of main resource loads. Over time, we hope to improve the performance of the loader to make loading web pages as fast as possible.

[转]How WebKit Loads a Web Page的更多相关文章

  1. How a web page loads

    The major web browsers load web pages in basically the same way. This process is known as parsing an ...

  2. 解读Web Page Diagnostics网页细分图

    解读Web Page Diagnostics网页细分图 http://blog.sina.com.cn/s/blog_62b8fc330100red5.html Web Page Diagnostic ...

  3. how to export svg form web page in js

    how to export svg form web page in js https://stackoverflow.com/questions/2483919/how-to-save-svg-ca ...

  4. 网页细分图结果分析(Web Page Diagnostics)

    Discuz开源论坛网页细分图结果分析(Web Page Diagnostics) 续LR实战之Discuz开源论坛项目,之前一直是创建虚拟用户脚本(Virtual User Generator)和场 ...

  5. Atitit.web三大编程模型 Web Page Web Forms 和 MVC

    Atitit.web三大编程模型 Web Page    Web Forms 和 MVC 1. 编程模型是 Web Forms 和 MVC (Model, View, Controller). 2.  ...

  6. [转]Calling Web Service Functions Asynchronously from a Web Page 异步调用WebServices

    本文转自:http://www.codeproject.com/Articles/70441/Calling-Web-Service-Functions-Asynchronously-from Ove ...

  7. Tutorial: Importing and analyzing data from a Web Page using Power BI Desktop

    In this tutorial, you will learn how to import a table of data from a Web page and create a report t ...

  8. Android WebView常见问题的解决方案总结----例如Web page not available

    之前android虚拟机一直都可以直接联网,今天写了一个WebView之后,突然报出了Web page not available的错误,但是查看虚拟机自带的浏览器,是可以上网的,所以检查还是代码的问 ...

  9. LR实战之Discuz开源论坛——网页细分图结果分析(Web Page Diagnostics)

    续LR实战之Discuz开源论坛项目,之前一直是创建虚拟用户脚本(Virtual User Generator)和场景(Controller),现在,终于到了LoadRunner性能测试结果分析(An ...

随机推荐

  1. JavaScript中的try...catch和异常处理

    在JavaScript可以使用try...catch来进行异常处理.例如: try { foo.bar();} catch (e) { alert(e.name + ": " + ...

  2. javascript 实现一个网页,然后计算出有多少剩余时间的倒计时程序

    function counter() { var date = new Date(); var year = date.getFullYear(); var date2 = new Date(year ...

  3. View Component

    View Component 在之前的MVC中,我们经常需要类似一种小部件的功能,通常我们都是使用Partial View来实现,因为MVC中没有类似Web Forms中的WebControl的功能. ...

  4. 【分享】小工具大智慧之Sql执行工具

    原文:[分享]小工具大智慧之Sql执行工具 工具概况 情况是这样的,以前我们公司有很多Sql用于完成一些很不起眼但又不得不完成的业务,出于方便就直接在Sql查询分析器里执行,按理说应该写一些专门的工具 ...

  5. css3简单几步画一个乾坤图

    原文:[原创]css3简单几步画一个乾坤图 效果如上,鼠标移上去会有动画. 代码如下非常简单: <html> <head> <style> .outer{heigh ...

  6. hdu(2062)-Subset sequence 组合数学

    意甲冠军:查找集合{1,2,3...n}第一m一个排列子. 收集的线索所行的大小. 例两个元素的排列子集合按字典树排列是:{1},{1,2},{2},{2,1}: 解法:一个一个元素来确定,每次把剩余 ...

  7. windows+php5.5+apache2.4+tomcat+mod_jk配置

    原因: 通常情况下apache执行的是80port,比方apache启动后执行localhost:80就能够出现It works页面,这里的80也能够不写,会默认的.而tomcat启动时默认的port ...

  8. Lua的多任务机制——协程(coroutine)

    并发是现实世界的本质特征,而聪明的计算机科学家用来模拟并发的技术手段便是多任务机制.大致上有这么两种多任务技术,一种是抢占式多任务(preemptive multitasking),它让操作系统来决定 ...

  9. POJ 2255 Tree Recovery 二叉树恢复

    一道和Leetcode的一道题目基本上一样的题目. 给出前序遍历和中序遍历序列,要求依据这些信息恢复一颗二叉树的原貌,然后按后序遍历序列输出. Leetcode上有给出后序和中序,恢复二叉树的. 只是 ...

  10. windows socket 网络编程

    样例代码就在我的博客中,包含六个UDP和TCP发送接受的cpp文件,一个基于MFC的局域网聊天小工具project,和此小工具的全部执行时库.资源和执行程序.代码的压缩包位置是http://www.b ...