前兩天看到一篇不錯的英文文章，叫做How browsers work，該文概要的介紹了瀏覽器從頭到尾的工作機制亥揖，包括HTML等的解析，DOM樹的生成圣勒，節(jié)點與CSS的渲染等等费变，對于想學(xué)習(xí)瀏覽器源碼的同學(xué)來說，實在是很棒的一篇科普文章灾而。盡管對于每部分胡控，該文的描述并不足夠深入，但綜合來講旁趟，即使沒興趣學(xué)瀏覽器源碼昼激，也還是有一些值的學(xué)習(xí)的思想在里面的庇绽，可以權(quán)當(dāng)開拓下視野，有益無害橙困。
于是瞧掺，我想分節(jié)挑重點翻譯一下與大家分享。以下為譯文：
當(dāng)今主流瀏覽器有五類： Internet Explorer, Firefox, Safari, Chrome 以及 Opera凡傅。 我會基于開源瀏覽器 Firefox, Chrome 與 Safari（部分開源）來舉例說明辟狈。 按照W3C 瀏覽器統(tǒng)計, 當(dāng)今(2009年10月), Firefox, Safari 及 Chrome 的總占有率已接近 60%，這是非诚孽危可觀的哼转。
瀏覽器的主要功能是展示網(wǎng)頁資源，也即請求服務(wù)器并將結(jié)果顯示在瀏覽器窗口中槽华。資源的格式一般是HTML壹蔓，但也有PDF、圖片等其它各種格式猫态。資源的定位由URL來實現(xiàn)佣蓉。更多細(xì)節(jié)請參考“網(wǎng)絡(luò)”一節(jié)。
瀏覽器釋與展現(xiàn)HTML文件的方式是參照HTML與CSS規(guī)范來的亲雪，這些規(guī)范由W3C (World Wide Web Consortium) Web標(biāo)準(zhǔn)化組織來維護勇凭。 當(dāng)前HTML版本是 4 (http://www.w3.org/TR/html401/)，HTML5正在進(jìn)行中义辕。當(dāng)前CSS版本為2 (http://www.w3.org/TR/CSS2/)虾标，同樣，版本3進(jìn)行中终息。
過去幾年里夺巩，各版本瀏覽器有許多各自的擴展贞让，這使網(wǎng)頁作者很難寫出兼容性好的內(nèi)容周崭。如今這一嚴(yán)重的兼容性問題已經(jīng)開始好轉(zhuǎn)，各種瀏覽器都開始兼容標(biāo)準(zhǔn)規(guī)范喳张。
各瀏覽器的用戶接口有很多相同的地方续镇，下面是一些常用的用戶接口：
用于輸入URI的地址欄
前進(jìn)后退按鈕
書簽選項
刷新停止按鈕，用于控制頁面加載
主頁按鈕
很奇怪的是销部，瀏覽器的用戶接口并沒有寫進(jìn)任何規(guī)范中摸航，這種極大的相似性只是在多年的實踐經(jīng)驗以及瀏覽器之間的相互借鑒中形成的。HTML5規(guī)范沒有規(guī)定瀏覽器必須有哪些交互元素舅桩，但是列出了一些通用元素酱虎，比如地址欄, 狀態(tài)欄和工具欄。 當(dāng)然擂涛，特定瀏覽器有自己獨有的特性读串，如Firefox的下載管理器。更多內(nèi)容請參考用戶接口一節(jié)。
瀏覽器的主要概念如下 (1.1):
用戶接口 – 包括地址欄恢暖，前進(jìn)后退排监，書簽菜單等窗口上除了網(wǎng)頁顯示區(qū)域以外的部分。
瀏覽器引擎 – 查詢與操作渲染引擎的接口杰捂。
渲染引擎 – 負(fù)責(zé)顯示請求的內(nèi)容舆床。比如請求到HTML, 它會負(fù)責(zé)解析HTML 與 CSS 并將結(jié)果顯示到窗口中。
網(wǎng)絡(luò) – 用于網(wǎng)絡(luò)請求, 如HTTP請求嫁佳。它包括平臺無關(guān)的接口和各平臺獨立的實現(xiàn)挨队。
UI后端 – 繪制基礎(chǔ)元件，如組合框與窗口蒿往。它提供平臺無關(guān)的接口瞒瘸，內(nèi)部使用操作系統(tǒng)的相應(yīng)實現(xiàn)。
JavaScript解釋器熄浓。用于解析執(zhí)行JavaScript代碼情臭。
數(shù)據(jù)存儲。這是一個持久層赌蔑。瀏覽器需要把所有數(shù)據(jù)存到硬盤上俯在，如cookies。新的HTML規(guī)范 (HTML5) 規(guī)定了一個完整（雖然輕量級）的瀏覽器中的數(shù)據(jù)庫：’web database’娃惯。
圖1: 瀏覽器的主要概念
需要注意的是跷乐，與其它瀏覽器不同，chrome使用多個渲染引擎實例趾浅，每個Tab一個愕提，每個Tab都是一個獨立進(jìn)程。
我會拿出一個章節(jié)來介紹每塊內(nèi)容皿哨。
Firefox 與 Chrome 開發(fā)了一種特殊的通信架構(gòu)浅侨，這會在一個特殊章節(jié)討論。
