消息隊列和事件循環（Event Loop）

 

產生緣由

爲何會有消息隊列和事件循環呢？首先最關鍵的一點在於JS是個單線程，而且主線程很是繁忙，既要處理 DOM，又要計算樣式，還要處理佈局，同時還須要處理 JavaScript 任務以及各類輸入事件。要讓這麼多不一樣類型的任務在主線程中有條不紊地執行，這就須要一個系統來統籌調度這些任務，這個統籌調度系統就是消息隊列和事件循環系統。

消息隊列

做用

消息隊列是一種數據結構，能夠存放要執行的任務。它符合隊列「先進先出」的特色，也就是說要添加任務的話，添加到隊列的尾部；要取出任務的話，從隊列頭部去取。

事件循環

做用

在線程運行過程當中，接收並執行新的任務，就須要採用事件循環機制。

消息隊列和事件循環的配合♻️

                

執行步驟

• 如有其餘進程通訊則會經過IPC與IO線程進行消息傳遞，
• IO線程接收到其餘進程傳進來的消息後，則會將其添加到消息隊列尾部；
• 渲染主線程循環地從消息隊列頭部中讀取任務，執行任務；

存在的問題

如何處理高優先級任務？

添加了微任務隊列來解決，一般咱們把消息隊列中的任務稱爲宏任務，每一個宏任務中都包含了一個微任務隊列，在執行宏任務的過程當中，若是DOM有變化，那麼就會將該變化添加到微任務列表中，這樣就不會影響到宏任務的繼續執行，所以也就解決了執行效率的問題。等宏任務中的主要功能都直接完成以後，這時候，渲染引擎並不着急去執行下一個宏任務，而是執行當前宏任務中的微任務，由於 DOM 變化的事件都保存在這些微任務隊列中，這樣也就解決了實時性問題。

如何解決單個任務執行時長太久的問題？

JavaScript 能夠經過回調功能來規避這種問題，也就是讓要執行的 JavaScript 任務滯後執行。

 

參考

瀏覽器工做原理與實踐