4.1 Loader概述

我們使用瀏覽器上網(wǎng)時岛宦，首先會在地址欄輸入一個網(wǎng)址丽焊，瀏覽器會依據(jù)網(wǎng)址向服務(wù)器發(fā)送資源請求，服務(wù)器解析請求纬朝，并將相關(guān)數(shù)據(jù)資源傳回給瀏覽器，這些數(shù)據(jù)資源包括Page的描述文檔骄呼、圖片共苛、Javascript腳本、CSS等蜓萄。此后隅茎，瀏覽器引擎會對數(shù)據(jù)進(jìn)行解碼、解析嫉沽、排版辟犀、繪制等操作，最終呈現(xiàn)出完整的頁面绸硕。

WebKit 執(zhí)行流程示意圖

在過去堂竟，Webkit資源分成兩類魂毁，一類是主資源，比如HTML頁面出嘹，或者下載項席楚，一類是派生資源，比如HTML頁面中內(nèi)嵌的圖片或者腳本税稼、樣式表鏈接烦秩，分別對應(yīng)代碼中兩個類：MainResourceLoader和SubresourceLoader。這兩類資源的加載過程頗有不同娶聘，比如對資源加載失敗的處理闻镶，主資源下載失敗會有報錯提示，而派生資源如圖片下載失敗丸升，往往只顯示一個占位符铆农。所以網(wǎng)絡(luò)加載模塊分別設(shè)計了MainResourceLoader和SubresourceLoader來處理它們。它們的公共基類ResourceLoader主要完成兩種資源加載都需要進(jìn)行的操作狡耻，如在資源加載過程中墩剖，反饋加載狀態(tài)的回調(diào)等。

注：自從WebKit有了PageCache（主資源也可以緩存）的功能以后夷狰。WebKit資源加載已經(jīng)不區(qū)分MainResourceLoader和SubresourceLoader岭皂，統(tǒng)一由CachedResourceLoader加載資源，而區(qū)分主資源和派生資源則是通過CachedResource類里面Type類型：

enum Type {

MainResource,

ImageResource,

CSSStyleSheet,

Script,

FontResource,

RawResource

};

可以看到加載主資源的時候沼头，Type類型就為MainResource爷绘。由于目前我們使用的WebKit代碼已經(jīng)使用了比較新的代碼，所以本章后面介紹的流程都與過去的流程不一樣了进倍。

4.2 Loader中的類結(jié)構(gòu)以及作用

為了梳理出Loader模塊中相關(guān)類之間的關(guān)系土至！在閱讀源碼時，可參考這張圖猾昆，有助于加深對Loader整體的理解陶因。

Loader類圖設(shè)計

FrameLoader類提供了資源加載的一系列接口，因此與FrameLoader交互的類比較多垂蜗，以下是FrameLoader類與其他比較重要類的內(nèi)在關(guān)系圖：

FrameLoader的交互

首先簡要說明圖中幾個類的作用楷扬。

FrameLoaderClient：是FrameLoader的客戶接口類，在不同的平臺實現(xiàn)也不相同贴见，比如在Qt平臺烘苹、Android平臺、Gtk平臺等片部。FrameLoader將加載過程中的狀態(tài)螟加、結(jié)果等信息傳遞給FrameLoaderClient，F(xiàn)rameLoaderClient可以管控FrameLoader的動作。

HistoryController：處理歷史記錄相關(guān)的接口捆探，保存或者恢復(fù)Page和Document的狀態(tài)到HistoryItem然爆，維護(hù)瀏覽器頁面的前進(jìn)后退隊列，以實現(xiàn)前進(jìn)后退功能黍图。

PolicyChecker：對FrameLoader進(jìn)行一些校驗曾雕。包括三種校驗：NewWindowPolicy、NavigationPolicy助被、ContentPolicy剖张。NewWindowPolicy對應(yīng)于瀏覽器需要新開一個tab頁或者窗口時。NavigationPolicy對應(yīng)于一個頁面請求發(fā)起時揩环。ContentPolicy校驗對應(yīng)于收到數(shù)據(jù)以后（如判斷MimeType等）搔弄。PolicyChecker提供對應(yīng)的接口，由FrameLoaderClient來對這些請求進(jìn)行校驗丰滑，以確定是否允許繼續(xù)加載或者需要執(zhí)行其他的動作顾犹。

ResourceLoadNotifier：用于與ResourceLoader和FrameLoaderClient通信。在資源加載過程中褒墨，將ResourceLoader的狀態(tài)通過ResourceLoadNotifier通知給FrameLoaderClient炫刷。

SubFrameLoader：用于控制MainFrame的子Frame（如iframe）的加載。

DocumentLoader：FrameLoader包含了三個DocumentLoader對象郁妈，在資源加載的不同階段被使用浑玛，其中m_policyDocumentLoader應(yīng)用在Load請求產(chǎn)生時的Policy Check階段。m_provisionalDocumentLoader應(yīng)用在Policy Check通過后噩咪，發(fā)起網(wǎng)絡(luò)請求的階段顾彰。m_documentLoader則是收到Server發(fā)回的資源數(shù)據(jù)包后使用的DocumentLoader。不過在實際的資源加載過程中胃碾，三個DocumentLoader對應(yīng)于同一個對象拘央。

FrameLoaderStateMachine：通過FrameLoaderStateMachine來反映FrameLoader的狀態(tài)，描述DocumentLoader的狀態(tài)书在。

4.3 資源加載流程

正如概述所說，比較新的WebKit代碼主資源已經(jīng)加入了緩存機制拆又，所以統(tǒng)一由CachedResourceLoader加載資源儒旬，以下加載主資源的時序圖：

主資源加載流程

WebKit派生資源包含的類型主要如下：

Javascript腳本（CachedScript）；

CSS樣式文本（CachedCSSStyleSheet）帖族；

圖片（CachedImage）栈源；

字體（CachedFont）；

XSL樣式表（CachedXSLStyleSheet）竖般；

可以說除了主資源剩下的網(wǎng)絡(luò)資源都是派生資源甚垦。派生資源的WebKit中都有對應(yīng)的類實現(xiàn)，它們有著共同的基類（CachedResource），下面是類圖：

派生資源繼承關(guān)系圖

WebKit在加載主資源后艰亮，主資源會被解碼闭翩，然后進(jìn)行解析，生成DOM樹迄埃。在解析的過程中疗韵，如果遇到派生資源的標(biāo)簽，會創(chuàng)建相應(yīng)的HTMLElement類侄非。我們以image（會創(chuàng)建HTMLImageElement類）為例蕉汪，時序圖如下：

Image資源加載流程

4.4 本章小結(jié)

本章主要介紹了Loader模塊的設(shè)計與實現(xiàn)，包括Loader的相關(guān)類介紹逞怨。對比主資源和派生資源加載流程者疤，大家會發(fā)現(xiàn)很多相似之處。Loader模塊較為復(fù)雜但非常重要叠赦，希望本章能給大家一些幫助驹马。