Turbopack Is Now the Default Bundler in Next.js 15: What Changes for Developers

Hello HaWkers, Turbopack, the bundler developed by Vercel in Rust, has finally left experimental status and become the default bundler in Next.js 15. This change marks a new era of performance for React developers and can drastically transform your development experience.

Have you ever felt frustrated with slow build times or hot reload that takes seconds to update? Turbopack promises to solve exactly these problems.

What Is Turbopack

Turbopack is a next-generation bundler written in Rust, developed by the same team behind Next.js. It was designed to replace Webpack, which served the JavaScript ecosystem well for years but shows signs of age in large projects.

Main characteristics:

• Written in Rust for maximum performance
• Intelligent incremental compilation
• Persistent cache between builds
• Ultra-fast Hot Module Replacement (HMR)
• Compatibility with existing Webpack ecosystem

💡 Context: Turbopack was announced in October 2022 and went through over 2 years of development and testing before becoming the default.

Why the Change from Webpack to Turbopack

Webpack is a mature and powerful tool, but has inherent limitations:

Webpack problems in large projects:

• Initial startup time can take tens of seconds
• HMR gets slow as project grows
• High memory consumption
• Complex configuration for optimization
• JavaScript architecture limits performance

What Turbopack solves:

• Startup up to 10x faster
• HMR in less than 200ms for most cases
• More efficient memory usage
• Zero configuration for common cases
• Rust enables real parallelism

Performance Comparison

Real numbers from production projects show the difference:

Metric	Webpack	Turbopack	Improvement
Cold start (medium project)	15-30s	2-5s	~6x
HMR (single file)	500-2000ms	50-200ms	~10x
Production build	60-120s	20-40s	~3x
Peak memory	4-8GB	1-2GB	~4x

These numbers vary according to project size and complexity, but the trend is consistent.

How Turbopack Works

Turbopack's architecture is fundamentally different from Webpack:

Incremental Compilation

Instead of recompiling everything when a file changes, Turbopack tracks dependencies granularly:

// When you change a component...
// components/Button.tsx (edited)

// Turbopack knows it needs to update:
// - Button.tsx itself
// - Pages that directly import Button
// - Does NOT recompile the entire project

// Result: HMR in milliseconds

This approach means projects with thousands of files have the same HMR speed as small projects.

Persistent Cache

Turbopack maintains cache between development server restarts:

// First project start:
// - Compiles everything from scratch
// - Saves cache to disk

// Subsequent starts:
// - Reads existing cache
// - Only recompiles files modified since last start

// Benefit: almost instant startups after first execution

Real Parallelism

Rust allows Turbopack to use multiple CPU cores effectively:

// Webpack (JavaScript):
// - Single-threaded by design
// - Workarounds like thread-loader are limited

// Turbopack (Rust):
// - Uses all available cores
// - File-level parallelism
// - Concurrent dependency processing

Migrating to Next.js 15 with Turbopack

If you already use Next.js, migration is relatively simple:

Updating the Project

# Update Next.js to version 15
npm install next@15 react@19 react-dom@19

# Or with yarn
yarn add next@15 react@19 react-dom@19

Checking Compatibility

Some Webpack configurations may need adjustments:

// next.config.js
// Configurations that work directly:
module.exports = {
  images: {
    domains: ['example.com'],
  },
  env: {
    CUSTOM_VAR: process.env.CUSTOM_VAR,
  },
};

// Configurations that may need review:
// - Custom Webpack loaders
// - Very specific plugins
// - Complex externals configurations

Migration Checklist

Before updating, check:

Compatibility:

• All dependencies support React 19
• Doesn't use very custom Webpack loaders
• Tests pass on current version
• Staging environment available for validation

Post-migration:

• Run complete production build
• Test HMR on various files
• Verify all pages load correctly
• Monitor performance in staging before production

Advanced Configurations

For those who need fine control, Turbopack offers options:

Basic Configuration

