Skip to content
codevory

JavaScript Minifier

Minify JavaScript with Terser: remove comments and whitespace, compress expressions and rename local variables. Syntax errors show line and column.

JavaScript Minifier: the tool

Paste JavaScript to minify it.

Input

Minified JavaScript

The result appears here.

How to use JavaScript Minifier

  1. Paste your JavaScript, or press Example. Choose ES module if the code uses import or export.
  2. Leave Compress and Rename local names on for the smallest result, or turn them off to only remove whitespace and comments.
  3. Rename top-level names only if no other script or HTML attribute refers to your global functions and variables.
  4. Copy the result or download it as script.min.js, and test it before you deploy it.

Example

A small function with comments, minified with the default options.

Input
// Greets every user in the list.
function greetUsers(userList, greeting) {
  const messages = [];
  for (const currentUser of userList) {
    /* build one message per user */
    messages.push(greeting + ', ' + currentUser.name + '!');
  }
  return messages;
}

console.log(greetUsers([{ name: 'Ada' }, { name: 'Alan' }], 'Hello'));
Output
function greetUsers(e,n){const o=[];for(const s of e)o.push(n+", "+s.name+"!");return o}console.log(greetUsers([{name:"Ada"},{name:"Alan"}],"Hello"));

About this tool

The minifier is Terser, the tool behind many production build pipelines. It parses the code into a syntax tree, so it understands strings, regular expressions, template literals and modern syntax such as classes, private fields, optional chaining and BigInt. It then removes whitespace and comments, applies safe rewrites such as folding constants and removing unreachable code, and renames local variables and parameters to short names.

Names that other code can see are kept by default. Top-level functions and variables are part of the page's global scope, so renaming them would break an onclick attribute or another script that calls them. In an ES module, top-level names are private and are always renamed, and exported names are never changed. Properties are not renamed either, so obj.name stays obj.name.

Minification should not change behaviour, and the tool's tests run programs before and after minification and compare the results. Even so, always test minified code, and keep your original source: minified code is hard to read and cannot be turned back into it. The library loads the first time you use the tool, which takes a moment, and everything runs in your browser.

Frequently asked questions

Is it safe to minify JavaScript?

Terser is widely used in production and its rewrites preserve behaviour. Problems are rare and usually come from code that depends on function or variable names, such as Function.prototype.name or toString(). Test the minified code, and keep top-level renaming off for scripts that share globals.

What is the difference between a script and an ES module?

A module can use import and export and runs in strict mode, with its own scope. A classic script shares the page's global scope. Choosing the wrong type causes a syntax error or unexpected renaming, so pick the one your code uses.

Why does the tool say my code has a syntax error?

Terser reads standard JavaScript only. TypeScript, JSX and other extensions must be compiled first. The message gives the line and column where reading stopped.

What does Rename top-level names do?

It shortens the names of functions and variables declared at the top of a script. Use it only for self-contained code: if an HTML attribute such as onclick calls one of those functions, or another script uses it, renaming will break it.

Can I get my original code back?

Not exactly. Comments, formatting and local names are gone. A source map can map minified code back to the source during debugging, and your build tool can generate one. Always keep the original.

Is my code uploaded?

No. The minifier runs in your browser and nothing is sent to a server.

More developer tools