尤大多倫多演講:Vue 3.0 預覽

尤大昨天在 Vue Toronto 的主題演講中預覽了 Vue 3 。通過利用現代瀏覽器支持的新功能,Vue 3 將成爲我們已經瞭解和喜愛的Vue.js 的改進版本。

我們期待的 Vue 3 將會是:

  • 更快
  • 更小
  • 更容易維護
  • 更加友好
  • 更容易使用

當然,這個是每個框架、庫的最終目標。

更快

雖然 Vue 已經非常快,但尤大認爲 Vue 3 會更快。下面幾點將是如何去做的:

1. 虛擬DOM重寫

虛擬 DOM 從頭開始重寫,我們可以期待更多的編譯時提示來減少運行時開銷。重寫將包括更有效的代碼來創建虛擬節點。

2. 優化 slots 的生成

目前在 Vue 中,當父組件重新渲染時,其子組件也必須重新渲染。使用Vue 3,可以單獨重新渲染父級和子級。

3. 靜態樹提升(Static Tree Hoisting)

使用靜態樹提升,這意味着 Vue 3 的編譯器將能夠檢測到什麼是靜態的,然後將其提升,從而降低了渲染成本。它將能夠跳過 patching 整棵樹。

4. 靜態屬性提升 此外,我們可以期待靜態屬性提升,其中 Vue 3 將跳過不會改變的 patching 節點。

5. 基於 Proxy 的 Observation

目前,Vue 的響應式系統是使用帶有 Object.defineProperty 的getter 和 setter。但是,Vue 3 將使用 ES2015 Proxy 作爲其觀察機制。這消除了以前存在的警告,使速度加倍,並使用了一半的內存。

爲了繼續支持 IE11,Vue 3 將發佈一個支持舊觀察機制和新代理版本的構建。

更小

Vue 已經非常小了,在運行時壓縮了大約 20kb。但我們可以預期它會變得更加緊湊,對於新的核心運行時而言,爲 10kb gzi 壓縮。這將在很大程度上通過消除您不使用的庫(也稱爲Tree Shaking)來實現。例如,如果您沒有使用過渡元素,則不會包含它。

使其更具可維護性

雖然大多數 Vue 開發人員都沒有在庫本身上工作,但很高興知道 Vue 3 將帶來更可維護的源代碼。它不僅會使用 TypeScript,而且許多包將被解耦,使所有內容更加模塊化。

更容易與原生結合

運行時核心也將與平臺無關,使得Vue可以更容易地與任何平臺(例如Web,iOS或Android)一起使用。

運行時核心也將與平臺無關,使得Vue可以更容易地與任何平臺(例如Web,iOS或Android)一起使用。

想想 React

讓您的生活更輕鬆

Observer 模塊已被解壓縮到自己的包中,允許您以新的方式使用它:

跟蹤重新渲染的位置也會更容易。在他的演講中,尤大做了一些實時編碼,並展示瞭如何跟蹤 Vue 應用程序(使用下面的代碼)來找出觸發組件重新渲染的內容。這在更大的應用程序和性能微調中非常有用。

Vue 3.0 還具有改進的 TypeScript 支持,允許在編輯器中進行新級別的類型檢查和有用的錯誤和警告。

1. Hooks API

當我們需要在 Vue 中共享兩個組件之間的行爲時,我們通常使用Mixins。然而尤大正在嘗試使用 Hooks API 來避免來自 Mixins 的一些問題,並且更適合使用慣用的 Vue 代碼。

尤大還是快,React 剛出覺得還不錯,咱 Vue 也寫一個。

2. 時間切片支持

當您有許多組件同時嘗試重新渲染時,任何瀏覽器都可以開始爬行,從而使用戶體驗變得困難。

尤大展示了他正在嘗試使用 Time Slicing,如果要處理用戶交互,將 JS 執行分解爲可以提供給瀏覽器的段。

總結

最後說下看法,尤大的願景很好,基本是就是每個框架、庫的願景,差不多就是奧運精神:更高、更快、更強。

Vue 3.0 的改進,說實話,個人感覺沒有太大的創新,很多還是更 React 學的,所以呢,要問我哪個框架更有前景,我還是覺得 React 更有前景,思想超前,每一個重大更新都是激動人心。

但是我沒說 Vue 不好,github 上這麼多星星也體現了他的價值,就想某寶和 PDD,PDD 上有的某寶也有,爲啥很多人還要去 PDD 買呢,因爲便宜,所以給消費水平低的這羣人帶來了很大便利。

解釋:我沒有說把 PDD 假貨的事情拿來做比喻,僅僅是他們的盈利模式,受衆人羣。

希望各位 Vue 粉加油,學不動也要學,前端就是這樣。

發表評論
所有評論
還沒有人評論,想成為第一個評論的人麼? 請在上方評論欄輸入並且點擊發布.
相關文章