-performance:效能比vue2.x快1.2~2倍
-tree shaking support:按需編譯,體積比vue20x更小
-compostion api:組合api
-better typescript support:更好的ts支援
-custom renderer api:暴露了自定義渲染的api
-fragment,teleport,suspense:更先進的元件
看圖我們可以知道+vue2.0中的虛擬dom是進行全量的對比
+vue3新增了靜態標記
在與上次虛擬節點進行對比時候,只對比帶有patch flag的節點
並且可以通過flag的資訊得知當前節點要對比的具體內容
靜態提公升之前+vue2中無論元素是否參與更新,每次都會重新建立
+vue3中對於不參與更新的元素,只會被建立一次,之後再每次渲染的時候被不停的重用
靜態提公升之後
+預設情況下onclick會被視為動態繫結,所以每次都會去追蹤它的變化
但是因為是同乙個函式,所以沒有追蹤變化,直接快取起來復用即可
+當有大量靜態的內容時候,這些內容會被當做純字串推進有個buffer裡面;
即使存在動態的繫結,會通過模板插值嵌入進去,這樣會比通過虛擬dom渲染來的快上很多很多
+當靜態內容大到一定量級時候,會用_createstaticvnode方法在客戶啊短去生成乙個static node,
這些靜態node,會被直接innerhtml,就不需要建立物件,然後根據物件渲染
-vite是vue作者開發的一款意圖取代webpack的工具
-其實實現原理是利用es6的import會傳送請求去載入檔案的特性
攔截這些請求,做一些預編譯,省去webpack冗長的打包時間
2.vue3.0相容vue2.x
3.vue3.0-custom renderer api
Vue3 0學習記錄
composition api 組合api 效能提公升 viteoptions api composition api 響應式系統公升級 vue.js 3.0中使用proxy物件重寫響應式系統 proxy物件效能本身就比 defineproperty好 物件可以攔截物件的賦值 刪除等,不需要初始化遍...
vue3 0前端學習
1 響應系統公升級 vue.js 3.0 中使用proxy物件重寫響應式系統 可以監聽動態新增的屬性 可以監聽刪除的屬性 可以監聽陣列的索引和length屬性 2 編譯優化 vue.js 2.x 中,模板首先被編譯為render函式,構建過程中完成,會編譯靜態根節點和靜態子節點,當元件狀態發生變化時...
vue3 0 學習筆記
今天是2021年2月26日 學習一下vue3.0雖然已經出來這麼長時間了,但是還沒有認真的學習過,只是懂一點皮毛 接下來開始我的3.0之旅 來吧!展示!藍色海 嘿嘿嘿 第一步 安裝 先瞅瞅你的vue v 是多少 npm install g vue cli第二步 初始化 專案 這裡我們選擇 manua...