WebKit技術(shù)內(nèi)幕-創(chuàng)新互聯(lián)

WebKit技術(shù)內(nèi)幕（瀏覽器內(nèi)核|渲染引擎| HTML5| Chromium項目Committer重磅作品）

湖北ssl適用于網(wǎng)站、小程序/APP、API接口等需要進行數(shù)據(jù)傳輸應(yīng)用場景，ssl證書未來市場廣闊！成為成都創(chuàng)新互聯(lián)的ssl證書銷售渠道，可以享受市場價格4-6折優(yōu)惠！如果有意向歡迎電話聯(lián)系或者加微信：18982081108（備注：SSL證書合作）期待與您的合作！

朱永盛著

ISBN 978-7-121-22964-0

2014年6月出版

定價：79.00元

456頁

16開

編輯推薦

WebKit作為支持HTML5的主流渲染引擎，近年來備受前端開發(fā)者關(guān)注。本書將揭示W(wǎng)ebKit總體架構(gòu)、網(wǎng)頁渲染原理，及其對硬件與最新技術(shù)的高效利用，以及高性能Web實踐等，內(nèi)容涉及Web前端所有重要話題。

√本書作者為Chromium貢獻(xiàn)者，及開源項目Crosswalk初創(chuàng)人。

√每一主題均涵蓋基本定義、內(nèi)部原理及其對Web前端開發(fā)實踐的啟示。

√剖析WebKit如何對HTML5諸項技術(shù)提供支持，包括：網(wǎng)絡(luò)、CSS和布局、2D/3D圖形圖像、硬件加速渲染、JavaScript引擎、多媒體、混合編程、安全機制等。

√詳解Web前端領(lǐng)域所涉及的各種性能瓶頸，以及針對問題的應(yīng)對之策。

√結(jié)合目前最熱門的移動技術(shù)，分析WebKit在移動領(lǐng)域的發(fā)展，以及移動領(lǐng)域為最前沿Web應(yīng)用與Web運行環(huán)境帶來的機遇。

√探討Web前端未來的可能發(fā)展方向，包括向不同應(yīng)用場景和應(yīng)用領(lǐng)域的***。

內(nèi)容提要

《WebKit技術(shù)內(nèi)幕》從炙手可熱的HTML5 的基礎(chǔ)知識入手，重點闡述目前應(yīng)用最廣的渲染引擎項目——WebKit。不僅著眼于系統(tǒng)描述WebKit內(nèi)部渲染HTML 網(wǎng)頁的原理，并基于Chromium 的實現(xiàn)，闡明渲染引擎如何高效地利用硬件和最新技術(shù)，而且試圖通過對原理的剖析，向讀者傳授實現(xiàn)高性能Web 前端開發(fā)所需的寶貴經(jīng)驗。

《WebKit技術(shù)內(nèi)幕》首先從總體上描述WebKit 架構(gòu)和組成，而后涵蓋Web 前端和所有與之相關(guān)的重要技術(shù)，包括網(wǎng)絡(luò)、資源加載、HTML 和CSS 解析、渲染樹、布局、硬件加速、JavaScript 引擎、多媒體、移動支持、插件機制、安全機制、調(diào)試和最新的Web 平臺等。對于每一項技術(shù)，在介紹基本含義之上，詳細(xì)分析WebKit 內(nèi)部的工作原理，進而從實踐角度道出由此帶來的Web 前端開發(fā)啟示。

第1章　瀏覽器和瀏覽器內(nèi)核 1

1.1 瀏覽器 1

1.1.1 瀏覽器簡介 1

1.1.2 瀏覽器特性 4

1.1.3 HTML 5

1.1.4　用戶代理和瀏覽器行為 8

1.1.5 實踐：瀏覽器用戶代理 9

1.2 瀏覽器內(nèi)核及特性 11

1.2.1 內(nèi)核和主流內(nèi)核 11

1.2.2 內(nèi)核特征 12

1.3 WebKit內(nèi)核 15

1.3.1 WebKit介紹 15

1.3.2 WebKit和WebKit2 16

1.3.3 Chromium內(nèi)核：Blink 18

1.4 本書結(jié)構(gòu) 18

第2章　HTML網(wǎng)頁和結(jié)構(gòu) 21

2.1 網(wǎng)頁構(gòu)成 21

