WebKit是一個(gè)渲染引擎，而不是一個(gè)瀏覽器，它專注于網(wǎng)頁(yè)內(nèi)容展示，其中渲染是其中核心的部分之一。本章著重于對(duì)渲染部分的基礎(chǔ)進(jìn)行一定程度的了解和認(rèn)識(shí)，主要理解基于DOM樹(shù)來(lái)介紹Render樹(shù)和RenderLayer樹(shù)的構(gòu)建由來(lái)和方式。

那么什么是DOM？簡(jiǎn)單來(lái)說(shuō)，DOM是對(duì)HTML或者XML等文檔的一種結(jié)構(gòu)化表示方法，通過(guò)這種方式，用戶可以通過(guò)提供標(biāo)準(zhǔn)的接口來(lái)訪問(wèn)HTML頁(yè)面中的任何元素的相關(guān)屬性，并可對(duì)DOM進(jìn)行相應(yīng)的添加、刪除和更新操作等。相關(guān)信息可查閱W3C的文檔，這里不再贅述。

基于DOM樹(shù)的一些可視（visual）的節(jié)點(diǎn)，WebKit來(lái)根據(jù)需要來(lái)創(chuàng)建相應(yīng)的RenderObject節(jié)點(diǎn)，這些節(jié)點(diǎn)也構(gòu)成了一顆樹(shù)，稱之為Render樹(shù)?；赗ender樹(shù)，WebKit也會(huì)根據(jù)需要來(lái)為它們中的某些節(jié)點(diǎn)創(chuàng)建新的RenderLayer節(jié)點(diǎn)，從而形成一棵RenderLayer樹(shù)。

Render樹(shù)和RenderLayer樹(shù)是WebKit支持渲染所提供的基礎(chǔ)但是卻非常重要的設(shè)施。這是因?yàn)閃ebKit的布局計(jì)算依賴它們，瀏覽器的渲染和GPU硬件加速也都依賴于它們。幸運(yùn)地是，得益于它們接口定義的靈活性，不同的瀏覽器可以很方便地來(lái)實(shí)現(xiàn)自己的渲染和加速機(jī)制。

Webkit

同時(shí)WebKit 也是蘋(píng)果Mac OS X 系統(tǒng)引擎框架版本的名稱，主要用于Safari，Dashboard，Mail 和其他一些Mac OS X 程序。WebKit 前身是 KDE 小組的 KHTML，WebKit 所包含的 WebCore 排版引擎和 JSCore 引擎來(lái)自于 KDE 的 KHTML 和 KJS，當(dāng)年蘋(píng)果比較了 Gecko(火狐) 和 KHTML 后，仍然選擇了后者，就因?yàn)樗鼡碛星逦脑创a結(jié)構(gòu)、極快的渲染速度。Apple將 KHTML 發(fā)揚(yáng)光大，推出了裝備 KHTML 改進(jìn)型 WebKit 引擎的瀏覽器 Safari。

Chromium

Chromium雖然是屬于WebKit的分支(程序員fork后改進(jìn)的代碼)，但是把WebKit的代碼梳理得可讀性提高很多，平時(shí)使用chrome瀏覽器是就是一個(gè)Chromium引擎的穩(wěn)定本，是基于webkit內(nèi)核的，手機(jī)等移動(dòng)端瀏覽器一般也都是基于webkit內(nèi)核的瀏覽器，他們的根本都是源于webkit內(nèi)核只是有所改進(jìn)和開(kāi)發(fā)而已，現(xiàn)在一般將蘋(píng)果的瀏覽器、chrome瀏覽器、移動(dòng)端的一些瀏覽器都成為webkit內(nèi)核不做細(xì)分。

拓展

瀏覽器的內(nèi)核引擎分類

Trident: 又稱為MSHTML，IE 以Trident 作為內(nèi)核引擎(已經(jīng)被拋棄)

EdgeHTML：舊版本的edge瀏覽器

Gecko: Firefox 是基于 Gecko 開(kāi)發(fā)

WebKit: Safari, Google Chrome，新版Edge

Presto: Opera的內(nèi)核，但由于市場(chǎng)選擇問(wèn)題，主要應(yīng)用在手機(jī)平臺(tái)–Opera mini

