Chrome是程序員的標(biāo)配了,而從全球的市場份額來看,它在全球市場的份額已經(jīng)超過 60%。
在 Chrome 10周年之際,官方發(fā)布了一個(gè)系列文章,用圖解的方式,很清晰的講解了現(xiàn)代瀏覽器的運(yùn)行原理,Chrome之所以這么好用,這么快,是有原因的。本文是系列文章的第一篇,主要講解的是 Chrome 的多進(jìn)程架構(gòu),配圖很有意思,也很好理解。
CPU、GPU、內(nèi)存和多進(jìn)程架構(gòu)
我們將通過4篇博客,來介紹 Chrome 瀏覽器從高級架構(gòu)到渲染管道的具體細(xì)節(jié)。如果你想知道,瀏覽器是如何將你的代碼轉(zhuǎn)換為功能性網(wǎng)站;或者你想確定,為什么可以使用特定技術(shù)能提高性能,那么本系列適合你。
作為本系列的第1部分,我們將介紹關(guān)鍵技術(shù)名詞和 Chrome 的多進(jìn)程架構(gòu)。
1.CPU(中央處理器)
CPU(Central Procession Unit) 可以被認(rèn)為是你計(jì)算機(jī)的大腦。CPU 核心,就像辦公室工作人員,可以逐個(gè)處理交代給他們的許多不同的任務(wù)。它可以處理從數(shù)學(xué)到藝術(shù)的所有事情,并把處理結(jié)果返回出去。曾經(jīng)大多數(shù) CPU 都是單核,但在現(xiàn)代硬件中,你通常會操作的是多核 CPU,多核 CPU 為你的手機(jī)和計(jì)算機(jī)提供更強(qiáng)的計(jì)算能力。
2.GPU
GPU(Graphics Processing Unit)是計(jì)算機(jī)的另一部分。與 CPU 不同,GPU 更擅長處理簡單任務(wù),同時(shí)可以跨多個(gè)核心。
顧名思義,它最初是為處理圖形而誕生的。這就是為什么在圖形處理中,當(dāng)我們說到 “使用 GPU” 或者 “GPU 支持” 的時(shí)候,通常就在說快速渲染和平滑交互。近年來,隨著 GPU 加速發(fā)展,僅在 GPU 上就可以實(shí)現(xiàn)越來越多的計(jì)算任務(wù)。
如上圖所示,三層計(jì)算機(jī)體系結(jié)構(gòu)中,硬件位于底部,操作系統(tǒng)位于中間,應(yīng)用程序則在最上層。
當(dāng)你在計(jì)算機(jī)或手機(jī)上啟動應(yīng)用程序時(shí),CPU 和 GPU 就是為應(yīng)用程序提供有力的支持。通常,應(yīng)用程序使用操作系統(tǒng)提供的機(jī)制在 CPU 和 GPU 上運(yùn)行。
Process 和 Thread 上執(zhí)行的程序
在深入瀏覽器架構(gòu)之前,要掌握的另一個(gè)概念是 Process(進(jìn)程) 和 Thread(線程)。
進(jìn)程可以理解是應(yīng)用程序的執(zhí)行程序,線程則是存在于進(jìn)程內(nèi)部,并執(zhí)行其進(jìn)程程序的部分功能。
進(jìn)程作為線程的邊界,而線程就像游動在進(jìn)程中的魚。
進(jìn)程可以通過操作系統(tǒng),啟動另一個(gè)進(jìn)程來執(zhí)行不同的任務(wù)。此時(shí),系統(tǒng)將為新進(jìn)程分配不同的內(nèi)存。如果兩個(gè)進(jìn)程間需要通信,他們可以利用 IPC(Inter Process Communication)的方式進(jìn)行通信。
許多應(yīng)用程序都是以這種方式執(zhí)行的,因此如果某個(gè)工作進(jìn)程(例如一個(gè)選項(xiàng)卡)無響應(yīng),重啟它,并不會影響相同應(yīng)用程序的其他進(jìn)程。
瀏覽器架構(gòu)
那么如何使用進(jìn)程和線程構(gòu)建 Web 瀏覽器?
它可能是一個(gè)具有許多不同線程或許多不同進(jìn)程的進(jìn)程,只有少數(shù)線程能夠通過 IPC 進(jìn)行通信。
這里有個(gè)非常重要的點(diǎn)需要注意,這些不同的架構(gòu)是實(shí)現(xiàn)細(xì)節(jié)。關(guān)于如何構(gòu)建 Web 瀏覽器沒有標(biāo)準(zhǔn)規(guī)范,不同瀏覽器的架構(gòu)可能完全不同。
最重要的是瀏覽器進(jìn)程,如何與負(fù)責(zé)應(yīng)用程序不同部分的其他進(jìn)程協(xié)調(diào)。對于渲染器進(jìn)程,將創(chuàng)建多個(gè)進(jìn)程,并將其分配給每個(gè)選項(xiàng)卡。直到最近,Chrome 才為每個(gè)標(biāo)簽提供了一個(gè)執(zhí)行進(jìn)程,現(xiàn)在它嘗試為每個(gè)站點(diǎn)提供自己的進(jìn)程,包括 iframe。
如圖所示,Chrome 的多進(jìn)程架構(gòu),渲染進(jìn)程會顯示多個(gè)圖層,表示 Chrome 為每個(gè)選項(xiàng)卡運(yùn)行多個(gè)渲染器進(jìn)程。
這些進(jìn)程控制什么?
下面介紹了每個(gè) Chrome 進(jìn)程以及其控制的范圍:
瀏覽器(Browser):控制 “Chrome” 應(yīng)用程序,包括地址欄、書簽、后退和前進(jìn)按鈕等。還需要處理 Web 瀏覽器的權(quán)限管理,例如網(wǎng)絡(luò)請求和文件訪問。
渲染器(Renderer):控制選項(xiàng)卡內(nèi),網(wǎng)站里顯示的所有內(nèi)容。
插件(Plugin):控制網(wǎng)站使用的插件,例如:Flash。
GPU:獨(dú)立于其他進(jìn)程,專用于處理 GPU 任務(wù),它被分成不同的進(jìn)程,因?yàn)?GPU 會處理來自多個(gè)進(jìn)程的請求,并將它們繪制在相同的 Surface 中。
不同的進(jìn)程,用于處理 Chrome 的不同部分。
還有更多的流程,如:擴(kuò)展進(jìn)程(Extension Process)和實(shí)用進(jìn)程(Utility Process)。如果你想查看 Chrome 中正在運(yùn)行的進(jìn)程數(shù),請點(diǎn)擊右上角的選項(xiàng),菜單圖標(biāo)→選擇更多工具→任務(wù)管理器。
這將打開一個(gè)窗口,其中包含當(dāng)前正在運(yùn)行的進(jìn)程列表以及它們使用的 CPU/Memory 信息。
Chrome 采用多進(jìn)程架構(gòu)的好處
之前,我曾提到 Chrome 使用多個(gè)渲染器進(jìn)程。在最簡單的情況下,你可以想象每個(gè)選項(xiàng)卡都有自己的渲染器進(jìn)程。
假設(shè)你打開了 3 個(gè)選項(xiàng)卡,每個(gè)選項(xiàng)卡都擁有獨(dú)立的渲染器進(jìn)程。如果一個(gè)選項(xiàng)卡沒有響應(yīng),則可以關(guān)閉無響應(yīng)的選項(xiàng)卡,并繼續(xù)使用,同時(shí)保持其他選項(xiàng)卡處于活動狀態(tài)。如果所有選項(xiàng)卡,都在一個(gè)進(jìn)程上運(yùn)行,則當(dāng)一個(gè)選項(xiàng)卡無響應(yīng)時(shí),所有選項(xiàng)卡都不會響應(yīng)。這就很尷尬了。
將瀏覽器的工作,分成多個(gè)進(jìn)程的另一個(gè)好處是安全性和沙盒。由于操作系統(tǒng)提供了限制進(jìn)程權(quán)限的方法,因此瀏覽器可以從某些功能中,對某些進(jìn)程進(jìn)行沙箱處理。例如,Chrome 瀏覽器可以對處理用戶輸入(如渲染器)的進(jìn)程,限制其文件訪問的權(quán)限。
每個(gè)進(jìn)程都有自己的私有內(nèi)存空間,因此它們通常包含公有基礎(chǔ)功能(例如 V8 是 Chrome 的 JavaScript 引擎)。這意味著更多的內(nèi)存使用,因?yàn)槿绻鼈兪峭贿M(jìn)程內(nèi)的線程,則無法以它們的方式共享。
為了節(jié)省內(nèi)存,Chrome 限制了它可以啟動的進(jìn)程數(shù)量。限制會根據(jù)設(shè)備的內(nèi)存和 CPU 功率動態(tài)調(diào)整,但當(dāng) Chrome 達(dá)到限制時(shí),它會在一個(gè)新的進(jìn)程中打開這個(gè)站點(diǎn)。
Chrome 服務(wù)化 — 更省內(nèi)存
同樣的方法也適用于瀏覽器進(jìn)程。Chrome 正在進(jìn)行體系結(jié)構(gòu)更改,以便將瀏覽器程序的每個(gè)部分,作為一項(xiàng)服務(wù)運(yùn)行,從而可以輕松拆分為不同的流程或匯總為同一個(gè)流程。
一般的想法是,當(dāng) Chrome 在強(qiáng)大的硬件上運(yùn)行時(shí),它可能會將每個(gè)服務(wù)拆分為不同的進(jìn)程,從而提供更高的穩(wěn)定性,但如果它位于資源約束的設(shè)備上,Chrome 會將服務(wù)整合到一個(gè)進(jìn)程中,從而節(jié)省內(nèi)存占用。在此更改之前,在類似 Android 的平臺上,已經(jīng)使用類似的方法,來整合流程以減少內(nèi)存使用。
站點(diǎn)隔離 — 獨(dú)立渲染進(jìn)程
站點(diǎn)隔離是 Chrome 中最近推出的一項(xiàng)功能,可以為每個(gè)跨網(wǎng)站 iframe 運(yùn)行單獨(dú)的渲染器進(jìn)程。
我們一直在討論,每個(gè)選項(xiàng)卡有一個(gè)獨(dú)立的渲染器進(jìn)程,它允許跨站點(diǎn) iframe 在單個(gè)渲染器進(jìn)程中運(yùn)行,并在不同站點(diǎn)之間共享內(nèi)存空間。在同一個(gè)渲染器進(jìn)程中運(yùn)行a.com和b.com似乎沒問題。
該同源策略是網(wǎng)絡(luò)的核心安全模型,它確保一個(gè)站點(diǎn)在未經(jīng)同意的情況下無法訪問其他站點(diǎn)的數(shù)據(jù),繞過此策略是安全攻擊的主要目標(biāo)。
進(jìn)程隔離是分離站點(diǎn)的最有效方法。因?yàn)?Meltdonw 和 Spectre 這兩個(gè)經(jīng)典漏洞,我們需要使用進(jìn)程分離網(wǎng)站,這是非常重要的。默認(rèn)情況下,自 Chrome 67 啟用桌面隔離功能后,選項(xiàng)卡中的每個(gè)跨站點(diǎn) iframe 都會獲得單獨(dú)的渲染器進(jìn)程。
啟用站點(diǎn)隔離是一項(xiàng)多年的工程積累。站點(diǎn)隔離并不像分配不同的渲染器過程那么簡單,它從根本上改變了 iframe 彼此通信的方式。當(dāng)我們在運(yùn)行在不同進(jìn)程上的 iframe 頁面上,打開 devtools,就意味著 devtools 必須實(shí)現(xiàn)這些后臺通信的功能,并且看起來是無縫的。即使使用簡單的文字查找(Ctrl+F),來查找頁面中的單詞,這個(gè)操作也是在搜索不同渲染器進(jìn)程。正因?yàn)槿绱?,瀏覽器工程師將站點(diǎn)隔離這個(gè)功能的發(fā)布,當(dāng)做一個(gè)重要里程碑的原因。
小結(jié)
在這篇文章中,我們介紹了瀏覽器體系結(jié)構(gòu)的高級視圖,并介紹了多進(jìn)程體系結(jié)構(gòu)的優(yōu)點(diǎn)。我們還介紹了 Chrome 中,與多進(jìn)程架構(gòu)密切相關(guān)的服務(wù)化和站點(diǎn)隔離。在下一篇文章中,我們將開始深入研究這些進(jìn)程和線程之間發(fā)生的事情,以便顯示一個(gè)網(wǎng)站。
-
Google
+關(guān)注
關(guān)注
5文章
1752瀏覽量
57333 -
瀏覽器
+關(guān)注
關(guān)注
1文章
1007瀏覽量
35193
原文標(biāo)題:Google官網(wǎng)萌圖揭秘Chrome快是有原因的!瀏覽器架構(gòu)一覽~
文章出處:【微信號:thejiangmen,微信公眾號:將門創(chuàng)投】歡迎添加關(guān)注!文章轉(zhuǎn)載請注明出處。
發(fā)布評論請先 登錄
相關(guān)推薦
評論