What is SWC?

SWC is a compiler for JavaScript and TypeScript, written in Rust. It’s a tool I see mentioned more and more.

It takes any JavaScript or TypeScript code and outputs JavaScript that works also on older browsers, as well as (of course) modern browsers.

In short it’s the new Babel.

But faster.

They say 20x+ faster.

Why is it so much faster?

Babel is written in JavaScript. It runs on a single thread, and it parses, transforms and prints your code using JavaScript itself.

SWC is written in Rust, a language compiled to native code, and it can work on multiple files in parallel. That’s where the speed comes from.

We’re seeing an incremental focus on speed everywhere these days. Mostly because tools are rewritten in more optimized system languages like Rust instead of less optimized languages like JavaScript, which is more optimal for other use cases.

On a small project you barely notice. On a large codebase every save triggers a rebuild, and that’s where the gap between Babel and SWC shows up.

Who uses it?

As a “normal dev”, you’re not going to use it yourself.

But it’s used by other tools.

Next.js adopted SWC in version 12 to replace Babel for compiling and Terser for minifying.

Vite 4, released in December 2022, came with a new React plugin called @vitejs/plugin-react-swc, which uses SWC instead of Babel.

That plugin still exists in Vite 8. In the dev server it uses SWC to compile TypeScript and JSX, and to power Fast Refresh.

For production builds, Vite 8 compiles your code with Oxc, another Rust-based tool. The plugin only runs SWC in the build when you add SWC plugins. If you don’t use any, Vite recommends switching to the regular @vitejs/plugin-react.

It’s used by Turbopack, which is the Vercel-made JavaScript/TypeScript bundler/build system, alternative to Vite and Webpack.

You can also use it to speed up tests, through the @swc/jest package, which compiles your test files much faster than the Babel-based default.

Trying it directly

If you’re curious, you can run it on its own:

npm install -D @swc/cli @swc/core
npx swc src -d dist --strip-leading-paths

This compiles everything in src and writes the output to dist. You need --strip-leading-paths because the current CLI keeps the folder name otherwise, and writes to dist/src.

Configuration lives in a .swcrc file, where you set the syntax (TypeScript or JavaScript) and the target environment.

One thing to know about TypeScript

SWC compiles TypeScript, but it does not type-check it. People often miss this when a tool switches them to SWC.

SWC strips the types and outputs JavaScript, without verifying them. Your build succeeds even if the types are wrong.

The fix is to keep running the TypeScript compiler for checking only:

tsc --noEmit

You get SWC’s speed for the build, and tsc catches the type errors, in your editor or in CI.

Want me to talk about your product? You can sponsor this site.