這裡介紹一下 voe 的新思路

js 是單線程的，大量的計算會阻斷 UI，為了解決這個痛點，react 發明了時間切片，而我在 fre 中更是將異步渲染作為默認渲染模式，但是時間切片本質上是利用了宏任務隊列，搞了個假的多線程

但是瀏覽器是自帶另一個線程的，即 web worker，它特別適合做一些計算工作，而在前端框架中，diff 的遍歷恰好是純 js 計算

我們的主要思路是，在 web worker 中進行 vdom diff，然後將 diff 結果（一個非常小的對象）發送給主線程，主線程拿到它，先操作 dom，然後將事件（一個簡化後的事件對象）交還給 worker

很難說它是否可以提升性能，事實上，我從來不在意性能

但是它卻有另一個場景：小程序

小程序的核心需求是，屏蔽 web 能力，就是絕對嚴格的讓你只能通過數據驅動 UI

微信小程序等應該是在 native 端造了一個沙箱，用來隔絕瀏覽器 dom 環境

但是其實 web worker 更適合做這件事，它恰好是沒有 dom 的，更純粹

我們用主奴關係形容這種絕對掌控與絕對服從， web worker 為 master，UI 主線程為 slave

所以現在來說，我們核心工作變成了：

1. master 層，寫一個純計算的，結果足夠小的，vdom diff 算法
2. slave 層，寫一個足夠簡單的事件系統

voe （發音 /vəʊ/） 的雙線程是小程序的底層架構，它通過 web-worker 隔離 web 環境，屏蔽 dom 能力，從而做到絕對的控制力

順便實現了 vue3 的響應式，依賴收集，狀態更新等，但本質不同

p.s

由於用戶代碼都在 worker 中運行，所以 document、window、cookie、fetch，localstorage 等都不能用

但是可以使用 xhr 和 indexDB，雙線程的目的就在於此，

倉庫鏈接

https://github.com/132yse/voe

閱讀更多 前端在路上 的文章

關鍵字: 瀏覽器 新思路 算法