JavaScript Minifier — Compress JS Code Online

What does minification actually do?

JavaScript minification is the process of reducing file size without changing the behavior of the code. A minifier parses your source into an abstract syntax tree, applies a series of transformations, and then re-serializes it in the most compact form possible.

The most impactful transformations include:

• Whitespace removal — spaces, tabs, and newlines that exist only for readability are stripped entirely.
• Comment stripping — single-line and block comments are deleted since they serve no runtime purpose.
• Variable mangling — local variable and parameter names are shortened to single characters (e.g. userCount becomes a). Only names whose scope is fully contained within the file can be safely renamed.
• Dead code elimination — unreachable branches such as if (false) { ... } and unused variables are removed.

Together these steps typically reduce a JavaScript file by 40-60% before any network-level compression is applied. The result is valid JavaScript that runs identically to the original.

Minification vs compression vs bundling

These three terms are often used interchangeably, but they represent distinct steps in a production build pipeline:

1. Bundling resolves module imports and concatenates multiple source files into one or more output files. Tools like webpack, Rollup, and esbuild handle this step.
2. Minification transforms each bundle to remove unnecessary characters and shorten identifiers, as described above. It operates on the code itself.
3. Compression applies a general-purpose algorithm such as gzip or Brotli at the HTTP layer. The server compresses the already-minified file, and the browser decompresses it transparently.

Minification and compression are complementary. Minification removes redundancy that is meaningful at the language level (variable names, whitespace), while gzip and Brotli exploit byte-level repetition. Applying both yields smaller payloads than either step alone. A typical 100 KB unminified file might minify to 50 KB and then compress to roughly 15 KB over the wire.

When to use an online minifier

Most production projects run minification as part of a build system. However, there are several situations where an online tool is the fastest option:

• Quick one-off scripts — you have a standalone snippet for an email template, a CMS widget, or a third-party embed and there is no build tooling to plug into.
• Debugging build output — you want to see what a minifier does to a specific function before committing to a configuration change in your bundler.
• Learning and teaching — comparing the original and minified versions side by side helps demonstrate what each transformation does.
• No local setup required — you are on a machine without Node.js installed or you simply want an answer in seconds without opening a terminal.

This tool processes everything in your browser. Your code is never sent to a server, so it is safe to paste proprietary source without concern.

Terser: the engine behind this tool

This minifier is powered by Terser, the most widely used JavaScript minifier in the ecosystem. Terser is a fork of UglifyJS that was created to add full ES6+ support. UglifyJS could only process ES5, which meant projects using modern syntax had to transpile before minifying. Terser removed that limitation and has since become the default minifier in webpack 5 and many other build tools.

The key options that affect output size are:

• compress — enables the dead code elimination, constant folding, and boolean simplification passes. This is where true becomes !0 and unreachable code is dropped.
• mangle — renames local variables and function parameters to shorter identifiers. Mangling alone often accounts for 20-30% of the size savings.
• toplevel — when enabled, top-level variable names are also mangled. This is safe for modules and IIFEs but can break scripts that expose globals intentionally.

This tool runs Terser with compress and mangle enabled by default, producing output comparable to what you would get from a production webpack build.

Related tools on CodeBoxTools

If you are optimizing front-end assets, these companion tools may help:

• CSS Minifier — strip whitespace and redundant rules from your stylesheets.
• HTML Minifier — reduce the size of HTML documents by removing optional tags, comments, and whitespace.
• JSON Formatter — pretty-print or compact JSON payloads for debugging API responses.
• HTML Beautifier — reformat minified HTML back into readable, indented markup.