天天看點

剖析浏覽器的程序與線程

程序

程序是CPU資源配置設定的最小機關。

剖析浏覽器的程式與線程

上圖可知, 程序(ID 18164)得到CPU記憶體資源大小為205.8MB。

多程序

同一時刻、同一作業系統、運作2個或2個以上的程序。例如:邊聽歌(KuGou App)邊敲代碼(Idea App),KuGou與Idea同時運作且互不幹擾。

浏覽器的多程序

浏覽器程序包括以下幾種:

  • Browser程序:浏覽器的主程序,負責協調、主要。
  • 第三方插件程序:使用插件時建立該插件對應的程序。
  • GUI程序:最多隻有一個GPU程序,負責3D繪制。
  • 浏覽器渲染程序(核心):預設一個Tab頁面一個程序,有時多個空白Tab會合并成一個程序。Tab頁面互不影響、控制頁面渲染、腳本執行、事件處理等。(Tab頁面包含css、js、onclick事件等)
剖析浏覽器的程式與線程

上圖中,360安全浏覽器運作29個程序,打開至少29個頁面(多個空白頁面會合并為一個程序)。

多程序浏覽器的特點

  • 多程序充分利用CPU多核計算力的優勢
  • 避免第三方插件影響整個浏覽器
  • 注:某個Tab使用了第三方插件,此時插件失敗僅影響這個引用插件的Tab,其他Tab不會受到影響。
  • 避免頁面渲染影響整個浏覽器
  • 注:某個Tab渲染失敗,不影響其他Tab頁面。

一言以蔽之:使用者打開多個視窗,其中一個視窗挂了,其他視窗不會受影響(正常運作)。

程序與線程

  • 程序是工廠,各工廠之間互相獨立。(程序之間互相獨立)
  • 線程是生産線,一個工廠内有多條生産線。(一個程序可以有多個線程)
  • 一個産品是都由一條或多條生産線完成。(一個或多個線程合作完成一個任務)
  • 生産線之間共享工廠資源。(多個線程之間共享代碼段、資料集、堆等以及程序資源,諸如打開檔案和信号)

浏覽器核心的多線程

浏覽器核心常駐線程包括以下5種:

剖析浏覽器的程式與線程

GUI渲染線程

負責渲染浏覽器界面HTML元素,界面需要重繪(repaint)或者回流(reflow)時會執行GUI渲染程序。

- 回流:通常由某種操作引起。

JavaScript引擎線程

即JS核心,例如:Chrome的V8引擎,負責處理JavaScript腳本程式。

劃重點:GUI渲染線程與JavaScript引擎線程是互斥的,即同一時刻隻能由其中一個執行。

假設:GUI渲染線程時JavaScript 操縱DOM元素并删除某個div,那麼被删除的div也會被渲染,與實際不符。JavaScript引擎在執行時,GUI線程通常會被挂起。GUI線程儲存在等待任務隊列中,JavaScript線程結束時立即執行GUI線程。

定時觸發器線程

JS引擎如果處于阻塞狀态會影響浏覽器定時計數器的計時準确性,使用單線程計時并觸發定時更為合理。

事件觸發線程

一個事件被觸發時(onclick事件),該線程會将事件添加至任務隊列中等待JS引擎處理。

...
setTimeout(function() {
    console.log("hello world.");
}, 2000);
...      

JS運作至setTimeout函數時,會将function函數添加至任務隊列中,等待主線程任務全部執行完畢之後才依次運作任務隊列中的任務,直到運作至該函數時列印“hello,world.”。

繼續閱讀