Comparing Turbopack and Vite
Vite (opens in a new tab) is an incredibly fast (non-)bundler that the web development community is extremely excited about - and so are we. Vite has raised the bar for web development and shown us what is possible for the future of the Web. If we were going to build a bundler, it had to perform at least as good as the (already impressive) Vite to validate our efforts. We're proud to say that we achieved that.
Speed
Turbopack can outperform Vite on several key metrics.
Dev server startup time
Vite is a non-bundler, which means it doesn't bundle your code at all. It sends each module directly to the browser. This means the browser does the hard work of handling dependencies between modules.
On the surface, this seems like an unfair fight. Turbopack bundles your application, meaning that a lot more work needs doing before sending the code to the browser.
But it turns out that Turbopack can handle this faster than the browser can. By pre-bundling, we can save a lot of time over Vite's Native ESM system. You can learn more about this in our Why Turbopack section.
This means that Turbopack's dev server starts up much faster than Vite's. On a 1,000 module application, Vite takes 4.2s to start up. Turbopack starts up in 1.4s - 3.0x faster.
In large applications, this differential stays consistent. In a 30,000 module application, Turbopack starts up 4.4x faster than Vite.
Note that Vite is using the official SWC plugin (opens in a new tab) for these benchmarks, which is not the default configuration.
Turbopack
turbo
1.4s
Vite
with SWC
4.2s
Code updates
Vite is extremely fast in development because of its speedy Fast Refresh capabilities. When you update a file, Vite uses its Native ESM system to to send the updated module to the browser - and performs a little bit of magic to integrate that into the existing module graph.
In Turbopack, we discovered that for Fast Refresh, we don't really need to do bundling work at all. We can send updates in a similar style to Vite. In fact - a little bit more efficently: Turbopack sends changed modules directly through the WebSocket without doing any bundling at all.
In a 1,000 module application, Turbopack can react to file changes 5.5x faster than Vite.
Turbopack
turbo
19ms
Vite
with SWC
105ms