Skip to content

Turbopack and Build Performance

Turbopack is Next.js’s Rust-based bundler, now the default for both next dev and next build, and it speeds up your feedback loop by compiling incrementally instead of rebuilding everything.

In current Next.js (16 at the time of writing), Turbopack is the default bundler for both next dev and next build. Development with Turbopack has been stable for some time; the production build path is the newer piece, so verify against the docs for your exact version. You do not need any flag to use it — a plain script is enough.

{
"scripts": {
"dev": "next dev",
"build": "next build",
"start": "next start"
}
}

If you hit an issue and need the old bundler, you can opt back into webpack per command.

{
"scripts": {
"dev": "next dev",
"build": "next build --webpack",
"start": "next start"
}
}

The core idea is incremental compilation. Turbopack builds a dependency graph and only recomputes the parts affected by a change, so cold starts are faster and Hot Module Replacement stays near-instant even as the app grows. When you save a file, it recompiles just that module and its dependents rather than the whole route.

webpack is a mature JavaScript bundler with a huge plugin ecosystem, but that JavaScript core and its full-rebuild tendencies become the bottleneck on large apps. Turbopack is written in Rust, is multi-core by design, and treats fine-grained incremental work as the default rather than an add-on. Some webpack plugins and loaders do not apply — Next.js provides its own equivalents, and you configure Turbopack under the turbopack key.

// next.config.ts — Turbopack-specific configuration
import type { NextConfig } from 'next'
const nextConfig: NextConfig = {
turbopack: {
// e.g. custom rules for importing SVGs as components
rules: {},
},
}
export default nextConfig

Turbopack can persist its work to disk so a later dev start or build reuses earlier compilation instead of starting cold. This filesystem cache is stable for development and still experimental for production builds, so treat the build-side flag as opt-in.

// next.config.ts — persistent filesystem cache
import type { NextConfig } from 'next'
const nextConfig: NextConfig = {
experimental: {
turbopackFileSystemCacheForDev: true,
turbopackFileSystemCacheForBuild: true,
},
}
export default nextConfig
flowchart LR
  Save[Save a file] --> Graph[Dependency graph]
  Graph --> Changed[Recompile changed module + dependents]
  Graph --> Cache[Reuse unchanged from cache]
  Changed --> HMR[Fast HMR / build]
  Cache --> HMR
Incremental compilation reuses unchanged work
What language is Turbopack written in?
What is Turbopack the default bundler for in current Next.js?
How do you opt back into webpack for a production build?
What makes Turbopack fast on repeated work?