在 10 月 3 日舉行的 ViteConf 大會上，Vue、Vite 的作者尤雨溪發表了題為《Vite與JavaScript工具的未來》的演講。本文將對此次演講進行簡要總結，帶您一窺 Vite 及 JavaScript 工具的未來趨勢！

Vite 和 Vitest 當前狀態

npm 下載量

• Vite：周下載量超過 1500 萬次，相比去年同期已經翻倍了。
• Vitest：周下載量超過 600 萬次，正在迅速取代 Jest 成為首選的JavaScript 測試運行器。

State of JS 調查結果

Vite 和 Vitest 在幾乎所有適用類別中都名列前茅：

相關閱讀：State of JS 調查結果簡析

生態系統

Vite 擁有一個廣泛而強大的生態系統，現已成為構建單頁應用時眾多框架的首選默認工具，它幾乎支持所有主流的 JavaScript 元框架，除了 Next.js 。

Vite 并不完美

Vite 的問題

Vite 極大地簡化了網頁開發過程，通過屏蔽底層復雜性，為用戶提供了一個直觀易用的開發環境。這一體驗主要歸功于其強大的底層技術支持，但這些工具也都不完美：

• esbuild：快速進行依賴預打包、轉換和壓縮，但tree shaking和代碼分割功能不如Rollup 完整和靈活，插件系統也相對僵化。
• Rollup：適合生產構建，兼容豐富插件，打包應用效果更好。但由于是 JavaScript編寫，速度上不及原生語言編寫的 esbuild。
• SWC：默認不需要，在構建React應用時，能提供更高的性能和轉換效率，但體積龐大，是Vite及其所有依賴的兩倍多。

這種架構就帶來了一些問題：

• 行為差異：esbuild和Rollup處理混合esm/cjs模塊圖時可能行為不一致，導致難以預見的錯誤。
• 低效重復：工具反復解析、轉換源代碼為AST，并序列化回字符串，啟用 source map 時效率更低。
• 性能瓶頸：對于大規模項目，原生ESM開發服務器可能遭遇性能問題，影響開發體驗。

為了上述問題，尤大決定開發自己的打包器（Rolldown），以統一并優化 Vite 的打包流程。

工具鏈的問題

Vite面臨的挑戰反映了JavaScript生態系統的發展歷程。JavaScript從腳本語言成長為全球熱門語言，社區為此創造了眾多工具，應對用例增長和復雜性。這既是機會也是難題，帶來了工具豐富性，但也存在碎片化、不兼容和低效等問題。

要解決這些問題，就需要為 JavaScript 建立一個統一的工具鏈。未來的工具鏈應該是這樣的：

• 統一：整合工具鏈，使用統一工具、AST、配置等，減少碎片化。
• 高性能：優先使用 Go、Rust 等語言開發的工具，提升效率。
• 模塊化：工具鏈的組件可單獨使用，支持跨語言互操作性。
• 運行時無關：獨立于JavaScript運行時，提高靈活性和兼容性。

創立 VoidZero

為了解決這些問題，尤大因此決定創立 VoidZero，一家致力于打造下一代 JavaScript 工具的公司。目前，公司已經籌集了由 Accel 領投的 460 萬美元資金，并組建了一個全職團隊來努力實現這一愿景。

團隊目前正在做的事：

• Oxc：將成為基礎的語言工具鏈，包括解析器、語義分析、轉換器、壓縮器、解析器、檢查器和格式化工具；
• Rolldown：基于 Oxc 構建的打包器，將成為Vite未來版本的統一打包解決方案。

Oxc 當前進展

• 進展：

• 已完成：解析器、代碼檢查器、路徑解析器。
• 轉換器部分完成：支持TypeScript、JSX、React Refresh轉換及isolatedDeclarations DTS 輸出。
• 當前重點：完善具備語法降級功能的Transformer。
• 后續計劃：壓縮器與格式化工具處于原型階段，待Transformer完成后推進。

• 優勢：

• 速度領先：在解析、檢查、轉換等關鍵領域，Oxc 均擁有最快性能。

• 內存與體積優化：相較于SWC，Oxc使用內存更少，且二進制文件體積更小。

• Rust crate編譯效率：作為Rust crate使用時，Oxc在編譯速度上優于依賴大量宏的項目。

Rolldown 當前進展

• 進展：

• 已實現功能：支持CJS/ESM互操作性、Oxc 驅動的內置轉換、tree sharking 優化、高級分塊，以及90%的Rollup插件接口兼容性。
• 當前重點：提升對CSS/HTML和資產的支持，以及測試集成到Vite中，替換esbuild和Rollup，并移植部分Vite內部插件到Rust以減少開銷。
• 進展狀態：Rolldown驅動的Vite已通過大部分開發與構建測試，即將進行更多調整與打磨，隨后發布1.0 beta版本。

• 優勢：

• 性能：在特定基準測試中，Rolldown速度幾乎是esbuild的兩倍，遠超其他Rust打包器。

• 內存管理優化：相較于基于Rollup的Vite，Rolldown在處理大規模應用時不會耗盡內存。

未來

即將推出的 Vite 6.0 的架構如下，其仍然依賴于 esbuild、Rollup、SWC。

Vite 的下一次迭代的架構如下，其將由 Rolldown 和 Oxc 驅動，提高開發/生產一致性，減少內部開銷，并提高生產構建性能。

在更遠的將來，將發布一個更依賴 Rolldown 的 Vite 版本，利用其強大的打包能力統一開發、模塊運行和生產環境。這將消除網絡瓶頸，確保環境間的高度一致性，并在各種場景下實現最佳性能。

目前，全捆綁模式仍處于早期原型階段，但其性能表現非常值得期待。與多個未捆綁模塊的基準測試相比，全捆綁模式下的頁面加載速度提高了5倍以上，熱模塊替換（HMR）也幾乎達到了即時響應。

當前首要任務是確保現有的 Vite 生態系統能夠順利地從 Rolldown 和 Oxc 中獲益，而這一過程需要時間，未來可期！