JavaScript Minifier
Paste or drop your JavaScript and get a smaller file in one click. Terser compresses expressions and shortens variable names; a built-in minifier removes comments and whitespace safely if Terser can't load. Your code never leaves the browser.
How to use the JavaScript Minifier
- Paste your JavaScript into the left box, drop a .js file onto it, or press Open .js file.
- Choose options: Compress and Mangle give the smallest output; tick Mangle top-level names only for self-contained scripts.
- Press Minify JavaScript. The output updates automatically as you type or change options.
- Check the result: the engine badge shows whether Terser or the built-in minifier ran, and the cards show bytes saved and gzip size.
- Copy or download the minified code as a .min.js file.
What minification changes, with an example
Take this function (152 bytes):
// Returns the total price including tax
function totalPrice(items, taxRate) {
const subtotal = items.reduce((sum, item) => sum + item.price, 0);
return subtotal * (1 + taxRate);
}| Step | Output | Size |
|---|---|---|
| Remove comments and whitespace | function totalPrice(items,taxRate){const subtotal=items.reduce((sum,item)=>sum+item.price,0);return subtotal*(1+taxRate)} | 113 bytes |
| + Mangle local names | function totalPrice(e,t){const r=e.reduce((e,t)=>e+t.price,0);return r*(1+t)} | 78 bytes |
| + Compress (inline the temporary variable) | function totalPrice(e,t){return e.reduce((e,t)=>e+t.price,0)*(1+t)} | 69 bytes |
The function name totalPrice is kept because other code may call it. Ticking Mangle top-level names would shorten it too.
Terser options explained
| Option | What it does | Risk |
|---|---|---|
| Compress | Dead-code removal, constant folding, joining declarations, shorter conditionals (two passes) | Very low for standard code |
| Mangle variable names | Renames local variables and parameters | Low; code that relies on Function.prototype.name of local functions may change |
| Mangle top-level names | Also renames and drops unused top-level functions and variables | Breaks globals used by other scripts or inline HTML handlers |
| Drop console.* calls | Removes console.log, console.warn and similar | Arguments with side effects are removed too |
| Keep /*! license */ comments | Preserves comments starting with /*! or containing @license / @preserve | None; required by many open-source licences |
Why automatic semicolon insertion matters
JavaScript inserts semicolons at some line breaks, so blindly deleting new lines can change what code does. For example return followed by a value on the next line returns undefined, and a followed by ++b on the next line increments b, not a. The built-in fallback keeps a line break wherever removing it could change the meaning, and removes it where the previous token is an operator, comma, semicolon or opening bracket. It also knows when a / starts a regular expression rather than a division, so patterns like /[/]+/g and strings containing // are never mistaken for comments.
Frequently asked questions
What does a JavaScript minifier do?
It rewrites your code into the smallest equivalent form: comments and whitespace are removed, local variable names are shortened (mangling), and expressions are simplified (compression). The code behaves the same but downloads and parses faster.
Is minified JavaScript safe to use in production?
Yes, that is what minification is for. Terser is the minifier used by webpack, Vite and Rollup. Keep the original source for editing and debugging, and test the minified build before you deploy it.
What is the difference between compress and mangle?
Compress rewrites code: it removes unreachable code, joins variable declarations, folds constants and shortens if statements. Mangle renames local variables and function parameters to one or two letters. Using both gives the smallest file.
When should I enable Mangle top-level names?
Only when the script is self-contained, such as a bundle or an ES module. Top-level mangling renames global functions and variables, which breaks code that other scripts or HTML onclick attributes call by name.
What happens if Terser cannot load?
Terser is loaded from a CDN the first time you minify. If that fails, for example offline or behind a firewall, the built-in minifier removes comments and unnecessary whitespace and line breaks while respecting strings, template literals, regular expressions and automatic semicolon insertion. The page tells you which engine ran.
Why do I get a syntax error?
The minifier must parse your code first, so invalid JavaScript is rejected with the line and column of the problem. Common causes are a missing bracket, a stray character, or TypeScript or JSX syntax, which must be compiled to plain JavaScript before minifying.
Is my code uploaded?
No. Minification runs in your browser. Only the Terser library itself is downloaded from a public CDN; your source code is never sent anywhere.