Vite 8 發布：Rust 統一建置，10-30x 效能提升

Vite 8.0 在 2026 年 3 月正式發布，這次的最大變化不是一個新功能，而是一個根本性的架構轉變：Vite 8 統一使用 Rust 開發的 Rolldown 作為 bundler。這不是一個微小的版本號跳躍——這代表 Vite 生態系正式進入了「Rust 化」的時代。如果你是 Vite 的使用者，這次的升級值得你認真對待。

---

Vite 8 之前：雙bundler 的時代

理解 Vite 8 的變化，需要先理解之前 Vite 的架構。

Vite 6 和 7 採用的是「雙bundler」策略：

# 開發環境：使用原生 ESM（esbuild）
# 生產環境：使用 Rollup

# vite.config.ts
import { defineConfig } from 'vite';
import react from '@vitejs/plugin-react';

export default defineConfig({
  plugins: [react()],
  build: {
    // 生產環境用 Rollup
    rollupOptions: { ... }
  }
});

這個策略的好處是開發體驗極快（esbuild 的 transform 速度），缺點是開發環境和生產環境的行為可能不一致。

Vite 8 的回答是：用一個統一的 Rust bundler 處理所有場景。

---

Rolldown：Vite 8 的統一 Bundler

為什麼是 Rust

Rolldown 是由 Vite 團隊開發的 Rust-based bundler，目標是「Rollup 的效能，esbuild 的速度」：

Bundler	語言	建置速度	生態相容性
esbuild	Go	最快	中
Rollup	JavaScript	慢	高
Rolldown	Rust	10-30x 比 Rollup 快	高（相容 Rollup 插件）

Rolldown 的設計目標是與 Rollup 的插件 API 相容，這意味著：

// Rolldown 可以直接使用 Rollup 插件
// 生態系遷移成本極低
import { defineConfig } from 'vite';
import vue from 'unplugin-vue/rolldown';  // 直接用 Rolldown 插件格式

export default defineConfig({
  plugins: [vue()],
  // 不再需要分開配置 dev 和 prod bundler
});

10-30x 的建置速度

Rolldown 的效能提升在實際項目中非常明顯：

# 1000 個模組的建置時間
Rollup: 45秒
Rolldown: 3秒

# 10000 個模組的建置時間
Rollup: 8分鐘
Rolldown: 25秒

這個差距在 CI/CD 環境下特別有意義——每次部署前的建置時間直接影響部署頻率和開發者體驗。

---

Oxc：JavaScript 工具鏈的 Rust 化

什麼是 Oxc

Oxc 是 Rust 開發的 JavaScript 工具鏈，包含：

• Parser：JavaScript/TypeScript 解析器
• Transformer：代碼轉換（用於 React Refresh 等場景）
• Linter：靜態分析
• Minifier：程式碼壓縮

Oxc 的效能數據：

# 轉換速度對比
Babel: 100%（基準）
Oxc: 比 Babel 快 30x+

Babel-Free 的意義

Vite 8 的「Babel-Free」不代表不支援 JSX 轉換，而是用 Oxc 取代了 Babel 作為 React Refresh 的底層工具：

// vite.config.ts
import { defineConfig } from 'vite';
import react from '@vitejs/plugin-react';

// Vite 8：使用 Oxc 進行 JSX 轉換，不再需要 Babel
export default defineConfig({
  plugins: [react()],
});

對於 React 開發者來說，這個變化是透明的——你的 JSX 語法、你的 React 插件配置，不需要任何改變。

但如果你看 package.json，你會發現一個顯著的變化：

// Vite 7 需要：
{
  "devDependencies": {
    "@vitejs/plugin-react": "^4.x",
    "babel-preset-react-app": "^10.x"  // 可能需要
  }
}

// Vite 8：
{
  "devDependencies": {
    "@vitejs/plugin-react": "^5.x"  // Oxc 內建，不再需要額外的 Babel preset
  }
}

---

React Compiler Ready

Vite 8 為 React Compiler（React 19 的實驗性功能）做好了準備：

// vite.config.ts
import { defineConfig } from 'vite';
import react from '@vitejs/plugin-react';

export default defineConfig({
  plugins: [
    react({
      // Vite 8 原生支援 React Compiler
      compiler: {
        // React Compiler 選項
      }
    })
  ],
});

React Compiler 的目標是：在編譯時自動優化 React 組件，減少 runtime 的 re-render。

Vite 8 的 Oxc 整合讓 React Compiler 的 transform 足夠快，使得在開發環境中使用 React Compiler 成為可能。

---

生態系更新

Devtools 強化

Vite 8 的 Devtools 整合更加完整：

// vite.config.ts
export default defineConfig({
  devTools: {
    // 新的 Vite 8 Devtools 選項
    enabled: true,
    // 更詳細的模組依賴圖
    dependencyGraph: true,
  }
});

Wasm SSR 支援

Vite 8 強化了 WebAssembly（Wasm）模組的 SSR（Server-Side Rendering）支援：

// Vite 8 支援 Wasm in SSR
import init, { processData } from './wasm/processor.wasm';

await init();
const result = processData(input);

Plugin Registry

Vite 8 推出了官方 Plugin Registry：

# 搜尋 Vite 插件
npm search @vite/plugin

# 官方認證的插件有更好的相容性保證

---

升級注意事項

從 Vite 6/7 升級

# 升級 Vite 到 8.0
npm install vite@8 --save-dev
npm install @vitejs/plugin-react@8 --save-dev

# 清除緩存
rm -rf node_modules/.vite

# 驗證
npx vite --version
# 應該顯示 8.x.x

需要檢查的相容性

// 1. 檢查 plugins 是否支援 Rolldown
// 不是所有 Vite 插件都支援 Rolldown
// 查閱 plugin 的 README

// 2. 檢查自定義 bundler 配置
// vite.config.ts 中的 build.rollupOptions 可能需要調整

降級策略

如果遇到問題，Vite 8 支援臨時降級：

# 降級到 Vite 7
npm install vite@7 @vitejs/plugin-react@4 --save-dev

---

結語：Rust 正在改變前端工具鏈

Vite 8 的發布，是 2026 年前端工具鏈「Rust 化」的又一個里程碑。

從 esbuild 到 Rolldown，從 Babel 到 Oxc，前端工具鏈的核心環節正在被 Rust 重寫。這個趨勢的驅動因素很簡單：JavaScript 工具的效能瓶頸已經無法靠優化 JavaScript 突破。

對於前端工程師來說，這個變化的影響是：

• 建置更快：10-30x 的建置速度提升在大型專案中感受明顯
• 配置更簡單：統一的 Rolldown 意味著不再需要維護 dual-bundler 配置
• 生態逐漸遷移：主流插件正在陸續支援 Rolldown

當然，這個遷移不是無痛的。但對於新專案，Vite 8 是目前最優的選擇。對於舊專案，可以等到插件生態更成熟時再升級。

---

延伸閱讀

• Rollup 與 Rolldown — Rust bundler 詳細介紹
• Lightning CSS 100x 更快 — 另一個 Rust CSS 工具

本文是「2026 前端工具演進」系列文章之一。