C.W.K.
Stream
Lesson 04 of 05 · published

esbuild and swc: Fast Transpilers

~7 min · tooling, esbuild, swc, transpilers

Level 0Curious
0 XP0/93 lessons0/23 achievements
0/100 XP to next level100 XP to go0% complete
"esbuild and swc strip types fast. They don't type-check. That's a feature."

What they do

esbuild (Go) and swc (Rust) are extremely fast TypeScript-to-JavaScript transpilers. They take your .ts files and produce .js files in milliseconds. What they don't do: type checking. They strip the types and emit; that's the whole job.

This is intentional. Type checking is slow because it's a graph problem (every type references other types). Transpilation is parallel-friendly per-file. By splitting the jobs — transpiler for emit, tsc --noEmit for type checks — you get both fast builds and full type safety.

Where they appear

You almost never use esbuild or swc directly. They're embedded:

  • Vite uses esbuild for dev-time transpilation.
  • Next.js uses swc.
  • Bun uses its own transpiler (forked from JavaScriptCore).
  • tsx (the Node TS wrapper) uses esbuild.
  • Vitest uses esbuild.

If you've used any modern TypeScript build tool, you've used esbuild or swc indirectly.

When to use directly

For bundling: esbuild src/main.ts --bundle --outfile=dist/bundle.js. For a small lib that doesn't need a full build pipeline. For experiment/prototype code. For server-side bundling.

Fast transpilers + type-check-only tsc is the modern TypeScript build pipeline. Vite, Next, Bun all follow this model. The split is why TypeScript no longer feels slow.

Code

Direct and indirect use of fast transpilers·bash
# Direct esbuild — bundle a TS file to JS.
npx esbuild src/main.ts --bundle --outfile=dist/bundle.js

# Bundle for the browser.
npx esbuild src/main.ts --bundle --platform=browser --outfile=dist/bundle.js

# Bundle for Node.
npx esbuild src/main.ts --bundle --platform=node --outfile=dist/bundle.js

# Direct swc.
npx swc src --out-dir dist

# Indirect — Vite uses esbuild.
npm create vite@latest my-app -- --template react-ts
# Vite handles everything under the hood: esbuild for dev, Rollup for prod build.

External links

Exercise

Install esbuild and use it to bundle a small two-file TS project to a single JS bundle. Compare the build time with tsc doing the same job. Then add a type error and observe — esbuild succeeds, tsc fails.
Hint
The time difference is 10-100x in favor of esbuild. The type-safety difference is the catch — esbuild ignores type errors entirely. You need both: fast transpiler for emit, tsc for checking.

Progress

Progress is local-only — sign in to sync across devices.
Spotted a bug or have feedback on this page?Report an Issue

Comments 0

🔔 Reply notifications (sign in)
Sign inPlease sign in to comment.

No comments yet — be the first.