注：2013年2月Opera宣布轉(zhuǎn)向WebKit引擎

注：2013年4月Opera宣布放棄WEBKIT，跟隨GOOGLE的新開(kāi)發(fā)的blink引擎

————————————————

版權(quán)聲明：本文部分內(nèi)容

原文鏈接：https://blog.csdn.net/ljh101/article/details/110261636

~擴(kuò)展閱讀~

理解WebKit和Chromium: WebKit, WebKit2, Chromium和Chrome介紹

#概述

在介紹本系列各個(gè)專題之前，有必要先解釋一下極其容易混淆的幾個(gè)概念，它們是WebKit，WebKit2，Chromium和Chrome。

首先來(lái)了解WebKit。廣義上來(lái)說(shuō)，WebKit是一個(gè)開(kāi)源的項(xiàng)目，其前身是來(lái)源于KDE的KHTML和KJS。該項(xiàng)目專注于網(wǎng)頁(yè)內(nèi)容的展示，開(kāi)發(fā)出一流的網(wǎng)頁(yè)渲染引擎。它不是瀏覽器，而且也不想成為瀏覽器。 該項(xiàng)目包含兩個(gè)部分，第一是WebCore，其中包含了對(duì)HTML，CSS等很多W3C規(guī)范的實(shí)現(xiàn)；第二部分就是狹義上的WebKit，它主要是各個(gè)平臺(tái)的的移植并提供相對(duì)應(yīng)的Web接口，也就是WebView或者類似WebView，這些接口提供操作和顯示網(wǎng)頁(yè)的能力。目前使用WebKit的主流的瀏覽器或者WebView包括Chrome, Safari, QtWebKit, Android Browser以及眾多的移動(dòng)平臺(tái)的瀏覽器。

WebKit2相對(duì)于狹義上的WebKit而言，它不是WebKit簡(jiǎn)單的第二個(gè)版本，它是一個(gè)新的API層，其最主要的變化在于將網(wǎng)頁(yè)的渲染置于單獨(dú)的進(jìn)程，而接口層則在另外一個(gè)進(jìn)程，它們之間通過(guò)IPC來(lái)通訊。對(duì)于接口的調(diào)用者來(lái)說(shuō)，中間的IPC和底下的實(shí)現(xiàn)是透明的，這樣做的好處有很多，一個(gè)很明顯的好處是，當(dāng)網(wǎng)頁(yè)的渲染出現(xiàn)問(wèn)題時(shí)，不會(huì)阻礙Web接口的調(diào)用者進(jìn)程，這會(huì)在很大程度上解決或者幫助解決瀏覽器或者這些調(diào)用者的穩(wěn)定性和安全性等問(wèn)題。

Chromium是一個(gè)建立在WebKit之上的瀏覽器開(kāi)源項(xiàng)目，由Google發(fā)起的。該項(xiàng)目被創(chuàng)建以來(lái)發(fā)展迅速，很多先進(jìn)的技術(shù)被采用，如跨進(jìn)程模型，沙箱模型等等。同時(shí)，很多新的規(guī)范被支持，例如WebGL，Canvas2D，CSS3以及其他很多的HTML5特性，基本上每天你都可以看到它的變化，它的版本升級(jí)很快。在性能方面，其也備受稱贊，包括快速啟動(dòng)，網(wǎng)頁(yè)加載迅速等。

Chrome是Google公司的瀏覽器產(chǎn)品，它基于chromium開(kāi)源項(xiàng)目，一般選擇穩(wěn)定的版本作為它的基礎(chǔ)，它和chromium的不同點(diǎn)在于chromium是開(kāi)源試驗(yàn)場(chǎng)，會(huì)嘗試很多新的東西，當(dāng)這些東西穩(wěn)定之后，chrome才會(huì)集成進(jìn)來(lái)，這也就是說(shuō)chrome的版本會(huì)落后于chromium。另外一個(gè)就是，chrome里面會(huì)加入一些私有的codec，這些僅在chrome中才會(huì)出現(xiàn)。再次，chrome還會(huì)整合Google的很多服務(wù)， 最后chrome還會(huì)有自動(dòng)更新的功能，這也是chromium所沒(méi)有的。

#參考文獻(xiàn)

1. ?http://www.webkit.org/

