Vue 十年啦！！！

尤雨溪大佬開講，Vue 十年啦！！！從一開始的一個視圖層工具，一步一步走到現在，成為一個擁有全流程生態的頂級前端框架。

圖片

圖片

回顧 Vue3.4 的特性

接著回顧了Vue3.4的亮點：

• 重構了模板解析器， 主要是不再依賴于正則表達式，而是使用了 HTML Parser 中的狀態機來進行解析，使得模板解析的速度至少提升了兩倍。
• 重構了響應式的邏輯， 使得計算屬性更加高效快速，提升了 watchEffect 的效率，如果計算結果不變，那么 watchEffect 不會被重新觸發。
• defeinModel `穩定版推出， 開發者可以直接使用，因為它已經正式成為 Vue3.4 的 API 了。
• v-bind 同名簡寫， 比如<img :id="id" :src="src" :alt="alt"> 可以簡寫為 <img :id :src :alt>。

圖片

未來 Vue3.5 的新特性

接下來揭示了未來 Vue3.5 將會包含的新特性，Vue3.5 主要會做一些框架底層的優化：

• 響應式邏輯上的提升， 調度任務中使用位運算去優化任務隊列，這一項優化原本是在無虛擬DOM版本 Vapor 中的，現在直接移植到 Vue3.5 中，通過這項優化，內存使用率提升 56%。
• 響應式邏輯上的提升， 優化了大數組的響應式性能，可獲得十倍性能收益。
• @vue/reactivity 提供 readArray 方法供開發者使用， 這是一個高性能的處理數組響應式的方法。
• 優化了 SSR 服務端渲染的一些特性。

圖片

Vue Vapor（無虛擬 DOM 的 Vue）

接下來是 Vue Vapor，Vapor Mode 是 Vue 3 的一項革新特性，其設計靈感來自于 Solid.js。此特性通過優化代碼編譯成更高效的 JavaScript 來提高應用程序的性能。

利用 Vapor Mode，開發者可以完全避免使用 Virtual DOM，這有助于減小應用的打包大小。

優點包括：

• 性能提升
• 更低的內存需求
• 更精簡的運行時代碼

由于 Solid.js 和 Vue 在響應式系統方面的設計相似，均采用基于讀取操作的自動追蹤代理（Proxies），Vue 能夠采用與 Solid.js 相似的編譯策略。

關于它的具體解析請看我這篇文章：

圖片

圖片

Rolldown

Vite 在新版本中可能會使用 Rolldown 來進行打包，它是一個由 Rust 開發的打包工具，你可以把它當做是一個 Rust 版本的 Rollup，目前已經兼容 Vite/Rollup 一半的插件，速度比 esbuild 更快！速度是 esbuild 的 1.2-1.5 倍！！

圖片

圖片

Rollup 底層依賴了一個叫 OXC 的工具，OXC 是一個由 Rust 編寫的高性能 JS 解析器

圖片