2.1.1 基本元素和樹狀結(jié)構(gòu) 21

2.1.2 HTML5新特性 23

2.2 網(wǎng)頁結(jié)構(gòu) 25

2.2.1 框結(jié)構(gòu) 25

2.2.2 層次結(jié)構(gòu) 27

2.2.3 實踐：理解網(wǎng)頁結(jié)構(gòu) 29

2.3 WebKit的網(wǎng)頁渲染過程 31

2.3.1 加載和渲染 31

2.3.2 WebKit的渲染過程 32

2.3.3 實踐：從網(wǎng)頁到可視化結(jié)果 35

第3章　WebKit架構(gòu)和模塊 39

3.1 WebKit架構(gòu)及模塊 39

3.1.1 獲取WebKit 39

3.1.2 WebKit架構(gòu) 40

3.1.3 WebKit源代碼結(jié)構(gòu) 43

3.2 基于Blink的Chromium瀏覽器結(jié)構(gòu) 45

3.2.1 Chromium瀏覽器的架構(gòu)及模塊 45

3.2.2 實踐：從Chromium代碼結(jié)構(gòu)和運行狀態(tài)理解現(xiàn)代瀏覽器 56

3.3 WebKit2 61

3.3.1 WebKit2架構(gòu)及模塊 61

3.3.2 WebKit和WebKit2嵌入式接口 62

3.3.3 比較WebKit2和Chromium的多進程模型以及接口 63

第4章　資源加載和網(wǎng)絡(luò)棧 65

4.1 WebKit資源加載機制 65

4.1.1 資源 65

4.1.2 資源緩存 67

4.1.3 資源加載器 68

4.1.4 過程 69

4.1.5 資源的生命周期 70

4.1.6 實踐：資源的緩存 71

4.2 Chromium多進程資源加載 74

4.2.1 多進程 74

4.2.2 工作方式和資源共享 76

4.3 網(wǎng)絡(luò)棧 78

4.3.1 WebKit的網(wǎng)絡(luò)設(shè)施 78

4.3.2 Chromium網(wǎng)絡(luò)棧 78

4.3.3 磁盤本地緩存 84

4.3.4 Cookie機制 88

4.3.5 安全機制 90

4.3.6 高性能網(wǎng)絡(luò)棧 90

4.3.7 實踐：Chromium網(wǎng)絡(luò)工具和信息 97

4.4 實踐：高效的資源使用策略 99

4.4.1 DNS和TCP連接 99

4.4.2 資源的數(shù)量 99

4.4.3 資源的數(shù)據(jù)量 100

第5章　HTML解釋器和DOM模型 101

5.1 DOM模型 101

5.1.1 DOM標(biāo)準(zhǔn) 101

5.1.2 DOM樹 104

5.2 HTML解釋器 107

5.2.1 解釋過程 107

5.2.2 詞法分析 110

5.2.3 XSSAuditor驗證詞語 111

5.2.4 詞語到節(jié)點 111

5.2.5 節(jié)點到DOM樹 113

5.2.6 網(wǎng)頁基礎(chǔ)設(shè)施 114

5.2.7 線程化的解釋器 117

5.2.8 JavaScript的執(zhí)行 119

5.2.9 實踐：理解DOM樹 120

5.3 DOM的事件機制 121

5.3.1 事件的工作過程 122

5.3.2 WebKit的事件處理機制 123

5.3.3 實踐：事件的傳遞機制 125

5.4 影子（Shadow）DOM 127

5.4.1 什么是影子DOM 127

5.4.2 WebKit的支持 128

5.4.3 實踐：使用影子DOM 129

第6章　CSS解釋器和樣式布局 131

6.1 CSS基本功能 131

6.1.1 簡介 131

6.1.2 樣式規(guī)則 134

6.1.3 選擇器 135

6.1.4 框模型 136

6.1.5 包含塊（Containing Block）模型 139

6.1.6 CSS樣式屬性 139

6.1.7 CSSOM（CSS Object Model） 140

6.1.8 實踐：理解CSSOM和選擇器 141

6.2 CSS解釋器和規(guī)則匹配 143

6.2.1 樣式的WebKit表示類 143

6.2.2 解釋過程 146

6.2.3 樣式規(guī)則匹配 148

