Side by side
CompilervsTranspiler
What is the difference between a compiler and a transpiler?
Updated 2 min read6 differences
In short
A compiler turns code into a lower-level form a machine or VM runs, while a transpiler outputs another high-level language, like TypeScript to JavaScript.
Compiler
A compiler is a program that translates source code written in a programming language into a lower-level form, such as machine code, that a computer can run.
Read the page on CompilerTranspiler
A transpiler is a tool that translates source code from one language or language version into another at a similar level, such as TypeScript into JavaScript.
Read the page on TranspilerCompiler and Transpiler compared
| Aspect | Compiler | Transpiler |
|---|---|---|
| Output | Lower-level code: machine code or bytecode | Source code in another high-level language |
| Level | Goes down, toward the hardware | Stays at about the same level |
| Readable output | Not really; it is meant for machines | Yes, usually readable JavaScript or CSS |
| Main job | Optimizing and producing a program that runs | Mapping features between languages or versions |
| What runs the result | The processor or a virtual machine | Another runtime, such as a browser or Node.js |
| Examples | GCC, Clang, rustc, javac | tsc, Babel, SWC, Sass |
The difference, explained
Both read source code and write out a translated version. A compiler usually goes down a level: C or Rust becomes machine code for a processor, and Java becomes bytecode for the Java virtual machine. A transpiler, short for source-to-source compiler, goes sideways: its output is code in another high-level language, or another version of the same one, that people could still read.
The difference is the target. A compiler produces something that runs directly, and much of its effort goes into optimizations such as inlining and register allocation. A transpiler produces source code for another tool to run, so it focuses on mapping features faithfully: TypeScript loses its types and becomes JavaScript, Babel rewrites modern JavaScript for older browsers, and Sass turns its syntax into CSS.
In practice the line is blurry, and a transpiler is really a kind of compiler. The TypeScript tool is literally called the TypeScript compiler, tsc, and some compilers, including the first C++ compiler, worked by producing C. What matters day to day is that transpiled code still needs a runtime, such as a browser or Node.js, and usually ships with source maps so that errors point back to the original file.
A common misconception is that transpiling makes code faster or checks it while it runs. A transpiler changes the form of the code, not what it does: TypeScript's types disappear from the output, and transpiled JavaScript runs at the speed of the JavaScript engine.
Which one should you use?
Choose Compiler when…
- You want a program that runs directly on the machine or on a virtual machine.
- Speed and build-time optimizations matter.
- You write in C, C++, Rust, Go or another compiled language.
Choose Transpiler when…
- You write TypeScript, JSX or modern JavaScript that must run in browsers.
- You want newer language features than your target platform supports.
- You turn one source language, like Sass, into another, like CSS.
Readers ask
Is TypeScript compiled or transpiled?
Both words are used. tsc is officially the TypeScript compiler, but because its output is JavaScript at the same level, calling it a transpiler is also correct.
Is Babel a compiler?
Babel calls itself a JavaScript compiler. What it does is transpile modern JavaScript and JSX into versions that older browsers and tools understand.
Does a transpiler replace an interpreter?
No. The transpiled code still needs something to run it, such as a browser's JavaScript engine, which may itself interpret or compile it.