Online JavaScript Minifier & Beautifier — JS Compressor and Formatter

Paste JavaScript, load a sample, or upload a .js file, then minify, compress, format, or unminify it instantly. Measure the reduction and copy or download the result without uploading your code.

Advertisement

Drop a .js/.mjs file here. Tab moves focus; Ctrl/Cmd+] indents. Untitled input

Generated output can be adjusted before copyingNo output
Loading local processing engines…
0 BInput · 0 chars · 0 lines
0 BOutput · 0 chars · 0 lines
—Bytes saved · reduction
—Gzip / Brotli estimates

Processing Options

Minification preset
Advanced minification options

Production transforms can change code that depends on names, evaluation order, or undocumented side effects. Safe mode retains identifiers and skips compression transforms.

Syntax and beautifier
Controls Terser output; it does not transpile every modern feature.
Advanced beautifier options
Use 0 to disable wrapping.

How to Minify or Beautify JavaScript Online

  1. Paste code, choose Try Sample, or upload/drop a .js or .mjs file.
  2. Select Script or ES module, then choose Safe or Production minification and any advanced options.
  3. Select Minify or Beautify / Unminify. Syntax is parsed first; errors include a line and column.
  4. Compare bytes, characters, lines, and compressed-size estimates, then copy or download the result.
  5. Test the exact output in its intended environment before deployment.

Real JavaScript Transformations

Minification: Before → After

Before
/*! MIT */
const greet = (name) => () => {
  // Build a greeting
  return `Hello, ${name}!`;
};
greet("Ada")();
Safe output
/*! MIT */
const greet=name=>()=>{return`Hello, ${name}!`};greet("Ada")();

Comments and unnecessary whitespace are removed, required token spacing and chained calls remain valid, and Safe mode retains identifiers.

Beautification: Before → After

Before
const values=[1,2,3];for(const n of values){console.log(n?.toString());}
Formatted output
const values = [1, 2, 3];
for (const n of values) {
  console.log(n?.toString());
}

Indentation and operator spacing are restored while commas inside arrays and loop syntax remain in context. Removed comments and original names cannot be recovered.

JavaScript Minification Guide

How JavaScript Minification Works

Terser parses source into a syntax tree before printing smaller JavaScript. Safe mode removes comments and unnecessary formatting without renaming symbols or applying compression transforms. Production mode can simplify expressions, remove provably unreachable code, and mangle eligible local names. Minification alone does not necessarily remove unused code; that depends on optimization settings and whether a bundler can analyse the full module graph.

Minification vs Compression vs Obfuscation

Minification reduces source characters. Gzip and Brotli are transport encodings normally applied by a web server or CDN, often on top of minified output. Obfuscation deliberately makes code harder to understand. Mangling contributes to smaller, less readable code, but neither minification nor obfuscation protects secrets shipped to a browser.

When to Use an Online Tool

A browser tool is convenient for a snippet, a one-off file, a quick comparison, or reading compact code. It also avoids installing a package for a small task. Use the Script/Module selector correctly, preserve required licences, and keep sensitive input retention in mind: this page saves the current input locally until Clear is used.

Production Build Alternatives

Production projects usually automate minification with Terser, esbuild, Rollup, Vite, or Webpack. A build pipeline can bundle dependencies, tree-shake unused exports, emit source maps, apply consistent settings, run tests, and reproduce the same artifact during deployment.

Limitations

Beautification cannot recover deleted comments, source maps, original whitespace, or names that were mangled. This page does not compile JSX or TypeScript, bundle imports, resolve dependencies, or guarantee compatibility with an older runtime. A smaller file usually transfers faster, but execution speed and gzip/Brotli ratios depend on the program, server settings, and client.

JavaScript Minifier & Beautifier FAQ

Does this tool support ES6+ and ES modules?

Yes. Terser parses modern ECMAScript, including classes, async functions, optional chaining, and ES modules. Select Script or ES module before processing. The ECMAScript target controls Terser output; it is not a transpiler for older browsers.

Does it support JSX or TypeScript?

No. This page accepts JavaScript and ES modules, not JSX or TypeScript syntax. Compile JSX or TypeScript to JavaScript first with the appropriate project toolchain.

Does beautifying or unminifying restore the original source?

No. Beautifying restores consistent whitespace and indentation, but it cannot recover removed comments, original formatting, source maps, or original variable names after mangling.

Is minification the same as compression or obfuscation?

No. Minification rewrites source into fewer bytes, transport compression such as gzip or Brotli encodes the delivered file, and obfuscation aims to make code difficult to understand. Mangling can make minified code less readable, but it is not a security boundary.

Is my code uploaded or stored?

Your JavaScript is processed in a Web Worker inside your browser and is never sent to Starlight Tools. The page downloads its open-source engines from a CDN. Your current input is saved in this browser's local storage until you select Clear; output is not saved.

Why does the tool use localStorage?

Local storage lets the page restore your current input after a refresh or accidental tab closure. The saved input remains on this device and origin. Select Clear to remove it, or use a private browsing window if you do not want it retained.

Can license comments be preserved?

Yes. Enable Retain license comments to keep comments beginning with /*! or containing @license, @preserve, or @cc_on. Check the downloaded result because projects can have additional licence obligations.

When should I use a build-pipeline minifier instead?

Use Terser, esbuild, Rollup, Vite, or Webpack in a repeatable build pipeline for production applications, multiple files, source maps, dependency bundling, tree shaking, tests, and automated deployments. This online tool is best for snippets, experiments, and one-off files.

Why should I test the output before deployment?

Compression and mangling can expose assumptions about function names, class names, dynamic property access, or build order. Run your tests and smoke-test the exact production file, especially after enabling Production mode, mangling, or dropping debugger statements.

Explore more tools