瀏覽器的功能與組成

瀏覽器的功能與組成____將用戶輸入的 url 轉化爲可視化的圖像

網絡、資源管理、網頁瀏覽、

多頁面管理、插件與管理、帳戶和同步、安全啊機制、開發者工具... ...

• 網絡

經過網絡模塊下載各式各樣的資源

安全問題很是重要

• 資源管理

從網絡下載，後者本地獲取去到的資源    須要有高效的機制來管理

避免重複下載，緩存等等

• 網頁瀏覽

如何將資源渲染爲可視化的頁面

• 瀏覽器的內核（渲染引擎）

負責將頁面轉變爲可視化的圖像結果

1. url 到 dom 樹

2. dom 樹 到 可視化圖像

IE ----> Trident

Safari ----> WebKit

WebKit 自己主要是由兩個引擎構成的，
一個是渲染引擎 "WebCore"，
另外一個則是 javascript 解釋引擎 "JSCore"，
它們均是從 KDE 的渲染引擎 KHTML 及 javascript 解釋引擎 KJS 衍生而來。

Chrome ----> Blink

Opera ----> Blink

FireFox ----> Gecko

• 進程

程序的一次執行，獨佔一片內存空間，是操做系統執行的基本單元

一個進程至少有一個運行的線程____主線程        在進程啓動後自動建立

一個進程也能夠同時運行多個線程

一個進程內的數據能夠共享其中的多個線程 直接共享，

多個進程之間的數據不能夠直接共享

• 線程

是進程內的一個獨立執行單

是 CPU 調度的最小單元

js 引擎 是單線程運行的 (好比 alert() )

程序運行的基本單元

保存多個線程的容器____線程池        實現線程對象的反覆利用

• 現代瀏覽器的多進程多線程模型

在以前，單進程的瀏覽器：

一個頁面的崩潰，會致使整個瀏覽器的崩潰

避免單個頁面或者插件的崩潰影響整個瀏覽器

提升了安全性

• 瀏覽器有些什麼進程？
• Browser 進程

瀏覽器的主進程，有且只有一個

負責瀏覽器界面的顯示和各個頁面的管理

是其餘類型進程的祖先，負責其餘進程的建立和銷燬

• Renderer 進程

網頁渲染進程，負責頁面的渲染

不必定等於打開的網頁量

即便有 4 個標籤頁，可是也不必定就有 4 個 Render 進程，可能更多

Renderer 也是有極限的

• GPU 進程

vue 插件進程

React 插件進程

移動設備的瀏覽器可能不太同樣：

Android 不支持插件，意味着沒有 插件進程

Renderer 演化成了操做系統的一個服務進程，但仍然是獨立的

GPU 演化成了 Browser 進程的一個線程

• 每一個進程內部又有不少線程

主要目的： 保護用戶界面的高度響應

例如：

• 不讓 Browser 進程 的 UI 線程 被其餘耗時操做（數據庫讀寫，本地文件讀寫）所阻塞

咱們會將這些耗時操做放到分線程中去處理，並適當多建立幾個 UI 線程

• 在 Renderer 進程中，爲了避免讓其餘操做阻止渲染線程的高速執行，一般將 Renderer 渲染過程這樣的線程 管線化

利用計算機的多核優點, 讓渲染的不一樣階段在不一樣的線程中執行