JS Minifier

Minify JavaScript code to reduce file sizes for faster page load times.

Formatting
Input Code
Minified Output

Before you minify JavaScript by hand

Production JavaScript minification is normally a compiler job. A mature minifier parses the language, understands scope, preserves automatic semicolon insertion boundaries, and can optionally rename local variables or remove unreachable code. This JS Minifier is intentionally narrower: it performs a quick text-based compaction in the browser and shows the result beside the input. That makes it useful for small, conventional snippets, demonstrations, and approximate size comparisons, but not a safe replacement for Terser, esbuild, SWC, Rollup, or a framework build pipeline.

The distinction matters because JavaScript is not whitespace-insensitive in every context. A regular expression can look like a comment, a newline can terminate a statement, and a plus or minus may be unary or binary. Read the transformation rules below before copying output into executable code.

The exact compaction pass

For JavaScript input, the tool applies three broad regular-expression steps. First it removes text that looks like // line comments or /* ... */ block comments. Next it collapses every whitespace run into a single space. Finally it removes spaces around a selected set of characters: =, +, -, *, /, braces, parentheses, semicolons, commas, angle brackets, and !. Leading and trailing whitespace is trimmed.

For a basic function:

// Return a display label
function label(user) {
  const prefix = "Member: ";
  return prefix + user.name;
}

the result is similar to:

function label(user){const prefix="Member: ";return prefix+user.name;}

Variable names are not shortened. String literals are not rewritten intentionally. The tool does not perform constant folding, dead-code elimination, tree shaking, property mangling, module bundling, or source-map generation. Its output is therefore compacted text rather than an optimizing minifier artifact.

About the Aggressive Minify checkbox

The interface includes an Aggressive Minify checkbox and it is checked initially. In the current component, changing it causes the output effect to run again, but the selected value does not alter the JavaScript transformation. Checked and unchecked output should be identical for the same input. This is important when evaluating the tool: do not infer that one mode performs safer comment retention or that the other enables identifier mangling.

If you need configurable minification, use a parser-based build tool whose options document compression passes, ECMAScript target, module mode, reserved names, legal comments, and source maps. Those settings are meaningful because they are tied to language analysis rather than a generic toggle.

Why text-based JavaScript minification can fail

Consider a URL stored in a string:

const endpoint = "https://api.example.com/v1";

The //.* comment pattern can treat the two slashes inside the string as the start of a comment and remove the remainder of that line. A block-comment-looking sequence inside a string can be removed for the same reason. A parser knows it is inside a quoted literal; a regular expression applied to the whole source does not.

Regular-expression literals create another ambiguity:

const commentMarker = /\/\/[a-z]+/;

Slashes can mean division, regex delimiters, or comments. Correctly deciding among them requires grammatical context. Templates add more complexity because raw template text can contain whitespace and comment markers that must remain exact, while ${...} sections contain normal JavaScript.

Whitespace removal around + and - can join tokens in surprising ways. Newlines after return, throw, yield, break, or continue can be semantically significant. Removing comments can also cause formerly separated tokens to touch. Hashbang lines, HTML-like legacy comments, source map directives, and conditional compilation conventions are not handled specially.

Modern JavaScript and TypeScript introduce optional chaining, nullish coalescing, private fields, decorators, JSX, type syntax, and proposal-stage grammar. This utility does not select an ECMAScript target or parse any of those constructs. A result that looks short is not evidence that it remains valid.

A bounded workflow for a small snippet

Use a disposable copy and keep input modest. Paste a complete function rather than a fragment whose meaning depends on surrounding syntax. Inspect the output for strings containing http://, https://, comment-like text, regex literals, and templates. Copy it, then parse and execute it in the same runtime mode as the original. Compare unit-test results and observable output.

For a browser script, verify both classic-script and module assumptions: strict mode, top-level this, imports, and exports differ. For Node.js, match CommonJS or ESM and the deployed Node version. If code is TypeScript, compile it first and minify the emitted JavaScript with a TypeScript-aware toolchain rather than pasting types into this utility.

Never delete readable source after creating a compact copy. Minified text is difficult to debug, review, and patch. Name generated assets distinctly, fingerprint them for caching, and retain source maps when the production toolchain supports them. Required license comments should be extracted or preserved through explicit legal-comment settings.

Building a reliable production pipeline

A robust sequence starts with syntax-aware source transforms, then bundles modules when needed, minifies the resulting JavaScript, emits a source map, and fingerprints the output. CI should run tests against the production build as well as source. The server or CDN can then apply Brotli or gzip and send long-lived cache headers for hashed assets.

Measure more than the raw character count. Record uncompressed, gzip, and Brotli sizes because repeated identifier names often compress well. Evaluate parse and execution cost for large bundles. Split code by route or capability where that improves loading behavior, and use bundle analysis to identify heavy dependencies. Text compaction alone cannot remove an imported library that users never need.

Tree shaking and minification are related but separate. Tree shaking relies on static module structure and package metadata to exclude unused exports. Compression can simplify expressions after that removal. Mangling renames scoped symbols to shorter names, subject to reserved-name and reflection constraints. This JS Minifier performs none of those analyses, so its output will usually be larger than a production optimizer’s result.

Useful and unsuitable scenarios

The tool is useful for showing how whitespace affects a tiny teaching example, fitting a straightforward snippet into a constrained text field, or making a rough before-and-after comparison. It can also help identify whether a copied artifact has already undergone basic compaction.

It is unsuitable for minifying dependency bundles, code containing regular expressions or template-heavy strings, scripts with legal banners, TypeScript or JSX source, and anything deployed without tests. It should not be used to conceal code. Minification is reversible enough for determined readers and provides no security boundary. Secrets, private keys, internal credentials, and privileged business rules do not become safe when variable spacing disappears.

Failure patterns and next actions

Everything after a URL vanished. The line-comment removal matched // inside a quoted URL. Restore the source and use a parser-based minifier.

The checkbox makes no visible difference. That is expected in the current implementation; its state is not consulted by the minification rules.

A regex literal became invalid. Slash ambiguity cannot be resolved by this text pass. Do not patch the output manually and assume other regexes are safe; switch tools.

A license or source map comment disappeared. All matching comments are removed without a preservation policy. Configure legal comment extraction and source-map emission in production tooling.

Output is smaller but the page is not faster. Inspect cache behavior, compressed transfer size, bundle splitting, dependency weight, main-thread execution, and render-blocking requests. Raw bytes are only one part of performance.

The output runs in one browser but fails in another. This utility does not transpile syntax or choose target environments. Use a compatibility-aware build process and test the actual support matrix.

JS Minifier FAQ

Is this the same as Terser or esbuild minification?

No. Those tools parse JavaScript and can safely apply syntax-aware compression and mangling. This page performs a small set of text replacements.

Does it rename variables?

No. Function names, parameters, local bindings, and properties remain unchanged unless affected accidentally by a broader text issue.

Can it minify JSON?

Use a JSON parser and serializer for JSON. JSON has different validity rules, and parser-based handling can report malformed input rather than silently returning questionable text.

Does minification protect intellectual property?

No. Browsers must receive executable code, and formatting or deobfuscation tools can make it easier to inspect. Enforce sensitive rules and hold secrets on trusted servers.

Is the result compressed with gzip?

No. The output is plain text. HTTP content encoding is a separate server or CDN concern.

How should I verify output?

Parse it with the production runtime or bundler, run automated tests, exercise relevant behavior, and compare logs and network interactions. For nontrivial code, regenerate with a syntax-aware minifier instead.

Learn More

Read our comprehensive guide to master this utility.

Read Guide →