6.2.4 實踐：樣式匹配 149

6.2.5 JavaScript設(shè)置樣式 151

6.3 WebKit布局 152

6.3.1 基礎(chǔ) 152

6.3.2 布局計算 153

6.3.3 布局測試 155

第7章　渲染基礎(chǔ) 157

7.1 RenderObject樹 157

7.1.1 RenderObject基礎(chǔ)類 157

7.1.2 RenderObject樹 162

7.2 網(wǎng)頁層次和RenderLayer樹 163

7.2.1 層次和RenderLayer對象 163

7.2.2 構(gòu)建RenderLayer樹 165

7.3 渲染方式 167

7.3.1 繪圖上下文（GraphicsContext） 167

7.3.2 渲染方式 169

7.4 WebKit軟件渲染技術(shù) 172

7.4.1 軟件渲染過程 172

7.4.2 Chromium的多進程軟件渲染技術(shù) 177

7.4.3 實踐：軟件渲染過程 180

第8章　硬件加速機制 183

8.1 硬件加速基礎(chǔ) 183

8.1.1 概念 183

8.1.2 WebKit硬件加速設(shè)施 185

8.1.3 硬件渲染過程 189

8.1.4 3D圖形上下文 193

8.2 Chromium的硬件加速機制 194

8.2.1 GraphicsLayer的支持 194

8.2.2 框架 196

8.2.3 命令緩沖區(qū) 200

8.2.4 Chromium合成器（Chromium Compositor） 202

8.2.5 實踐：減少重繪 213

8.3 其他硬件加速模塊 216

8.3.1 2D圖形的硬件加速機制 216

8.3.2 WebGL 223

8.3.3 CSS 3D變形 228

8.3.4 其他 229

8.3.5 實踐：Chromium的支持 229

第9章　JavaScript引擎 231

9.1 概述 231

9.1.1 JavaScript語言 231

9.1.2 JavaScript引擎 238

9.1.3 JavaScript引擎和渲染引擎 241

9.2 V8引擎 242

9.2.1 基礎(chǔ) 242

9.2.2 工作原理 246

9.2.3 綁定和擴展 258

9.3 JavaScriptCore引擎 259

9.3.1 原理 259

9.3.2 架構(gòu)和模塊 259

9.3.4 內(nèi)存管理 265

9.3.5 綁定 266

9.3.6 比較JavaScriptCore和V8 266

9.4 實踐——高效的JavaScript代碼 266

9.4.1 編程方式 266

9.4.2 例子 268

9.4.3 未來 271

第10章　插件和JavaScript擴展 273

10.1 NPAPI插件 274

10.1.1 NPAPI簡介 274

10.1.2 WebKit和Chromium的實現(xiàn) 275

10.2 Chromium PPAPI插件 284

10.2.1 原理 284

10.2.2 結(jié)構(gòu)和接口 285

10.2.3 工作過程 288

10.2.4 Native Client 294

10.3 JavaScript引擎的擴展機制 297

10.3.1 混合編程 297

10.3.2 JavaScript擴展機制 299

10.4 Chromium擴展機制 303

10.4.1 原理 303

10.4.2 基本設(shè)施 306

10.4.3 消息傳遞機制 309

第11章　多媒體 311

11.1 HTML5的多媒體支持 311

11.2 視頻 313

11.2.1 HTML5視頻 313

11.2.2 WebKit基礎(chǔ)設(shè)施 315

11.2.3 Chromium視頻機制 317

11.2.4 字幕 328

11.2.5 視頻擴展 330

11.3 音頻 331

11.3.1 音頻元素 331

11.3.2 Web Audio 334

11.3.3 MIDI和Web MIDI 336

11.3.4 Web Speech 337

11.4 WebRTC 339

11.4.1 歷史 339

11.4.2 原理和規(guī)范 341

11.4.3 實踐——一個WebRTC例子 342

11.4.4 WebKit和Chromium的實現(xiàn) 345

第12章　安全機制 353

12.1 網(wǎng)頁安全模型 353

12.1.1 安全模型基礎(chǔ) 353

12.1.2 WebKit的實現(xiàn) 363

12.2 沙箱模型 366

12.2.1 原理 366

12.2.2 實現(xiàn)機制 367

第13章　移動WebKit 373

13.1 觸控和手勢事件 373