// next.config.js
module.exports = {
  experimental: {
    // Turbopack is already default in Next.js 15
    // But you can disable if needed:
    // turbo: false,

    // Specific configurations:
    turbo: {
      rules: {
        // Custom rules for file types
        '*.svg': {
          loaders: ['@svgr/webpack'],
          as: '*.js',
        },
      },
      resolveAlias: {
        // Custom aliases
        '@components': './src/components',
      },
    },
  },
};

Dealing with Webpack Plugins

If you depend on specific Webpack plugins, some alternatives:

// Before (Webpack):
const withBundleAnalyzer = require('@next/bundle-analyzer');

module.exports = withBundleAnalyzer({
  enabled: process.env.ANALYZE === 'true',
})({
  // config
});

// After (Turbopack):
// Bundle analyzer doesn't have direct equivalent yet
// Alternatives:
// 1. Use for production builds only (still uses Webpack)
// 2. Use external tools like Lighthouse
// 3. Wait for native Turbopack plugins

Impact on Developer Experience

The switch to Turbopack affects the developer's daily life in several ways:

Faster Feedback Loop

// Typical development flow:
// 1. Edit file
// 2. Save
// 3. See change in browser

// With Webpack: 500ms - 2s wait
// With Turbopack: 50ms - 200ms wait

// Difference seems small, but accumulates:
// - 100 edits/day × 1.5s = 150s wasted
// - With Turbopack: 100 edits × 0.1s = 10s
// - Savings of ~2 minutes/day or ~8 hours/year

Fewer Frustrations

Developers report fewer:

Solved problems:

• HMR "freezing" and needing restart
• Build failing due to lack of memory
• Long waits in large projects
• Inconsistencies between dev and production

The Future of Turbopack

Vercel has ambitious plans for Turbopack:

Expected roadmap:

• Turbopack for production builds (still uses Webpack)
• Robust plugin system
• Full Webpack ecosystem support
• Integration with other frameworks beyond Next.js

Estimated timeline:

• 2025: Stabilization as dev bundler
• 2026: Production builds in beta
• 2027: Wide adoption outside Next.js ecosystem

Performance Tips

Even with Turbopack, some practices optimize even more:

Organize Imports

// Less efficient:
import { useState, useEffect, useCallback, useMemo } from 'react';
import Button from '@/components/Button';
import Input from '@/components/Input';
import Card from '@/components/Card';

// More efficient with barrel exports:
import { useState, useEffect, useCallback, useMemo } from 'react';
import { Button, Input, Card } from '@/components';

// But be careful with very large barrel exports
// Turbopack is smart, but help when possible

Use Dynamic Imports

// Heavy components can be loaded on demand:
import dynamic from 'next/dynamic';

const HeavyChart = dynamic(
  () => import('@/components/HeavyChart'),
  {
    loading: () => <p>Loading...</p>,
    ssr: false // If not needed on server
  }
);

// Turbopack automatically optimizes code splitting
// but explicit dynamic imports help in specific cases

Conclusion

The transition from Webpack to Turbopack as the default bundler in Next.js 15 represents a significant change for the React ecosystem. Developers can expect drastically lower compilation times and a smoother development experience.

Migration for most projects is simple, but it's worth testing in a controlled environment before applying to production. Turbopack is still evolving, and some very custom Webpack configurations may need adjustments.

If you work with Next.js, experimenting with Turbopack on a new project is an excellent way to experience the future of JavaScript bundling.

If you want to understand more about JavaScript ecosystem news, I recommend checking out another article: Anthropic Acquires Bun and Bets Big on Claude Code Future where you'll discover how JavaScript runtimes are evolving.

Let's go! 🦅

🎯 Join Developers Who Are Evolving

Thousands of developers already use our material to accelerate their studies and achieve better positions in the market.

Why invest in structured knowledge?

Learning in an organized way with practical examples makes all the difference in your journey as a developer.

Start now:

• 1x of $4.90 on card
• or $4.90 at sight

🚀 Access Complete Guide

"Excellent material for those who want to go deeper!" - John, Developer