Vue3.0來了,一分鐘快速瞭解3.0新特性

10月5日,尤大大帶着pre-alpha版本的Vue3.0走來了。在這裏插入圖片描述

粗略看了一下源碼,發現源碼基本都轉化成了 typeScript 。

我們對照着 “ Vue 3.0 Updates ” 的主題演講來分析一下:

1、速度方面:

通過更新 runtime-core 與 runtime-dom ,支持了包括 Fragments、Portals與Suspense w/ async setup() 等(似乎有點越來越像 react),支持 Composition API 、Options API 和 typings,配合 Proxy 的引入,極大程度上提高了響應式的能力。

Composition API 與 Proxy 的運用使得組件化更加靈活,邏輯業務組件的編寫與UI組件的多樣化能夠更好的實現。

2、體積方面:

runtime-core 體積壓縮成了 約10kb

3、維護性:

代碼遷移成 TypeScript (還沒學的抓緊啦)

編譯器(Compiler)優化,以下借用尤大大的特性更新圖翻譯一下:

使用模塊化架構

優化 "Block tree"

更激進的 static tree hoisting 功能

支持 Source map

內置標識符前綴(又名 "stripWith")

內置整齊打印功能

移除 source map 和標識符前綴功能後,使用 Brotli 壓縮的瀏覽器版本精簡了大約 10KB

可見,編譯器更多從數據結構入手,優化架構層級,降低使用成本。

4、更接近原生開發

5、讓你更輕鬆開發

 其次是 GitHub 上的源碼目錄:

  • reactivity 目錄:數據響應式系統,主要使用 Proxy。
  • runtime-core 目錄:支持 v-dom 與 Vue 原生的各種 API 在瀏覽器上的調用,調用 Vue 特性的相關代碼。
  • runtime-dom 目錄: 調用各類瀏覽器原生 DOM 事件的相關代碼。
  • runtime-test 目錄: 測試用的runtime的相關代碼。
  • server-renderer 目錄: SSR 相關代碼。
  • compiler-core 目錄: 支持 Vue 原生編寫的 編譯器特性,以及開發者編寫的編譯器特性的相關代碼。
  • compiler-dom 目錄: 調用瀏覽器的編譯器的相關代碼。
  • shared 目錄: 無內置API。
  • vue 目錄: 實現 vue 構建與編譯的相關代碼。

 

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