13.1.1 HTML5規(guī)范 373

13.1.2 工作原理 377

13.1.3 啟示和實踐 381

13.2 移動化用戶界面 382

13.3 其他機制 384

13.3.1 新渲染機制 384

13.3.2 其他機制 387

第14章　調(diào)試機制 389

14.1 Web Inspector 389

14.1.1 基本原理 389

14.1.2 協(xié)議 391

14.1.3 WebKit內(nèi)部機制 395

14.1.4 Chromium開發(fā)者工具 398

14.1.5 遠(yuǎn)程調(diào)試 400

14.1.6 Chromium Tracing機制 402

14.2 實踐——基礎(chǔ)和性能調(diào)試 404

14.2.1 基礎(chǔ)調(diào)試 404

14.2.2 性能調(diào)試 408

第15章　Web前端的未來 411

15.1 趨勢 411

15.2 嵌入式應(yīng)用模式 414

15.2.1 嵌入式模式 414

15.2.2 CEF 414

15.2.3 Android WebView 417

15.3 Web應(yīng)用和Web運行環(huán)境 419

15.3.1 Web應(yīng)用 419

15.3.2 Web運行環(huán)境 421

15.4 Cordova項目 423

15.5 Crosswalk項目 425

15.6 Chromium OS和Chrome的Web應(yīng)用 429

15.6.1 基本原理 429

15.6.2 其他Web操作系統(tǒng) 431

參考資料 435

作者簡介

朱永盛，Chromium項目Committer，2006年從南京大學(xué)畢業(yè)后就職于英特爾亞太研發(fā)有限公司，專注于HTML5、WebKit和Chromium等方面技術(shù)，參與過多個瀏覽器和Web運行環(huán)境項目，并向業(yè)界大會和技術(shù)愛好者做過多次技術(shù)分享。2013年開始初創(chuàng)Android系統(tǒng)上的Web運行環(huán)境的開源項目——Crosswalk。個人博客：blog.csdn.net/milado_nju

媒體評論

WebKit是一個非常成功的項目，它不僅僅是渲染引擎，而且成功的推動了網(wǎng)絡(luò)的發(fā)展。

基于WebKit渲染引擎的瀏覽器項目Chromium，成為率先支持HTML5功能和創(chuàng)新功能的標(biāo)桿。

完整理解一個Web渲染引擎和瀏覽器并不容易，其包含眾多復(fù)雜功能。

WebKit項目和Chromium項目（不包括該項目依賴的眾多第三方項目）的代碼量在500萬行以上，而這些代碼很多并沒有完善文檔，理解工作其原理異常困難。

前言

隨著HTML5的快速發(fā)展和網(wǎng)絡(luò)時代的到來，Web的接入口——瀏覽器越來越重要，而作為瀏覽器的內(nèi)核——渲染引擎也變成了熱門話題。自筆者接觸HTML5技術(shù)和瀏覽器以來，深深地被這一包含眾多非凡技術(shù)的新領(lǐng)域所吸引，并由此產(chǎn)生了很多疑問，為此，我開始了漫長的學(xué)習(xí)和研究WebKit（及Blink）渲染引擎和Chromium瀏覽器的征程。雖然WebKit項目本身非常復(fù)雜，但是其簡單的代碼結(jié)構(gòu)、清晰的邏輯給我留下了深刻的印象，因為在這些復(fù)雜技術(shù)的背后，竟然也可以使用良好的設(shè)計去解決技術(shù)的復(fù)雜性。而基于WebKit的Chromium項目更是將眾多大膽的新技術(shù)引入到了瀏覽器領(lǐng)域，讓人耳目一新。

WebKit是一個非常成功的項目，它不僅僅是個渲染引擎，而且成功地推動了網(wǎng)絡(luò)的發(fā)展?；赪ebKit渲染引擎的瀏覽器項目Chromium，更是成為率先支持HTML5功能和創(chuàng)新新功能的標(biāo)桿。要完整理解一個Web渲染引擎和瀏覽器并不容易，因為它們的確包含了眾多復(fù)雜的功能。據(jù)筆者的統(tǒng)計，WebKit項目和Chromium項目（不包括該項目依賴的眾多第三方項目）的代碼量都在500萬行以上，而這些代碼很多并沒有完善的文檔，所以理解這些技術(shù)背后的工作原理還是非常困難的。

