web瀏覽器使我們最常用的軟件,尤其是作為一名前端從業(yè)人員,更應(yīng)該了解瀏覽器的工作原理。在該系列篇章中我將為大家剖析瀏覽器的工作原理,探究一下當(dāng)你在地址欄輸入‘’到出現(xiàn)頁(yè)面發(fā)生了什么。如果是對(duì)瀏覽器的內(nèi)部原理感興趣的可以一起學(xué)習(xí)下。
在日常工作和生活中我們主要使用5類瀏覽器,IE、、、以及opera。這些瀏覽器的主要功能就是通過向服務(wù)器端發(fā)起請(qǐng)求然后將我們所希望得到的內(nèi)容展示在瀏覽器的窗口中。這些內(nèi)容通常都是以HTML、PDF、圖像或其他方式來(lái)呈現(xiàn)且都是以URL(統(tǒng)一資源定位器)來(lái)指定內(nèi)容資源所在位置,尤其是在網(wǎng)絡(luò)對(duì)話中。
數(shù)年來(lái),各大瀏覽器在遵守一些由W3C指定的共同規(guī)范的同時(shí)也實(shí)現(xiàn)了很多自身特點(diǎn)的擴(kuò)展,這對(duì)web開發(fā)者也帶來(lái)了一些兼容性的問題。但在各大瀏覽器的交互界面中有很多東西是相同的,例如:
1、輸入U(xiǎn)RL的地址欄
2、后退和前進(jìn)的按鈕
3、書簽選項(xiàng)卡
4、用于刷新和停止下載當(dāng)前文檔的刷新和停止按鈕
5、可返回主頁(yè)面的主頁(yè)按鈕
非常奇怪,并沒有誰(shuí)去指定瀏覽器的交互界面必須要具備什么要素,之所以會(huì)出現(xiàn)這種共同性是由各大瀏覽器在長(zhǎng)期的用戶使用實(shí)踐經(jīng)驗(yàn)和相互模仿而導(dǎo)致的。
瀏覽器的高層級(jí)結(jié)構(gòu)窺探
瀏覽器的主要組成部分有:
1、用戶界面-包括地址欄、后退/前進(jìn)按鈕、書簽菜單等等。除了主窗口的頁(yè)面內(nèi)容其他部分均屬于用戶界面
3、渲染引擎-用于展示頁(yè)面內(nèi)容,例如如果所需內(nèi)容是HTML文件,那么渲染引擎會(huì)負(fù)責(zé)解析HTML和CSS,并將內(nèi)容按照指定樣式進(jìn)行展現(xiàn)
4、網(wǎng)絡(luò)-這一部分用于網(wǎng)絡(luò)通話,例如發(fā)起http請(qǐng)求。它擁有獨(dú)立于平臺(tái)的接口且平臺(tái)執(zhí)行的下層。
5、后臺(tái)UI-用于描繪一些諸如多個(gè)模塊或窗口組合的基本組件,它暴露出一個(gè)通用的跨平臺(tái)的接口,在該接口之下調(diào)用操作系統(tǒng)的接口方法。
6、 編譯器-用于編譯和執(zhí)行代碼
7、數(shù)據(jù)存儲(chǔ)-這是一個(gè)固定層瀏覽器工作原理是怎樣的,瀏覽器需要保存位于硬盤上的所有類型的數(shù)據(jù)瀏覽器工作原理是怎樣的,如,HTML5在瀏覽器中定義了一個(gè)雖然輕量級(jí)但相當(dāng)完備的web數(shù)據(jù)庫(kù)
具體瀏覽器構(gòu)造如下圖所示
必須注意的是并不像大多數(shù)瀏覽器,它擁有多種類型的渲染引擎,每一種引擎都對(duì)應(yīng)著一個(gè)tab,而每個(gè)tab都是一個(gè)獨(dú)立的進(jìn)程。
以后我會(huì)對(duì)每個(gè)組成部分都花一篇博文專門進(jìn)行分析。