Bun vs Vite (2026): Build Speed, HMR & When to Use Both

Every few months a developer post goes viral: "I replaced Vite with Bun and my builds are now instant." The thread fills with replies from developers who tried the same thing and hit a wall — no React Fast Refresh, missing plugins, incomplete HMR. The confusion persists because the comparison isn't as clean as "faster tool wins."

This is the actual bun vs vite comparison for 2026: what each tool does, where the real performance differences lie, and what changed with Vite 8.

TL;DR

Use Vite for frontend applications. With Vite 8 + Rolldown (released March 2026), Vite now closes the raw speed gap that was Bun's bundler's main selling point. Vite has React Fast Refresh, 800+ plugins, and powers every major frontend framework. Use Bun's bundler for backend/server bundles and CLI tools — it's faster for those use cases and zero-config. The best 2026 default is Bun + Vite together: Bun as the package manager and runtime (fast installs, fast script startup), Vite as the build tool. You don't have to choose.

Key Takeaways

• Vite 8 (March 2026) replaced Rollup with Rolldown (Rust-based) — achieving 10–30x faster production builds, closing the speed gap with Bun
• Bun's bundler lacks React Fast Refresh — this alone makes it unsuitable for most React development workflows
• Vite: ~40M weekly npm downloads, ~79K GitHub stars — the dominant frontend build tool
• Bun: ~3M weekly downloads — dominant as a runtime/package manager, niche as a bundler
• Bun installs are 9–30x faster than npm — even teams staying on Vite are switching to bun install
• Migration story is asymmetric: switching to Bun+Vite is easy; replacing Vite with Bun's bundler is painful

At a Glance

	Bun Bundler	Vite 8
Version	1.2+	8.0 (March 2026)
GitHub stars	~80K	~79K
Weekly downloads	~3M	~40M
License	MIT	MIT
Production bundler	Zig-based (esbuild-inspired)	Rolldown (Rust)
Dev server	Incomplete for frontends	Native ESM + esbuild
HMR	⚠️ Server-side only	✅ React Fast Refresh
React support	Basic JSX only	First-class via plugin
Vue / Svelte / Solid	❌ No plugins	✅ Official plugins
Plugin ecosystem	~Minimal	800+ Rollup-compatible
TypeScript	✅ Native, zero-config	✅ Via esbuild/Oxc
CSS Modules	✅	✅
PostCSS	Manual setup	✅ Built-in
Best for	Backend bundles, CLIs	Frontend SPAs, frameworks
Used by	Oven.sh, experiments	Nuxt, SvelteKit, Astro, Linear

---

The Clarification That Matters

Bun and Vite are not direct substitutes. Understanding what each one actually is changes the comparison completely:

JavaScript ecosystem layers:

  Runtime layer:
  ├── Node.js             ← Traditional, ~800M weekly installs
  └── Bun                 ← Modern, 3x faster startup, built-in bundler

  Build tool layer (runs in the runtime):
  ├── Vite                ← Dominant frontend build tool (uses esbuild + Rolldown)
  ├── Bun bundler         ← Built into Bun runtime
  ├── Turbopack           ← Next.js specific
  └── webpack             ← Legacy but still widespread

  Common patterns in 2026:
  ├── Node.js + Vite      ← Most common
  ├── Bun + Vite          ← Best of both worlds ← recommended
  └── Bun + Bun bundler   ← Works for backend/CLI, limited for frontend SPA

When someone says "I switched to Bun," they often mean they switched Bun as the runtime/package manager while keeping Vite as the build tool. That's not "Bun vs Vite" — it's "Bun AND Vite."

---

Vite 8: What Changed

Vite 8 shipped March 12, 2026, and it's a bigger deal than most version bumps. The headline change: Rolldown replaces Rollup as the production bundler.

