JavaScript Formatter
Untangle minified or messy scripts, or minify them with Terser so they still behave the same. Working on CSS? Switch to the CSS Formatter.
Input
Output
How this one works
Beautify re-indents JavaScript, puts statements on their own lines and adds spacing around operators, which is what you want for reading a minified bundle or a one-line snippet from a log. It doesn't rename anything, so the code is exactly as it was, just readable.
Minify uses Terser, the same minifier most build tools use. It removes comments and whitespace, shortens local variable names and simplifies expressions, while keeping behaviour the same. Terser is only loaded the first time you switch to Minify.
Questions
Can this restore original variable names in minified code?
No. Once a minifier has renamed variables, the original names are gone from the file. Beautify makes the structure readable again; if you need the real names, look for the project's source map.
Why not just strip the whitespace to minify?
Because JavaScript inserts semicolons at line breaks in some cases, removing newlines naively can change what the code does. Terser parses the code first, so the result is guaranteed to be valid and equivalent.
Is my code uploaded?
No. Both beautifying and minifying run in your browser. Nothing is sent to a server, and the code isn't saved anywhere once you close the tab.