隨著學(xué)習(xí)的深入，筆者發(fā)現(xiàn)目前對于整個渲染引擎的分析和文檔化還處于一個缺失的狀態(tài)。同時，因為渲染引擎和瀏覽器包含了太多的技術(shù)，讓人有點應(yīng)接不暇的感覺。雖然WebKit項目代碼結(jié)構(gòu)簡單，但是由于文檔的缺失，愛好者對于每一項新技術(shù)，也經(jīng)常有不知從何下手的感覺。為此，筆者結(jié)合自身的理解，通過這本書系統(tǒng)性地分析這一領(lǐng)域的眾多技術(shù)，希望能幫助讀者快速度過迷茫的時期。

本書的讀者

本書主要是為Web愛好者準(zhǔn)備的一本書，主要針對Web前端開發(fā)者、瀏覽器開發(fā)者、Web平臺開發(fā)者和其他一切對HTML5技術(shù)、WebKit渲染引擎和Chromium瀏覽器的工作原理感興趣的讀者。對于Web前端開發(fā)者而言，筆者一直認(rèn)為，如果使用HTML5技術(shù)來編寫網(wǎng)頁或者Web應(yīng)用，了解其背后的工作原理是寫出高效代碼的有效捷徑。就像開發(fā)者想編寫高效C++代碼，需要理解C++編譯器背后的原理一樣，因為只有這樣，開發(fā)者才能夠編寫出高性能的代碼。對于瀏覽器開發(fā)者來說，本書著重介紹現(xiàn)在非常熱門的WebKit（及Blink）渲染引擎和非常先進的Chromium瀏覽器，通過解釋其內(nèi)部的工作機制和原理，讓開發(fā)者可以很快理解這一切的前因后果。對于其他的廣大愛好者來說，HTML5技術(shù)才剛剛開始，未來的發(fā)展還將繼續(xù)，了解這一技術(shù)有助于擴展視野，而且理解瀏覽器對各種技術(shù)的應(yīng)用和設(shè)計，對于大家理解很多其他領(lǐng)域的技術(shù)也有很強的啟發(fā)作用。

因為本書的介紹主要是基于對WebKit和Chromium內(nèi)部原理的解釋來進行，而這些項目也都是基于C/C++代碼來編寫，所以讀者最好對該語言有一些了解。不過，如果不了解它也沒有太大的關(guān)系，只要對面向?qū)ο缶幊痰乃枷胗兴私?，閱讀本書也沒有太大的障礙。同時，本書不是一本介紹編寫HTML/JavaScript代碼的書，所以，不會對HTML的編程做過多詳細(xì)的解釋，而是以一種簡單的方式描述一些基礎(chǔ)性常識。

本書的組織

本書基本的寫作方式是力求在介紹HTML5技術(shù)的基礎(chǔ)上，通過對W3C組織制定的規(guī)范的解釋，進一步解讀WebKit渲染引擎和Chromium瀏覽器是如何設(shè)計出高效的架構(gòu)來支持這些HTML5技術(shù)規(guī)范的，其中著重剖析內(nèi)部的框架和工作原理。在很多情況下，筆者也試圖通過一些開發(fā)和工作實踐來幫助理解這些框架和實現(xiàn)背后的機制和原理。

如果想了解整個渲染引擎的原理，光靠渲染引擎本身不足以說明所有機制，所以本書自始至終都是結(jié)合WebKit項目和基于WebKit的Chromium瀏覽器項目來描述其工作原理的，因為WebKit項目本身不是一個瀏覽器，而Chromium瀏覽器的設(shè)計和架構(gòu)可以幫助讀者完整理解網(wǎng)頁的渲染過程和現(xiàn)代HTML5新技術(shù)是如何獲得支持的，這一過程的確非常精彩。

為了理解HTML5新技術(shù)和瀏覽器的工作原理，本書著重帶來以下方面的詳細(xì)分析，包括HTML5技術(shù)分析、渲染引擎和瀏覽器介紹、WebKit渲染引擎框架、Chromium框架和進程架構(gòu)、網(wǎng)頁和網(wǎng)頁結(jié)構(gòu)、渲染過程、網(wǎng)絡(luò)棧、HTML語言、DOM、CSS樣式、布局計算、渲染基礎(chǔ)、高級硬件加速機制、JavaScript引擎、插件和擴展、多媒體、移動領(lǐng)域、安全機制、調(diào)試機制、發(fā)展趨勢和Web平臺等眾多熱門技術(shù)和前沿性話題。筆者希望將HTML5中絕大多數(shù)的重要技術(shù)都展現(xiàn)出來，讓讀者可以對這個領(lǐng)域的眾多技術(shù)有個總體把握并對主要技術(shù)的前因后果有較為深入的理解。

本書引用的參考資料都是筆者多年來研究的對象，對于筆者理解HTML5技術(shù)、前端開發(fā)技術(shù)、渲染引擎和瀏覽器技術(shù)起了非常重要的作用，一些論題可能在本書中介紹得不夠完善，讀者可以參考這些資料，做進一步的學(xué)習(xí)和研究。

本書是一個講解內(nèi)部原理的書，涉及眾多的技術(shù)，特別是深入技術(shù)內(nèi)部工作機制的地方，由于這些內(nèi)容非常復(fù)雜，而且是根據(jù)筆者個人的理解加以分析，所以很多時候可能存在理解上的偏差或者錯誤。如果有什么不妥之處，還望廣大讀者諒解并給予指導(dǎo)，或者將意見發(fā)送到我的郵箱：yongsheng@chromium.org。

致謝

感謝電子工業(yè)出版社的張春雨、王新宇、尚冰雪等編輯，自始至終給予筆者的強有力的幫助和支持。特別感謝我在英特爾亞太研發(fā)有限公司的同事，包括但是不限于閔洪波、王興楠、余枝強、劉守群、朱俊敏、王視鎏、胡寧馨、高純、尹立、顧揚、馮海濤、霍海濤等，他們同我一起探討了很多關(guān)于HTML5、WebKit和Chromium方面的話題，讓我受益匪淺。

最后要感謝我的太太、女兒和父母，在寫作的大半年時間里給予了筆者很多支持。因為本書是在繁忙的工作之余利用瑣碎的業(yè)余時間來完成的，所以，如果沒有家人提供的良好環(huán)境，我是沒有辦法完成這本書的。特別是我的小女兒經(jīng)常過來“光顧”和“巡視”我的寫作，并給予一些特別的“驚喜”和“禮物”，讓我在寫作之余多了一份樂趣。

朱永盛

2014年2月1日

WebKit技術(shù)內(nèi)幕

另外有需要云服務(wù)器可以了解下創(chuàng)新互聯(lián)cdcxhl.cn，海內(nèi)外云服務(wù)器15元起步，三天無理由+7*72小時售后在線，公司持有idc許可證，提供“云服務(wù)器、裸金屬服務(wù)器、高防服務(wù)器、香港服務(wù)器、美國服務(wù)器、虛擬主機、免備案服務(wù)器”等云主機租用服務(wù)以及企業(yè)上云的綜合解決方案，具有“安全穩(wěn)定、簡單易用、服務(wù)可用性高、性價比高”等特點與優(yōu)勢，專為企業(yè)上云打造定制，能夠滿足用戶豐富、多元化的應(yīng)用場景需求。

網(wǎng)站名稱：WebKit技術(shù)內(nèi)幕-創(chuàng)新互聯(lián)
文章出自：http://muchs.cn/article2/ddoioc.html

成都網(wǎng)站建設(shè)公司_創(chuàng)新互聯(lián)，為您提供網(wǎng)站策劃、微信公眾號、網(wǎng)站設(shè)計、手機網(wǎng)站建設(shè)、外貿(mào)建站、電子商務(wù)

聲明：本網(wǎng)站發(fā)布的內(nèi)容（圖片、視頻和文字）以用戶投稿、用戶轉(zhuǎn)載內(nèi)容為主，如果涉及侵權(quán)請盡快告知，我們將會在第一時間刪除。文章觀點不代表本網(wǎng)站立場，如需處理請聯(lián)系客服。電話：028-86922220；郵箱：631063699@qq.com。內(nèi)容未經(jīng)允許不得轉(zhuǎn)載，或轉(zhuǎn)載時需注明來源：創(chuàng)新互聯(lián)

猜你還喜歡下面的內(nèi)容