JavaScript Formatter & Beautifier

Free online JavaScript Formatter and Beautifier. Clean and indent JavaScript and TypeScript snippets, format objects and functions, minify code for production, with client-side privacy.

JavaScript Formatter & Beautifier

Format, clean up scopes, and minify JS and TS scripts

Presets:

Indent:

Raw JS / TS Input

1 lines • 588 chars

Formatted Script

28 lines • 770 chars

async function fetchWithRetry(url, options= {
}
, maxRetries=3) {
  let delay=500;
  for(let attempt=1; attempt<=maxRetries; attempt++) {
    try {
      const response=await fetch(url, {
        ...options, headers: {
          'Content-Type':'application/json', ...options.headers
        }
      })
      ;
      if(!response.ok) {
        throw new Error(`Request failed with status ${response.status}`);
      }
      return await response.json();
    }
    catch(error) {
      if(attempt===maxRetries) {
        console.error('All retry attempts exhausted:', error);
        throw error;
      }
      console.warn(`Attempt ${attempt} failed, retrying in ${delay}ms...`);
      await new Promise((resolve)=>setTimeout(resolve, delay));
      delay*=2;
    }
  }
}

Developer Scenario: Formatting an Obfuscated Event Handler

A developer unpacks a compacted JavaScript helper function from a bundle to debug asynchronous data fetching and error handling.

Minified Input	async function fetchData(url,retries=3){for(let i=0;i<retries;i++){try{const res=await fetch(url);if(!res.ok)throw new Error(`HTTP ${res.status}`);return await res.json();}catch(err){if(i===retries-1)throw err;await new Promise(r=>setTimeout(r,10002*i));}}}
Formatted Output	async function fetchData(url, retries = 3) { for (let i = 0; i < retries; i++) { try { const res = await fetch(url); if (!res.ok) { throw new Error(`HTTP ${res.status}`); } return await res.json(); } catch (err) { if (i === retries - 1) { throw err; } await new Promise((r) => setTimeout(r, 1000 * 2 ** i)); } } }

💡 The reformatted code clearly highlights loop retry logic, exponential backoff, and exception boundaries for safe code review.

How to use JavaScript Formatter & Beautifier

1
Paste your unformatted, minified, or messy JavaScript or TypeScript code into the input editor, or choose from realistic code presets.
2
Choose your preferred indentation size (2 spaces, 4 spaces, or Tab) and formatting preferences.
3
Click Beautify to neatly format functions, nested blocks, arrays, and objects, or click Minify to compact code into a single line.
4
Copy the formatted script to your clipboard or download it as a .js file.

Why use this tool?

Full ESNext & TypeScript Syntax Support

Handles async/await, arrow functions, object destructuring, optional chaining, nullish coalescing, and modern syntax patterns seamlessly.

Accurate Block & Bracket Indentation

Tracks nested scopes across curly braces, parentheses, and brackets for consistent, readable code structure.

Instant Single-Line Minifier

Quickly strip whitespace and comments for quick one-line scripts or bookmarklet distribution.

Frequently asked questions

Can this tool format TypeScript and modern ESNext code?

Yes. It cleanly formats modern ECMAScript, TypeScript syntax, async functions, arrow functions, and nested object literals.

Is my source code uploaded or stored anywhere?

No. All JavaScript formatting and minification take place locally inside your browser sandbox. None of your source code ever leaves your machine.

Does minification break string literals or regexes?

No. The minifier carefully preserves quoted strings (single, double, and template literals) as well as regular expression literals.

Related tools

Developer Tools

JavaScript Formatter & Beautifier