JS Minifier & Beautifier

JavaScript minification removes characters that the interpreter ignores — whitespace, newlines, tabs, and comments — without changing what the code does. The JavaScript engine executes minified code identically to formatted code; the only difference is fewer bytes traveling over the network.

Real-world minification typically saves 50–70% of the original file size, depending on how heavily commented and indented the source is. A library with JSDoc comments for every function and generous spacing can compress more than two-thirds. Already-compact code saves less.

Build tools — Webpack, Vite, Rollup, and esbuild — minify JavaScript automatically as part of their production output. This tool is useful when working outside a bundler, when you receive a third-party script you want to re-serve, or when you need to quickly inspect how much a specific file can shrink.

The beautifier does the reverse — it takes minified or poorly-formatted JavaScript and adds 2-space indentation, line breaks after { and }, and a blank line between top-level declarations. The output is semantically identical but formatted for human readability.

Use the beautifier when you need to:

• • Debug a minified vendor script — read its logic without staring at one long line.
• • Review a pull request where minified JS was accidentally committed instead of source.
• • Inspect a CDN-hosted library to understand an undocumented API.
• • Onboard onto a legacy project that ships raw minified files with no build pipeline.

These three are separate, complementary optimisations — each operates at a different level:

• Minification removes whitespace, comments, and redundant characters from existing code. It does not change the logic or remove any functions. This tool does minification.
• Bundling combines multiple .js files into one (or a few) output files. Fewer HTTP requests can improve load time, especially without HTTP/2. Webpack, Vite, and Rollup all bundle as part of their pipeline.
• Tree-shaking removes exported functions and variables that are never imported elsewhere. It requires ES module syntax (import / export) so the bundler can statically analyse what is used. A 500 KB utility library where you only use two functions can be reduced to a few KB.

In production: bundle first, tree-shake during bundling, then minify the output. All three together produce the smallest possible file that your application actually needs.