Vite Plus 要來了?! 尤雨溪最新演講:圍繞 Vite 的前端統一工具鏈
Vite 的發展歷程
- ? 2020 年:作為實驗性質的原型開始開發,最初僅為 Vue 的用例設計。
- ? 2021 年:Vite 2.0 轉型成通用構建工具。
- ? 2022 年:開始被新興框架廣泛采用為底層構建工具,如 Nuxt 3、SvelteKit、Astro、SolidStart 等。
- ? 2023 年:React 元框架也開始遷移到 Vite,如 Redwood、Remix。
- ? 2024 年:更多基于 Vite 的方案出現,如 TanStack Start、One、Ember。
- ? 2025 年:create-react-app 被官方廢棄后的事實繼承者。
Vite 的現狀
? 下載量:npm 周下載量 2200+ 萬次,月下載量即將突破 1 億次,增長迅速。
圖片
? 開發者調查:在 State of JS 2024 開發者問卷調查中,Vite 在增長、滿意度、感興趣程度等方面表現優異,是全類別最受歡迎的庫 / 工具。
? 生態:龐大、活躍、多元化,眾多公司已在生產環境中使用 Vite 或基于 Vite 的框架。
圖片
Vite 已經成為了 下一代 web 應用的共享基建層。
Vite 當前架構的問題
? 職責重疊的依賴:底層依賴多個職責重復的第三方工具,如 esbuild、Rollup、SWC 等,導致效率問題和打包行為的不一致。
圖片
? 生產構建速度:相比原生語言寫的 bundler 來說較慢,存在多次重復 parse / transform / codegen,且在 js / native 之間傳遞字符串。
? 性能瓶頸:Unbundled ESM 在大型項目中存在性能瓶頸,請求數量巨大時表現不佳。
圖片
? 高階功能缺失:如極致拆包、增量構建、Module Federation 等功能不足。
因此,Vite 團隊決定開發 Rolldown。其目標是:兼容 Rollup 的插件 API 和生態,利用 Rust 提升生產構建性能,添加 Rollup / esbuild 不具備的高階功能,解決 Vite unbundled ESM 的性能瓶頸。
下一代 JS 統一工具鏈:Void(0)
? 背景:Vite 面對的問題其實是整個 JS 工具生態一直存在的問題的縮影。JS 工具生態在各個層面都非常碎片化,存在選擇困難、復雜度爆炸、工具不兼容、重復配置、行為不一致等問題,需要一個統一的工具鏈。
? 時機:生態需求逐漸清晰,Vite 展現出了強大的共識達成速度,Rust for JS 的生態地基也已成熟。
? 架構:包括 Vite Dev server、HMR 應用支持、框架支持,Rolldown 打包工具,Oxc 語言工具鏈,Vitest Vite-native 測試工具等,覆蓋 Parser、Semantic Analysis、Linter、Formatter、Transformer、Resolver、Minfier 等功能,以 Composable NPM Packages & Rust Crates 的形式提供。
圖片
為什么選擇 Rust?
? 性能與安全:在極限性能和內存安全之間取得平衡。
? 生態成熟:已有相對成熟的 for JS 開發者生態,如 napi-rs、Web Assembly 支持等,方便找到貢獻者和進行開發。
圖片
目前的進展
? OXC:在 Parser、Linter、Resolver、Transformer、Minifier、Formatter 等方面取得顯著進展,性能表現優異,如最快的 parser、linter、resolver、transformer 等,內存占用和 binary 文件大小也更小。
? Rolldown:基礎打包、內置 OXC 轉譯 + 模塊解析、高階功能等已實現,1.0 Beta 版本在功能對齊、性能等方面表現出色,正與 Vite 進行整合。
未來規劃
? Vite Now (v6):繼續使用現有架構。
圖片
? Vite Next (2025 第一季度):引入 Rolldown 和 Oxc,負責模塊解析、TS / JSX 轉譯、壓縮等,提升生產構建性能和功能。
圖片
? Vite Future (2025 第二季度):進一步整合 Rolldown 和 Oxc,實現開發打包 + HMR、生產打包 + 產物優化等全面功能。
圖片
? Vite Plus:作為 “cargo for JavaScript”,提供 Dev / Build、Test / Bench、Lint / Format 等一站式工具鏈解決方案,還包括文檔、運行 TypeScript、項目腳手架、Monorepo 任務調度等功能,計劃 2025 年推出。
圖片