JavaScript Formatter & Minifier

Format a script for reading or minify it for shipping. The engines — Prettier 3.9.6 for formatting, Terser 5.44.0 for minifying — are served from this site and run in the browser, so the snippet never leaves the page.

Runs locally in your browser

How to format and minify JavaScript in the browser

Format rewrites a snippet so a person can read it; Minify rewrites it so a server sends fewer bytes. Formatting runs Prettier 3.9.6 and minifying runs Terser 5.44.0, both served from this site's own /static/vendor directory and both working on the text inside your browser tab.

The indentation selector belongs to Format alone: Tab, 2, 4 or 8 spaces, 4 by default. Formatting leaves the program alone — it changes quoting, spacing and line breaks. Minifying also compresses expressions and shortens local names, so minified output needs the same testing as any rewritten code.

  1. Paste the script into the box. Markup works too: a snippet whose first visible character is < goes to the page's HTML formatter instead.
  2. Pick an indentation — Tab Indentation, 2, 4 or 8 spaces — and press Format for readable code.
  3. Press Minify for the compact version. The line under the result reports the size, for example “128 → 77 characters · 40% smaller”.
  4. Take the result with Copy and empty the box with Clear. A snippet that cannot be parsed is answered with the engine's own message, naming the line and column.

Which engine runs behind each button, and what it changes in the code

What Format changes in a snippet

Prettier parses the script and prints it again in one fixed style: string literals come back double-quoted, missing semicolons are added, the indentation you selected is applied, and lines longer than 80 columns are split. A 300-statement function returned statement for statement with its comments intact — the layout changed and nothing else.

Printing through a parser is what makes the result predictable elsewhere: a snippet that formats here also parses in Node.js or a bundler, and one that fails fails there for the same reason. Errors are the parser's own words, such as “Unexpected token (1:8)” with the offending line marked — which is what const x: number = 1 returns, because the babel parser used for formatting does not carry the TypeScript plugin.

What Minify changes, and what to re-test

Terser makes one compression pass and mangles names inside functions; top-level names are kept, so an exported function keeps the name other modules import. Comments are dropped except banners that open with /*! or contain @license. Constant folding reaches further than renaming: a 300-line function that added up 299 constants came back as “function longName(n,e){return n+e+299}”, 11,534 characters reduced to 38.

Minified code is therefore not the code you wrote. Strings and template literals keep their contents, class private fields, optional chaining and BigInt literals survive the pass, and a template without substitutions may return as a plain string. Run the minified file once before you ship it; the size line under the result shows what the pass was worth.

Modern syntax, and where the parsers stop

Formatting handles JSX, a shebang line, import attributes such as import data from "./d.json" with { type: "json" } and top-level await. Minifying parses the snippet as a classic script first and retries as an ES module if that fails, so import, export and top-level await all minify, while sloppy-mode constructs such as with keep the script path. When both attempts fail, the message from the attempt that reached further into the file is the one displayed.

Two limits are worth knowing before pasting. TypeScript annotations are not part of the parse, so const x: number = 1 comes back as a syntax error instead of a formatted line. And Terser has no JSX parser: a JSX component formats but refuses to minify, with “Unexpected token: operator (<) (line 1, column 19)” pointing at the first tag — minify a transpiled build rather than the source.

Downloads, speed and privacy

The first Format press downloads three files from this site — Prettier standalone plus the babel and estree plugins, about 600 KB in total — and the first Minify press downloads the Terser bundle, about 1 MB. Both engines then come from the browser cache: pressing either button again makes no request at all, and the page keeps formatting with the network switched off.

A 68 KB module of 500 exported functions formatted in about 250 ms and minified in about 230 ms in desktop Chrome. Nothing you paste is uploaded: the tool's only requests are its own engine files, and the source text, the syntax tree and the result all stay in the tab.

Recent tools: