国产xxxx99真实实拍_久久不雅视频_高清韩国a级特黄毛片_嗯老师别我我受不了了小说

資訊專欄INFORMATION COLUMN

瀏覽器內(nèi)核、JS 引擎、頁面呈現(xiàn)原理及其優(yōu)化

zlyBear / 3231人閱讀

摘要:瀏覽器內(nèi)核又叫渲染引擎,主要負(fù)責(zé)的解析,頁面布局渲染與復(fù)合層合成。頁面呈現(xiàn)原理規(guī)范定義了的詞法及語法文法。解析器使用和解析生成器從語法文件中自動生成解析器。回憶一下解析器的介紹,創(chuàng)建一個自底向上的解析器,使用自頂向下解析器。

瀏覽器內(nèi)核又叫渲染引擎,主要負(fù)責(zé) HTML、CSS 的解析,頁面布局、渲染與復(fù)合層合成。瀏覽器內(nèi)核的不同帶來的主要問題是對 CSS 的支持度與屬性表現(xiàn)差異。

webkit

Wekbit是一個開源的Web瀏覽器引擎,也就是瀏覽器的內(nèi)核。Apple的Safari, Google的Chrome, Nokia S60平臺的默認(rèn)瀏覽器,Apple手機的默認(rèn)瀏覽器,Android手機的默認(rèn)瀏覽器均采用的Webkit作為器瀏覽器內(nèi)核

Blink

Blink是在Wekbit的基礎(chǔ)上的改進(jìn),是現(xiàn)在對新特性支持度最好的內(nèi)核

Gecko

Firefox

Trident

微軟的IE,IE4+ 的內(nèi)核,一直持續(xù)到 IE11,EdgeHTML 是微軟拋棄 IE 后開發(fā)的全新內(nèi)核

webkit組成

webkit 包含了許多不同平臺對webkit封裝的實現(xiàn),即抽象出了與瀏覽器所能直接對應(yīng)的一些概念的實現(xiàn)。如,WebView, WebPage, WebFrame等

WebCore 實現(xiàn)了對文檔的模型化,包括了CSS,DOM,Render等的實現(xiàn)

JavaScript Core 對JavaScript支持的實現(xiàn)

瀏覽器內(nèi)核與 JS 引擎一覽

JavaScript 引擎

JavaScript 負(fù)責(zé) JavaScript 代碼的解釋與執(zhí)行,主流的 JavaScript 引擎有:V8、SpiderMonkey、JavaScriptCore、Chakra。

頁面呈現(xiàn)原理

一個頁面的呈現(xiàn),粗略的說會經(jīng)過以下這些步驟:

1. DOM 樹的構(gòu)建(Parse HTML)
2. 構(gòu)建 CSSOM 樹(Recaculate Style) 為什么是 Re-caculate Style 呢?這是因為瀏覽器本身有 User Agent StyleSheet,所以最終的樣式是我們的樣式代碼樣式與用戶代理默認(rèn)樣式覆蓋/重新計算得到的。
3. 合并 DOM 樹與 CSSOM 樹為 Render 樹
4. 布局(Layout)
5. 繪制(Paint)
6. 復(fù)合圖層化(Composite)圖層化是自己理解后形象的意譯其中布局(Layout)環(huán)節(jié)主要負(fù)責(zé)各元素尺寸、位置的計算,繪制(Paint)環(huán)節(jié)則是繪制頁面像素信息,合成(Composite)環(huán)節(jié)是多個復(fù)合層的合成,最終合成的頁面被用戶看到。

當(dāng)遇到 JavaScript 腳本或者外部 JavaScript 代碼時,瀏覽器便停止 DOM 的構(gòu)建(阻塞 1)

那是否停下 DOM 的構(gòu)建的同時,立馬就執(zhí)行 JavaScript 代碼或者下載外部腳本執(zhí)行,其實還是要視情況而定,見2

當(dāng)遇到

閱讀需要支付1元查看
<