Free JavaScript Beautifier & Minifier

How this tool computes its result

Beautification: tracks quote state (single, double, template backtick) to avoid reformatting inside strings, then adds newlines after { ; and , characters, manages indentation with a counter that increments after { and decrements before }, collapses excess whitespace and blank lines at the end. Minification: first strips all // line comments and /* block comments */ (respecting quote states), then removes all whitespace and adds compact spacing around operators and punctuation via regex replacements, removing redundant ;} sequences.

Worked example

Minifying "const x = { name : "test" } ; console.log(x);" (before minification, multi-line with comments): produces "const x={name:"test"};console.log(x);". Beautifying "const x={name:"test"};console.log(x);" produces formatted output with newlines after braces and 2-space indentation.

When not to use this tool

This is a simple heuristic beautifier - it does not use a full JavaScript parser (AST), so it may mishandle edge cases like regex patterns that look like division (`/ /`), template literals with embedded expressions, or unusual formatting; for production minification, use a proper tool like Terser or esbuild.

Common mistakes

• - Pasting minified code into the beautifier and expecting a readable result - without a full parser, beautification is line-based and heuristic; complex inline code may not format well.
• - Assuming minification preserves semantics for all JavaScript - minification removes comments and whitespace but does not rename variables or apply optimizations, so very long variable names are not shortened; use a full minifier for that.
• - Copying minified output directly into a <script> tag in HTML without checking for comment-stripping edge cases - the minifier assumes comments are safe to strip, but custom comment syntax or regex-like patterns might be misinterpreted.

Related tools