What is Minification?

Minification shrinks source code for machines to run, not humans to read: it strips whitespace, comments, and redundant syntax, and in JavaScript's case renames local identifiers, without changing what the code actually does. It's a build-time step, applied right before deployment, never a replacement for readable source under version control.

A real minifier parses the input into a syntax tree first, then transforms that tree, it doesn't run regex find-and-replace on raw text. That distinction is what makes it safe: every change it makes is one it can prove doesn't affect behavior, which a text-level whitespace stripper can't guarantee once a CSS calc() expression or a JS string literal happens to look like the syntax being stripped.

What each language's minifier actually removes

	Typical savings	What it does
CSS	20-40%	Whitespace, comments, redundant units and values
HTML	10-20%	Inter-tag whitespace, comments, redundant attributes
JavaScript	30-60%	All of the above, plus variable renaming and dead-code removal

HTML minification is the smallest win of the three for a structural reason, not a tooling one: most of an HTML document is content, not syntax, so there's simply less to strip. A good HTML minifier still recurses into any embedded <style> and <script> blocks and runs the CSS/JS minifier on those too, rather than treating them as opaque text.

Why JavaScript shrinks the most

CSS and HTML minification is mostly subtractive, there isn't much left to rename since selectors and tag names carry meaning the browser depends on. JavaScript minification adds a second lever: local variable and function names are only meaningful to the developer reading them, not to the interpreter, so function calculateTotalPrice(items) can become function a(b) with zero change in behavior, as long as every reference is renamed consistently across the whole scope.

A tree-based minifier goes further still: it can prove a branch is unreachable and delete it outright, or inline a constant at every place it's used. That combination, renaming plus structural deletion, is why JS routinely compresses 30-60% versus 20-40% for CSS.

Minification is not compression

The two are complementary and normally both run. Minification changes the source text itself before the file is ever sent. gzip or Brotli compression happens afterward at the HTTP layer, finding repeated byte patterns in whatever text it's handed, minified or not.

Minifying first still matters even though the compressor finds repetition on its own: comments and long, unique identifier names are exactly the kind of high-entropy content general-purpose compression is worst at collapsing, removing them before compression gives the compressor a smaller, more repetitive input to work with.

Once you minify, you need a source map

A minified stack trace or breakpoint no longer corresponds to anything recognizable, the variable names are gone and the line numbers have shifted. A source map is a lookup table that lets browser DevTools translate a minified position back to the original file and line, and every major bundler (Vite, webpack, Rollup, esbuild) can emit one automatically as part of production minification.

Use the CSS, HTML, and JavaScript minifiers on this site for a quick one-off check on a snippet, but let your actual build pipeline handle minification (and its source map) for anything shipping to production.

Try it now

CSS Minifier

Compress CSS with lightningcss: a real parser, not a regex pass, so nested selectors and custom properties survive intact.

→

HTML Minifier

Collapse whitespace and strip comments, plus recursively minify embedded <style> and <script> blocks.

→

JavaScript Minifier

Mangle local variable names and strip dead code with terser, an AST-based minifier.

→

Frequently asked questions

It shouldn't, that's the entire point of a real minifier versus a naive one. A parser-based minifier (lightningcss for CSS, terser for JS) builds an actual syntax tree before transforming it, so it only removes or renames things it has proven are safe: unreachable code, redundant whitespace, local variable names that aren't part of any public API.

A regex-based whitespace stripper can't make that guarantee, it can corrupt a CSS value containing calc() or a JS string that happens to contain code-like text, since it isn't actually parsing the grammar it's compressing.

Because there's more that's provably safe to change. CSS and HTML minification is mostly subtractive, whitespace, comments, redundant attributes, with little left to rename since selectors and tag names are meaningful. JavaScript minification adds renaming and restructuring on top: local variable and function names can shrink to a single letter, dead branches can be deleted outright, and constants can be inlined at their use site.

That combination routinely cuts 30-60% off real-world JS, versus roughly 20-40% for CSS and 10-20% for HTML, where most of the document is content rather than syntax to begin with.

Because the transformation is not just whitespace removal, it renames variables and deletes code, so a stack trace or breakpoint in the shipped file no longer corresponds to anything recognizable in your original source. A source map is a lookup table the browser DevTools use to map minified positions back to the real file and line.

Every major bundler (Vite, webpack, Rollup, esbuild) can emit one automatically alongside its production minification step, that's the right place to generate it. A standalone minifier tool is for a quick one-off check, not a replacement for that build step.

No, they're complementary and both typically run. Minification changes the source text itself (shorter names, no whitespace) before the file is ever sent. gzip/Brotli compression happens at the HTTP layer afterward, finding repeated byte patterns in whatever text it's given, minified or not.

Minifying first still helps even though compression finds repetition on its own: a minified file has fewer bytes for the compressor to work with, and removing unpredictable content like comments and long identifier names is exactly the kind of thing general-purpose compression is worse at collapsing than a dedicated minifier.