JavaScript Formatter & Minifier

Beautify JS/TS with clean indentation, or minify it with terser and see the bytes saved.

The JavaScript Formatter beautifies JS and TypeScript with consistent indentation and brace style, then minifies it with terser — compressing and mangling names for the smallest output and showing the bytes saved. Terser is loaded on demand and runs entirely in your browser.

  • Beautify JavaScript and TypeScript
  • Minify with terser (compress + mangle)
  • See the exact bytes saved
  • 100% private — code is never uploaded

Beautify or Minify JavaScript

Paste JavaScript (or TypeScript) and it's beautified with consistent indentation and brace style as you type. Click Minify to run it through terser — compressing and mangling names for the smallest output — and see how many bytes you saved. Everything runs in your browser, so your code is never uploaded.

How to Format JavaScript Online

  1. 1Paste raw, pasted-from-elsewhere, or minified JS/TS into the input panel
  2. 2Choose an indent size for beautified output
  3. 3Click Format to beautify, or Minify to compress it with terser
  4. 4Copy or download the result

Example

Input (single line):

function greet(name){if(!name){name='World'}return 'Hello, '+name+'!'}

Beautified:

function greet(name) {
  if (!name) {
    name = 'World'
  }
  return 'Hello, ' + name + '!'
}

Minified (terser — compressed and mangled):

function greet(e){return e||(e="World"),"Hello, "+e+"!"}

Features

Consistent indentation

Braces, function bodies and nested blocks are reflowed to a clean, uniform style.

Real minification with terser

Not just whitespace removal — terser compresses logic and mangles local variable names.

Bytes-saved report

See the exact size reduction after minifying, useful for judging bundle-size impact.

Works with TypeScript syntax

Beautify handles TS syntax for readability; minify targets plain JavaScript output.

Loaded on demand

Terser is only downloaded when you click Minify, keeping the page itself lightweight.

100% private

Both beautify and minify run entirely client-side — your source is never uploaded.

Who Uses This

  • Frontend developersbeautify a minified third-party script or vendor bundle to understand or debug what it does.
  • Developers pasting AI/Stack Overflow snippetsreformat inconsistent code before dropping it into a project.
  • Anyone shipping a small scriptminify a standalone JS file with terser and confirm the size reduction before deploying.
  • Code reviewersexpand a minified diff back into readable form to understand what actually changed.

Frequently Asked Questions

Yes. Terser is loaded on demand and runs entirely in your browser. Your source code never leaves your device.

Terser parses the code before minifying. If it reports an error, the input has a JavaScript syntax problem — beautifying still works to help you spot it.

Beautifying works for TypeScript syntax. For minification, strip types first (terser minifies JavaScript), or minify the compiled output.

Mangling renames local variables to short names to reduce size. It's safe for self-contained code but avoid it if you rely on specific runtime variable names.

Beautify handles general JS/TS syntax well, but it isn't a full Babel-based formatter, so complex JSX expressions may not always format exactly as Prettier would.

No. Terser compresses and renames code but doesn't strip logging or debugger statements unless you explicitly configure that — this tool keeps them by default.

No hard limit — both beautifying and minifying run in your browser, so performance depends on your device rather than a server-imposed cap.

Related Tools