瀏覽器主要結構
目前，常用的瀏覽器主要有：Chrome、IE（Edge）、Safari、Firefox等。不同的瀏覽器在結構方面雖然有所差異，但是整體的設計理念是相似的。因此，可以抽象得到如下圖所示的參考結構：
組成
1. 用戶界面（User Interface）
包括地址欄、後退/前進按鈕、書籤目錄等，也就是看到的除了顯示所請求頁面的主窗口之外的其他部分
2. 瀏覽器引擎（Browser Engine）
用來查詢及操作渲染引擎的接口
瀏覽器引擎可以加載一個給定的URI，並支持諸如：前進/後退/重新加載等瀏覽操作。
瀏覽器引擎提供查看瀏覽會話的各個方面的掛鉤，例如：當前頁面加載進度、JavaScript alert。
瀏覽器引擎還允許查詢/修改渲染引擎設置。
3. 渲染引擎 （Rendering Engine）
渲染引擎能夠顯示HTML和XML文檔，可選擇CSS樣式，以及嵌入式內容（如圖片）。
渲染引擎能夠準確計算頁面佈局，可使用“迴流”算法逐步調整頁面元素的位置。
渲染引擎內部包含HTML解析器。
4. 網絡（Networking）
網絡系統實現HTTP和FTP等文件傳輸協議。
網絡系統可以在不同的字符集之間進行轉換，爲文件解析MIME媒體類型。
網絡系統可以實現最近檢索資源的緩存功能
5.XML解析器（XML Parser）
XML解析器可以將XML文檔解析成文檔對象模型（Document Object Model，DOM）樹。
XML解析器是瀏覽器架構中複用最多的子系統之一，幾乎所有的瀏覽器實現都利用現有的XML解析器，而不是從頭開始創建自己的XML解析器。
6. JS解釋器（JavaScript Interpreter）
JavaScript解釋器能夠解釋並執行嵌入在網頁中的JavaScript（又稱ECMAScript）代碼。
7.顯示後端 （Display Backend）
用來繪製類似組合選擇框及對話框等基本組件，具有不特定於某個平臺的通用接口，底層使用操作系統的用戶接口。
8. 數據持久層 （Data Persistence）
數據持久層將與瀏覽會話相關聯的各種數據存儲在硬盤上。
這些數據可能是諸如：書籤、工具欄設置等這樣的高級數據，也可能是諸如：Cookie，安全證書、緩存等這樣的低級數據。
內核
瀏覽器內核分成兩部分：渲染引擎和js引擎，由於js引擎越來越獨立，內核就傾向於只指渲染引擎，負責請求網絡頁面資源加以解析排版並呈現給用戶
默認情況下，渲染引擎可以顯示html、xml文檔及圖片，它也可以藉助插件顯示其他類型數據，例如使用PDF閱讀器插件，可以顯示PDF格式
【渲染引擎】
| 瀏覽器 | 渲染引擎 |
|---|---|
| firefox | gecko |
| IE、Edge | Trident |
| chrome\safari\opera | webkit（13年chrome和opera開始使用Blink引擎） |
| QQ瀏覽器和微信內核 | X5（16年開始使用Blink引擎） |
| UC | U3引擎 |
【js引擎】
| 瀏覽器 | js引擎 |
|---|---|
| chrome | V8引擎 |
| firefox | monkey系列 |
| Opera | Carakan引擎 |
| safari | SquirrelFish系列引擎 |
| 老版本IE | Jscript引擎 （IE9之後使用Chakra引擎） |
上面的內容只是簡單介紹下瀏覽器的主要結構，通過圖可以看出重頭戲在渲染引擎（rendering engine）中,下面的幾篇文章都會圍繞這上面的結構圖展開論述，歡迎大家持續關注~