Turbopack and Build Performance
The idea in one sentence
Section titled “The idea in one sentence”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.
Turbopack is now the default
Section titled “Turbopack is now the default”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" }}What Turbopack speeds up
Section titled “What Turbopack speeds up”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.
How it differs from webpack
Section titled “How it differs from webpack”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 configurationimport type { NextConfig } from 'next'
const nextConfig: NextConfig = { turbopack: { // e.g. custom rules for importing SVGs as components rules: {}, },}
export default nextConfigBuild caching
Section titled “Build caching”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 cacheimport type { NextConfig } from 'next'
const nextConfig: NextConfig = { experimental: { turbopackFileSystemCacheForDev: true, turbopackFileSystemCacheForBuild: true, },}
export default nextConfigflowchart 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