Example
Input (minified JS)
function add(a,b){return a+b}const result=[1,2,3].map(x=>x*2).filter(x=>x>2);console.log(result);Output (formatted)
function add(a, b) {
return a + b
}
const result = [1, 2, 3]
.map(x => x * 2)
.filter(x => x > 2);
console.log(result);Note
Whitespace only — variable names and logic are untouched. For accurate minification use a dedicated tool like terser.
Usage / FAQ
When to use
- Restore readability of minified bundle.js for debugging
- Indent AI-generated one-liner JS / inline functions
- Tidy JS before pasting into issues, Slack, or Notion
- Visualize complex method chains and arrow functions
- Use minify mode for a first-pass production compress
FAQ
- Q.Does this replace a real minifier?
- A.No — this tool only handles indentation. For true production minify (name mangling, dead-code elimination, …) use terser, esbuild, or swc.
- Q.Does it handle TypeScript?
- A.It is JS-beautify based. TS-only syntax (`as`, generics like `<T>`) can produce incorrect results. Use Prettier or Biome for proper TS formatting.
- Q.What about JSX?
- A.Plain JS is the baseline; JSX often works but complex structures may not look great.
Fun facts
JavaScript was created by Brendan Eich at Netscape in 1995 — in 10 days. A marketing brief to 'make it look like Java' is why the syntax resembles Java, while the semantics are Scheme + Self. That mismatch produced lasting hazards like ASI (Automatic Semicolon Insertion).
Brendan Eich — PopularityBefore Prettier (2017, James Long), 'tabs vs spaces' and 'semicolons vs no semicolons' fights had dragged on for decades. Prettier's slogan, 'opinionated,' is the deliberate position — end the debate at the tool level by making options minimal.
Prettier 0.0.10 releaseLinter and formatter aren't the same — ESLint-style linters catch bug-prone patterns, while Prettier-style formatters enforce visual consistency. The modern JS stack runs both, with `eslint-config-prettier` resolving rule conflicts between them.
Prettier — vs Linters
Related guides
- How JavaScript Is Parsed and Executed
From source bytes to V8 hidden classes — lexer, parser, AST, hoisting, the event loop, ASI gotchas, and the optimizations that make JavaScript fast despite being a dynamic language.
- How Bundlers Actually Work (Webpack, Vite, esbuild, Turbopack)
What bundlers do beyond "glue files together" — module resolution, dependency graphs, tree shaking, code splitting, source maps, HMR, and why Vite is 100× faster than Webpack in dev.
Related tools
- JSON Formatter / Validator
Format, validate, and minify JSON strings. Adjust indent and optionally sort keys. Runs entirely in your browser.
- String Case Converter
Convert strings between camelCase, PascalCase, snake_case, kebab-case, CONSTANT_CASE, and Title Case — all six cases shown side-by-side.
- Regex Tester
Test JavaScript regular expressions with live match results. Supports g/i/m/s/u/y flags and capture groups.
- Markdown Preview
Render Markdown to HTML side-by-side. Supports CommonMark + GFM (tables, fenced code, task lists). marked is lazy-loaded.
- HTML → Markdown
Convert HTML into Markdown. Headings, lists, links, code, tables, blockquotes. Uses the browser's DOMParser — accurate, 0 dependency.
- YAML ↔ JSON
Convert between YAML and JSON. Tolerates comments and multiline strings on the YAML side. yaml is lazy-loaded.
- Text Diff
Compare two texts and highlight added/removed lines, words, or characters.
- JSON Diff
Compare two JSON values, with optional key sorting and JSON-aware error messages.
- CSV ↔ JSON
Convert between CSV and JSON. Handles quoted fields, custom delimiters, and header rows.
- SQL Formatter
Format SQL queries with proper indentation and keyword casing. Supports PostgreSQL, MySQL, SQLite, and standard dialects.
- XML Formatter
Pretty-print or minify XML with attribute preservation. Handles SOAP, sitemaps, and config files.
- XML ↔ JSON
Convert between XML and JSON with attribute and element handling.
- Smart Paste
Paste any text and get tool recommendations — JSON, JWT, Base64, URL, UUID, Cron, and 9 more types auto-detected.
- Lorem Ipsum
Generate placeholder text in words, sentences, or paragraphs. Classic Lorem Ipsum or randomized.
- JSON Path
Query JSON with JSONPath expressions ($.store.book[*].author etc.) and inspect matches.
- JSON Schema Validator
Validate JSON data against a JSON Schema (Draft 2020-12). Powered by Ajv with format support.
- JSON Schema Generator
Generate a JSON Schema (Draft 2020-12) from a sample JSON. Infer types, required fields, and nested structures automatically.
- HTML Formatter
Beautify or minify HTML with proper indentation, attribute alignment, and configurable wrap.
- CSS Formatter
Beautify or minify CSS with proper indentation. Configurable selector and property style.
- TOML ↔ JSON
Convert between TOML (Tom's Obvious Minimal Language) and JSON. Used in Cargo.toml, pyproject.toml, etc.
- INI ↔ JSON
Convert INI configuration to JSON and back. Supports sections, comments (; or #), and key=value.
- JSON → TypeScript
Generate TypeScript interfaces from a JSON sample. Nested objects become separate interfaces.
- JS Object → JSON
Convert a JavaScript object literal (unquoted keys, single quotes, trailing commas, comments) into standard JSON. Lenient parser, strict output.
- Slug Generator
Convert text into a URL-safe slug. Configurable separator, lowercase, and accent stripping.
- ASCII Tree
Convert indented text or path list into a box-drawing tree (├── │ └──).
- Diff Patch
Generate a unified diff (-u) patch from two text inputs. Compatible with `git apply` / `patch -p0`.
- Mock Data
Generate fake JSON records and SQL INSERT seed data — names, emails, custom fields, UUIDs, dates, and more. 0 dependency.
- MongoDB Extended JSON
Convert MongoDB Extended JSON (EJSON) between Canonical and Relaxed forms, or strip BSON wrappers to plain JSON. Recognizes 16 wrapper types ($oid/$date/$numberLong/$numberDecimal/$binary/...).
- Kubernetes YAML Visualizer
Paste Kubernetes manifests and see the resource graph — Deployments, Services, Ingresses, ConfigMaps, Secrets, PVCs, and how they connect. yaml is lazy-loaded.
- Docker Compose Visualizer
Paste docker-compose.yml and see services, networks, volumes, and depends_on as an interactive graph. Client-side, lazy-loaded yaml.
- PDF Text Extractor
Extract text from a PDF file — page by page or as a single document. Markdown-friendly output, all client-side.
- PPTX Text Extractor
Extract slide text from a .pptx file — plain / markdown / per-slide. Great for converting decks to markdown. All client-side.
- Regex Railroad Diagram
Visualize your regex as a railroad diagram — trace branches, groups, and quantifiers at a glance, in your browser.
- Word & Character Counter
Count characters (with/without spaces), words, sentences, paragraphs, lines, and bytes in real time — free, in your browser.