Rolldown is a Rust-based bundler developed by the VoidZero team (Evan You's company). The speed improvement is dramatic:

Vite 7 (Rollup) vs Vite 8 (Rolldown) — real-world production builds:

Linear codebase:           46s → 6s    (87% reduction)
Beehiiv codebase:          Baseline → 64% faster
Mercedes-Benz.io:          Baseline → 38% faster
Typical SPA (500 modules): ~4s  → ~0.4s

This matters because raw build speed was Bun's main bundler argument. Vite 8 largely neutralizes it for production builds.

Other Vite 8 changes:

• Unified dev/prod pipeline (same Rolldown for both, eliminating the previous dual esbuild+Rollup setup)
• resolve.tsconfigPaths — TypeScript path aliases without a plugin
• emitDecoratorMetadata support
• WebAssembly SSR support
• Browser console forwarding to dev terminal
• New plugin registry at registry.vite.dev
• Requires Node.js 20.19+ or 22.12+

---

Build Speed Benchmarks

Cold Build (Production)

Framework build benchmarks (500-module React app):

Tool                          Cold build    Hot rebuild   HMR update
──────────────────────────────────────────────────────────────────────
Bun bundler                   ~0.8s         ~0.3s         ~30ms *
Vite 8 (Rolldown, prod)       ~0.4–0.6s     ~0.2s         N/A
Vite 7 (Rollup, prod)         ~4s           ~2s           N/A
Vite dev server (esbuild)     ~1.2s         ~0.5s         ~10–15ms
webpack 5                     ~15s          ~3s           ~300ms

* Bun HMR in development lacks React Fast Refresh

Bun's bundler remains faster for simple builds. Vite 8 with Rolldown now competes closely — and in many real-world benchmarks, wins. The gap that justified switching to Bun's bundler is now marginal.

Dev Server / HMR

This is where Vite wins clearly:

// Vite: React Fast Refresh works out of the box
// @vitejs/plugin-react v6 (Vite 8)
// Changes to component state are preserved on hot update

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

export default defineConfig({
  plugins: [react()],
})

# Bun's hot module replacement
bun --hot run src/server.ts  # Works for server-side code

# Bun does NOT support React Fast Refresh for frontend
# Component state is lost on hot update
# This is a known open issue in the Bun repository

For backend/server development with Bun, --hot mode is excellent. For React frontend development, losing Fast Refresh — the ability to update component code without losing component state — is a significant DX regression.

---

Plugin Ecosystem

// Vite plugins: 800+ available via registry.vite.dev (Vite 8)
import { defineConfig } from 'vite'
import react from '@vitejs/plugin-react'          // React JSX + Fast Refresh
import { svelte } from '@sveltejs/vite-plugin-svelte'  // Svelte
import vue from '@vitejs/plugin-vue'              // Vue 3 SFC
import solid from 'vite-plugin-solid'             // SolidJS
import tailwindcss from '@tailwindcss/vite'       // Tailwind CSS 4 native
import svgr from 'vite-plugin-svgr'               // SVG as React components
import { VitePWA } from 'vite-plugin-pwa'         // PWA manifest + service worker
import tsconfigPaths from 'vite-tsconfig-paths'   // TypeScript paths
import mkcert from 'vite-plugin-mkcert'           // Local HTTPS
import checker from 'vite-plugin-checker'         // TypeScript + ESLint in dev

export default defineConfig({
  plugins: [react(), tailwindcss(), tsconfigPaths()],
})

// Bun bundler plugins: minimal, no Rollup/Vite compatibility
const result = await Bun.build({
  entrypoints: ['./src/index.tsx'],
  outdir: './dist',
  minify: true,
  plugins: [
    // Bun has its own plugin API — NOT Vite/Rollup compatible
    // Most plugins are custom loaders, not ecosystem packages
    {
      name: 'raw-text-loader',
      setup(build) {
        build.onLoad({ filter: /\.txt$/ }, async (args) => {
          const text = await Bun.file(args.path).text()
          return { contents: `export default ${JSON.stringify(text)}`, loader: 'js' }
        })
      },
    },
  ],
})

The plugin gap is the practical dealbreaker for switching to Bun's bundler. Once you need SVG imports, PWA support, or any framework-specific transform beyond basic JSX, you hit a wall.

---

Framework Support

Framework	Vite	Bun bundler
React	✅ @vitejs/plugin-react v6 (Oxc compiler)	⚠️ Basic JSX only, no Fast Refresh
Vue 3	✅ Official @vitejs/plugin-vue	❌ No plugin
Svelte	✅ Official @sveltejs/vite-plugin-svelte	❌ No plugin
SolidJS	✅ Official vite-plugin-solid	❌ No plugin
Astro	✅ Astro uses Vite internally	❌ Not supported
Nuxt	✅ Nuxt uses Vite internally	❌ Not supported
SvelteKit	✅ SvelteKit uses Vite internally	❌ Not supported
Qwik	✅ Official plugin	❌ No plugin
Remix	✅ Via Vite adapter	❌ No adapter

Every major modern frontend framework uses Vite as its build foundation. Bun's bundler has no framework-specific plugins.

---

TypeScript Support

Both tools handle TypeScript well, but differently:

// Bun: native TypeScript transpilation, zero config
// Run TypeScript directly — no setup needed
// bun run src/index.ts

// tsconfig.json (Bun respects paths natively)
{
  "compilerOptions": {
    "target": "ESNext",
    "module": "ESNext",
    "paths": {
      "@/*": ["./src/*"]
    }
  }
}

// Vite 8: TypeScript paths now built-in via resolve.tsconfigPaths
// vite.config.ts
export default defineConfig({
  resolve: {
    tsconfigPaths: true,  // NEW in Vite 8 — no plugin needed
  },
})

Neither replaces tsc for type checking — that's a separate step in both workflows. Bun edges out Vite on zero-config TypeScript for simple projects; Vite 8 closed the gap with native tsconfigPaths.

---

Migration Guide

Easy: Switching Runtime to Bun (while keeping Vite)

This is the migration most teams actually want — faster installs, faster script startup, same build tool:

# 1. Install Bun
curl -fsSL https://bun.sh/install | bash

# 2. Install dependencies with Bun (drop-in for npm)
bun install          # Replaces npm install — 9x faster
bun add react        # Replaces npm install react
bun add -d vitest    # Replaces npm install -D vitest

# 3. Run scripts with Bun (same package.json)
bun run dev          # Runs vite --mode development
bun run build        # Runs vite build
bun run test         # Runs vitest

# 4. That's it. Vite still handles all builds.
# You get: faster installs, faster startup, same plugin ecosystem

# Bun install benchmark (1,847 deps):
# bun install:    47 seconds
# pnpm install:   4 minutes
# npm install:    28 minutes
# npm (cached):   15 seconds
# bun (cached):   1–3 seconds

Hard: Replacing Vite with Bun's Bundler

# What you'd remove:
# - vite.config.ts
# - All @vitejs/* plugins
# - All vite-plugin-* plugins

# What you'd need to rebuild:
# - JSX transform (basic, no Fast Refresh)
# - CSS handling (PostCSS not built-in)
# - TypeScript path resolution (manual)
# - Code splitting configuration
# - Production optimization settings
# - Any framework-specific transforms

# Official Bun migration guide: none exists.
# Real-world outcome: most teams switch back to Vite
# after hitting the plugin or HMR wall.

---

When to Use Bun's Bundler

Despite the limitations, Bun's bundler has legitimate use cases:

# Use case 1: Bundle a backend service into a single file for deployment
bun build src/server.ts --outfile server.js --target node --minify

# Use case 2: Build a CLI tool for distribution
bun build src/cli.ts --compile --outfile ./dist/my-cli
# Creates a self-contained binary — no Node.js required to run it!

# Use case 3: Simple static site with no framework
bun build src/index.tsx --outdir dist --splitting

# Use case 4: Library bundling (with no complex plugins needed)
bun build src/lib.ts --outfile dist/index.js --format esm --external react

The --compile flag is a genuine Bun advantage — it creates standalone executables without requiring Bun or Node.js to be installed. No Vite equivalent exists for this use case.

---

Bun as Package Manager: The Clear Win

Even developers who aren't switching to Bun as a runtime are using bun install:

# Drop Bun in as npm replacement — zero config change
bun install               # Reads package.json, installs to node_modules
bun add react next        # Add packages
bun add -d typescript     # Add dev dependency
bun remove lodash         # Remove package
bun update                # Update all packages
bun x create-next-app     # npx equivalent

The bun.lockb file (binary lockfile, text-based in 1.2+) installs in seconds. CI pipelines that previously took 2-3 minutes for npm install drop to under 30 seconds.

---

The 2026 Verdict

For frontend applications: Use Vite. Vite 8 with Rolldown removed the raw speed argument for switching to Bun's bundler, and Vite's mature plugin ecosystem, React Fast Refresh, and framework integration have no equivalent in the Bun bundler today.

For backend services and CLIs: Bun's bundler shines. Zero-config TypeScript, native TypeScript execution, --compile for standalone binaries, and faster build times for server-side bundles make it the right choice here.

For package management: Bun wins. Even teams committed to Vite for builds are switching to bun install for the speed gains.

The recommended 2026 stack:

# Install Bun as your runtime + package manager
curl -fsSL https://bun.sh/install | bash

# Create a new Vite project — Bun runs Vite natively
bun create vite my-app --template react-ts
cd my-app
bun install
bun run dev    # Bun runtime, Vite build tool
bun run build  # Same

You get Bun's install speed and fast script execution, plus Vite's full plugin ecosystem, React Fast Refresh, and production build quality. This isn't a compromise — it's better than either tool alone.

---

---

Frequently Asked Questions

Is Bun faster than Vite in 2026?

For production builds, Vite 8 with Rolldown (Rust-based) now matches or beats Bun's bundler on most real-world codebases. Linear's build went from 46s → 6s with Vite 8. Bun remains faster for package installs (9–30x vs npm) and script startup. The recommended 2026 setup is Bun as the runtime + Vite as the build tool.

Can I use Bun and Vite together?

Yes — this is the recommended approach. Use bun install and bun run dev while keeping Vite as your build tool. You get Bun's fast installs plus Vite's plugin ecosystem, React Fast Refresh, and framework support. See our state of JavaScript build tools guide for the full landscape.

Does Bun support React Fast Refresh?

No. Bun's bundler lacks React Fast Refresh as of 2026. Component state is lost on hot updates during development. For React projects, Vite's dev server with @vitejs/plugin-react is still required.

What changed in Vite 8?

Vite 8 (March 2026) replaced Rollup with Rolldown, a Rust-based bundler achieving 10–30x faster production builds. It also adds native TypeScript path aliases and a unified dev/prod pipeline. See our Farm vs Rolldown vs Vite deep-dive for how Rolldown compares to other Rust bundlers.

Should I migrate from Webpack to Bun or Vite?

Migrate to Vite, not Bun's bundler. Vite has 800+ plugins, React Fast Refresh, and powers every major framework. Then optionally switch to Bun as your runtime for faster installs. Read our Vite vs Webpack migration guide for the full cost-benefit analysis.

---

Compare Bun and Vite package health on PkgPulse.

Related: Farm vs Rolldown vs Vite · State of JS Build Tools 2026 · Vite vs Webpack: Migration Worth It?