2. http://trac.webkit.org/wiki/WebKit2By yongsheng@chromium.org

-----------------------------------

理解WebKit和Chromium: WebKit, WebKit2, Chromium和Chrome介紹

https://blog.51cto.com/u_15469043/4896549

理解WebKit和Chromium: WebKit和Chromium組成

在“WebKit，WebKit2，Chromium和Chrome介紹”中，大致了解了WebKit是一個(gè)渲染引擎，Chromium是一個(gè)瀏覽器，它們那么分別包含哪些不同的功能模塊？它們是如何劃分地？本章節(jié)來(lái)為大家詳細(xì)解讀一下。

WebKit:

1. HTML解析:：負(fù)責(zé)HTML語(yǔ)言的解析

2. CSS解析：負(fù)責(zé)CSS的解析工作

3. 圖片解碼：支持不同編碼格式的圖片

4. JavaScript引擎：JavaScript語(yǔ)言的解析引擎，缺省的是JavaScriptCore，但是目前Google 的V8 JavaScript被廣泛使用

5. 正則表達(dá)式

6. 布局：負(fù)責(zé)布局(layout)的計(jì)算和更新工作

7. 文檔對(duì)象模型(DOM)：DOM是W3C定義的對(duì)象模型，該部分負(fù)責(zé)DOM樹(shù)及其相應(yīng)的接口

8. 渲染：與渲染相關(guān)的基礎(chǔ)設(shè)施，例如渲染樹(shù)，渲染層次樹(shù)等等

9. SVG：對(duì)SVG的支持

10. XML解析：XML語(yǔ)言的解析

11. XSLT：XSLT語(yǔ)言的解析執(zhí)行

12. URL解析器：URL規(guī)范的解析

13. Unicode編解碼器：各種編碼解碼工作

14. 移植：WebKit中比較大的一部分，因?yàn)閃ebKit要工作需要不同平臺(tái)上有具體的實(shí)現(xiàn)，因而不同的移植有不同的實(shí)現(xiàn)。chromium的移植很復(fù)雜，因?yàn)槠渲С挚缙脚_(tái)，所以它的移植需要在windows，linux和mac上工作。

由上面的模塊大致可以WebKit主要是跟網(wǎng)頁(yè)的解析和渲染相關(guān)的工作，其不涉及瀏覽器的歷史，書(shū)簽，下載，cookie管理等等方面的工作。

Chromium:

1. Cookie管理器：cookie生命周期的管理

2. 歷史管理器：歷史記錄的管理

3. 密碼管理器：網(wǎng)頁(yè)中密碼登錄信息管理

4. 窗口管理：多個(gè)Tab窗口的管理和切換

5. 地址欄：地址欄功能，智能地址填充與書(shū)簽的協(xié)同工作

6. 安全瀏覽黑名單管理：安全瀏覽機(jī)制

7. 網(wǎng)絡(luò)棧：與網(wǎng)絡(luò)傳輸相關(guān)的工作，其有很多創(chuàng)新的東西

8. SSL/TLS：網(wǎng)絡(luò)傳輸安全

9. 磁盤(pán)緩存：磁盤(pán)緩存頁(yè)面及其替換策略等生命周期的管理

10. 下載管理器：管理下載相關(guān)

11. 粘帖板：clipboard的功能

12.書(shū)簽管理：書(shū)簽的組織和管理

13. URL解析器：同WebKit

14. Unicode編解碼器：同WebKit

Chromium主要是實(shí)現(xiàn)瀏覽器相關(guān)的功能，如上面中的網(wǎng)絡(luò)棧等等。其實(shí)以上只是一些瀏覽器基本功能，chromium實(shí)現(xiàn)的遠(yuǎn)不止這些，這其中包含沙箱模型，NaCl，擴(kuò)展機(jī)制，硬件加速架構(gòu)等等。這些我們將在之后的章節(jié)中逐一介紹它們。

URL解析器和Unicode編解碼器在兩者中都存在是因?yàn)樗鼈兌家褂玫健?/p>

Byyongsheng@chromium.org

-----------------------------------

理解WebKit和Chromium: WebKit和Chromium組成

https://blog.51cto.com/u_15469043/4903241

//僅做筆記，感興趣可以收藏 討論~ 也可以指錯(cuò)