深入瀏覽器原理系列（5）：多進(jìn)程資源加載
背景知識(shí)
Chromium采用多進(jìn)程架構(gòu)，本文主要介紹瀏覽器進(jìn)程和渲染進(jìn)程，由于渲染進(jìn)程是運(yùn)行在沙盒中，沒有直接訪問系統(tǒng)資源的能力（如網(wǎng)絡(luò)資源）。渲染進(jìn)程中的WebKit/Blink在渲染網(wǎng)頁時(shí)，首先需要從網(wǎng)絡(luò)上加載相應(yīng)的資源文件，比如HTML文檔以及文檔中的圖片、JS腳本、CSS腳本等子資源文件，那么渲染進(jìn)程就需要先把這些請(qǐng)求通過IPC（進(jìn)程間通信）的方式發(fā)送給瀏覽器進(jìn)程，由瀏覽器進(jìn)程統(tǒng)一管理和網(wǎng)絡(luò)數(shù)據(jù)傳輸。
這樣做有一下幾個(gè)好處：
瀏覽器可以統(tǒng)一管理所有的資源請(qǐng)求； 瀏覽器進(jìn)程可以緩存已經(jīng)下載完畢的資源文件和Cookie，當(dāng)有新的請(qǐng)求到達(dá)時(shí)，如果請(qǐng)求的資源以及存在于緩存中，就直接從緩存中提取，沒必須要重新從網(wǎng)絡(luò)上下載，這樣可以節(jié)省網(wǎng)絡(luò)帶寬和資源下載的時(shí)間。 自從HTTP/1.1之后，瀏覽器要求不能為同一域名的主機(jī)打開太多的連接，因?yàn)槿绻粋€(gè)標(biāo)簽頁打開太多的Socket鏈接，可能會(huì)導(dǎo)致系統(tǒng)資源消耗過多，這可能會(huì)影響到其他標(biāo)簽頁或者其他應(yīng)用程序的運(yùn)行，這在資源受限的移動(dòng)平臺(tái)上顯得尤為重要。Chromium目前允許同一主機(jī)最多打開6個(gè)Socket鏈接。
總體架構(gòu)
從上圖可知，我們把Chromium資源文件加載的流程大致分為三層，最下面一層是WebKit/Blink層，它運(yùn)行在渲染進(jìn)程中的渲染線程中，負(fù)責(zé)HTML文檔的解析、JavaScript/CSS腳本的解析執(zhí)行和頁面的布局等功能；中間一層是渲染進(jìn)程中與瀏覽器進(jìn)程通信的模塊，它在渲染進(jìn)程中的主線程中，負(fù)責(zé)把WebKit發(fā)出的資源請(qǐng)求，轉(zhuǎn)發(fā)給瀏覽器進(jìn)程；最上面一層就是瀏覽器進(jìn)程，它負(fù)責(zé)控制所有的網(wǎng)絡(luò)連接和通信，該模塊運(yùn)行在瀏覽器進(jìn)程中的IO線程里。
WebKit/Blink
在WebKit/Blink中包括HTML文檔在內(nèi)的所有資源文件都是通過ResourceFetcher類來獲取的，現(xiàn)在最新的實(shí)現(xiàn)對(duì)以前的WebKit資源加載流程做了改進(jìn)，更多內(nèi)容請(qǐng)看最后一節(jié)“WebKit/Blink如何加載網(wǎng)頁資源”。ResourceFethcer類中提供了獲取不同資源文件的方法，例如：fetchMainResource方法獲取Frame資源，由該方法發(fā)送的請(qǐng)求具備最高優(yōu)先級(jí)；fetchImage方法獲取圖片文件；fetchScript方法獲取JavaScript腳本文件資源等等。這些獲取資源的方法通過創(chuàng)建和調(diào)用ResourceLoader來發(fā)送請(qǐng)求。
渲染進(jìn)程
渲染進(jìn)程對(duì)類ResourceLoaderBridge進(jìn)行了實(shí)現(xiàn)，我們稱為IPCResourceLoaderBridge，該類是在content/child/resource_dispatcher.cc中實(shí)現(xiàn)的（Chromium后來移動(dòng)了該文件的位置），該類通過ResourceDispatcher類發(fā)送網(wǎng)絡(luò)資源請(qǐng)求，每個(gè)渲染進(jìn)程中有且之存在一個(gè)ResourceDispatcher對(duì)象，所有從WebKit發(fā)出的網(wǎng)絡(luò)請(qǐng)求，最后都交給ResourceDispatcher處理，ResourceDispatcher先給每個(gè)請(qǐng)求分配一個(gè)唯一的ID號(hào)，用來區(qū)別其他請(qǐng)求，并且組裝成一個(gè)IPC的信息包ResourceHostMsg_RequestResource，然后把該請(qǐng)求消息交給主線程，由主線程統(tǒng)一與瀏覽器進(jìn)程進(jìn)行IPC。
瀏覽器進(jìn)程
瀏覽器進(jìn)程中的IO線程的ResourceDispatcherHost會(huì)對(duì)渲染進(jìn)程發(fā)過來的資源請(qǐng)求消息進(jìn)行處理，ResourceDispatcherHostImpl::OnRequestResource方法來處理ResourceHostMsg_RequestResource消息，然后把每個(gè)消息請(qǐng)求的數(shù)據(jù)結(jié)構(gòu)變換成chromium中net模塊的URLRequest對(duì)象，并轉(zhuǎn)發(fā)給net模塊內(nèi)部的URLRequestJob類，該對(duì)象負(fù)責(zé)具體網(wǎng)絡(luò)協(xié)議的實(shí)現(xiàn)。當(dāng)URLRequest得到數(shù)據(jù)或通知時(shí)，ResourceDispatcherHost就會(huì)收到相應(yīng)消息，并根據(jù)渲染進(jìn)程中創(chuàng)建的資源請(qǐng)求ID號(hào)找到相應(yīng)的RenderProcessHost，最后把消息發(fā)送給渲染進(jìn)程。
Cookies
在Chromium中Cookies存放在瀏覽器進(jìn)程中，為所有的渲染進(jìn)程共享，（手動(dòng)打開一個(gè)新的標(biāo)簽頁時(shí)使用一個(gè)新的渲染進(jìn)程）。在網(wǎng)頁中我們可以通過JavaScritpt腳本document.cookie來訪問該網(wǎng)站的cookie值，此時(shí)渲染進(jìn)程需要發(fā)送一個(gè)同步的IPC給瀏覽器進(jìn)程，由于是同步的IPC，所以渲染進(jìn)程中的渲染線程（WebKit的主循環(huán)）就會(huì)被阻塞，直到收到瀏覽器進(jìn)程的數(shù)據(jù)返回為止，然后把獲取的結(jié)果返回給JavaScript引擎，讓JavaScript繼續(xù)執(zhí)行。
WebKit/Blink 如何加載網(wǎng)頁資源？
在瀏覽器渲染網(wǎng)頁并呈現(xiàn)給用戶之前，首先需要通過網(wǎng)絡(luò)加載網(wǎng)頁資源，這里把資源分成兩種，一種是類似Frame的主資源文件，另外一種為類似圖片，JavaScript，音頻或視頻的子資源文件。
從WebKit的官方博客上可以得知，WebKit加載這兩種資源的方式不同，在代碼中采用兩種不同的路徑來獲取資源文件。對(duì)于Frame類型的文件，WebKit通過一個(gè)DocumentLoader的類來加載。而對(duì)于圖片，腳本類似的資源文件，WebKit通過一個(gè)DocLoader的類來加載，與Frame加載不同的是，DocLoader首先會(huì)從緩存中詢問是否有資源的備份，如果存在，直接返回備份的資源，這大大減少了文件的下載時(shí)間，如果是圖片或音視頻文件，還可以減少解壓時(shí)間。如果緩存中不存在文件備份，就新創(chuàng)建一個(gè)該文件的備份，為下次加載時(shí)使用，這將減少網(wǎng)頁重新加載（Reload/Refresh）的時(shí)間。
后來Google的工程師對(duì)WebKit的這種加載機(jī)制做了改進(jìn)，盡管Frame主資源和圖片類的子資源文件有所不同，但是加載的過程實(shí)質(zhì)上類似，所以WebKit/Blink就把兩者合并，都采用ResourceFetcher來加載。在網(wǎng)頁的加載過程中一般只存在一個(gè)ResourceFetcher的實(shí)例，當(dāng)一個(gè)網(wǎng)頁比較復(fù)雜時(shí)，需要的加載的資源文件可能會(huì)很多，例如網(wǎng)頁可能是多個(gè)Frame組成的，網(wǎng)頁中可能包含圖片、JS腳本、CSS腳本、音視頻文件和Worker腳本文件等，另外由于網(wǎng)絡(luò)帶寬的影響，資源加載的時(shí)間可能會(huì)很長，那么如何能快速的讓主界面顯示給用戶來提高用戶體驗(yàn)?zāi)兀ㄓ绕湓谫Y源受限的移動(dòng)設(shè)備上）？這里WebKit/Blink對(duì)資源文件設(shè)定了優(yōu)先級(jí)，把優(yōu)先級(jí)分為五類，即最高優(yōu)先級(jí)，高優(yōu)先級(jí)，中等優(yōu)先級(jí)，低優(yōu)先級(jí)和最低優(yōu)先級(jí)。很明顯Frame作為主資源文件享有最高優(yōu)先級(jí)，其他子資源中CSS資源享有高優(yōu)先級(jí)，JS腳本、字體文件被設(shè)為中等優(yōu)先級(jí)。