Stop 17 · Build ToolsTopics · 6/9

SWC

In short

If you've used Next.js, SWC has already compiled your code. It does Babel's job, written in Rust, and it's a big reason modern dev servers feel snappy.

A Rust-based, extremely fast alternative to Babel for compiling modern JavaScript/TypeScript — used by default in Next.js for its speed advantage.

The jaadu bats as a new cricket opener, swinging fast as the ball flies away.

Think of it like this

A new opener with the same role

The team keeps the same batting plan, but swaps in an opener who scores much faster. SWC takes Babel's role of converting TS and JSX into plain JavaScript, just with a quicker bat thanks to Rust.

Watch it happen

Babel vs SWC

Babel

Written in JavaScript
Huge plugin ecosystem
Slower on large projects

SWC

Written in Rust
Default compiler in Next.js
Fewer plugins, much faster builds

Use SWC by default for speed. Keep Babel only if you need a plugin SWC lacks.

The big ideas

What you need to know

Rust-based compiler

SWC stands for Speedy Web Compiler. It turns TypeScript, JSX and modern JS into the JavaScript you target.

Built into Next.js

Next.js uses SWC to compile and minify your code, so you get it without any setup.

Also a Vite option

@vitejs/plugin-react-swc swaps Babel for SWC in a Vite React project for faster refreshes.

Fewer plugins than Babel

Babel has a huge plugin ecosystem. SWC covers the common cases, but some rare Babel plugins have no SWC version.

See it in code

Walk through the code

json

1{2  "jsc": {3    "parser": { "syntax": "typescript", "tsx": true },4    "transform": { "react": { "runtime": "automatic" } },5    "target": "es2020"6  },7  "sourceMaps": true8}

1/4Parse TypeScript files, with JSX allowed.

This .swcrc tells SWC to parse TypeScript with JSX, use the automatic React runtime and output ES2020 code. Run it with @swc/cli: npx swc src -d dist.

Save yourself the pain

Common mistakes

Oops

Leaving an old .babelrc in a Next.js project and wondering why builds got slower.

Do this instead

Next.js switches back to Babel when it finds a Babel config. Delete it unless you truly need a Babel-only plugin.

Oops

Assuming SWC catches type errors.

Do this instead

Like esbuild, SWC strips types without checking them. Keep tsc or your editor's type check in the loop.

Your mission

Swap Babel for SWC

~20 min

Quick check

A Next.js project has a .babelrc file left from an old setup. What happens?

Go deeper

1Read why Next.js switched from Babel to SWC by default.
2Compare compile times conceptually — SWC is typically an order of magnitude faster than Babel.
3Know it as 'a faster Babel' — most projects don't need to configure it directly.