HomePluginsToolsGuidesPortfolioWorkflowAboutWork with usContact
GetSet

We build and fix production web applications, and publish the UI packages and free browser tools on this site.

info@get-set.it

Explore

  • Plugins
  • Tools
  • Guides
  • Portfolio

Company

  • About
  • Workflow
  • Work with us
  • Contact

Legal

  • Terms
  • Privacy
  • Accessibility
  • Cookies

© 2026 GetSet

We're on npm

Your Bundle

Your bundle is empty

Add plugins from the catalog to build one combined CDN link — like picking font families.

Browse plugins
Guides / Code

Minify vs Beautify: What Code Formatting Actually Does to Your Files

What minifiers really remove, why gzip changes the math, when formatting is a correctness issue, and how source maps let you have both.

By the GetSet engineering team · Published 2026-08-06 · 6 min read · Related tool: CodeFormat

Two directions, one goal: the right form for the reader

Beautifying targets human readers: consistent indentation, line breaks, spacing. Minifying targets machines: strip whitespace and comments, shorten identifiers, drop dead code. The same JavaScript file might be 120 KB beautified, 45 KB minified, and 14 KB minified-then-gzipped. Neither form is "correct" — each serves a different consumer.

What minification actually removes

  • Whitespace and comments — free wins, zero risk.
  • Identifier mangling — local variable names shrink to one letter; safe because scope is analyzable.
  • Dead-code elimination — unreachable branches and unused exports get dropped (this is where tree-shaking lives).
  • Expression rewriting — true becomes !0, undefined becomes void 0; semantically identical, byte-cheaper.

What it must *not* remove: license comments (most minifiers preserve /*! blocks), and anything reached via dynamic access like window[name] — the classic cause of "works in dev, breaks in prod" bugs.

Gzip changes the arithmetic

Because servers compress responses, minification saves less than raw byte counts suggest — repeated long identifiers compress extremely well. Minification before gzip typically still saves a real 30–50% over gzip alone for JS and CSS, but it means aggressive micro-tricks matter less than dead-code elimination, which removes bytes gzip would otherwise still ship.

When formatting is a correctness issue

In most languages formatting is style; in a few it is semantics. YAML meaning changes with indentation. Python blocks are indentation. JavaScript automatic semicolon insertion means a line break before ( or [ can change what a statement does. Minifying JSON is always safe (whitespace is insignificant), but "minifying" YAML is not a thing you should ever do.

Format, beautify and minify 24+ languages — JSON, YAML, SQL, HTML, CSS, JS/TS, Python and more — instantly in your browser with CodeFormat. It ships Prettier under the hood, works offline, and nothing you paste is uploaded.

Formatters versus linters: different jobs

A formatter (Prettier, Black, gofmt, rustfmt) rewrites whitespace and punctuation to a canonical style and is deliberately un-opinionated about what your code *does*. A linter (ESLint, Ruff, Clippy) flags probable bugs and style violations but generally does not rewrite. The modern setup runs both: the formatter on save or in a pre-commit hook so that style never appears in code review, and the linter in CI so that unused variables and accidental == comparisons never ship. Teams that argue about tabs vs spaces have simply not adopted a formatter yet — once the tool decides, the argument ends.

One practical consequence: format the whole codebase in a single dedicated commit and record it in a .git-blame-ignore-revs file, so git blame skips it. Otherwise every line looks like it was last touched by "reformat" forever.

Bundle size: what minification can and cannot save

If a production bundle is 2 MB, minification is not the problem — dependencies are. Minifiers typically remove 40–60% of the *text*, but a 900 KB charting library you use for one sparkline stays a 400 KB minified library. The order of operations that actually shrinks bundles: measure first (a bundle analyzer shows which packages dominate), replace heavy dependencies with lighter ones or native APIs, split code so routes load only what they need, and *then* minify and compress. Minification is the last 30%, not the first.

  • Ship modern syntax to modern browsers — transpiling everything to ES5 inflates output 20–40% for users who do not need it.
  • Tree-shaking only works on ES modules with no side effects; one import of a CommonJS package can pull the whole thing in.
  • Brotli beats gzip by 15–20% on JS and CSS and is supported everywhere; check your host actually serves it.

Source maps: ship minified, debug beautified

A source map is a JSON sidecar that maps positions in minified output back to original source. Browsers load it only when DevTools is open, so production users pay nothing while your stack traces stay readable. The practical rule: always generate source maps, and decide separately whether to deploy them publicly (transparent, but exposes source) or keep them internal for error-reporting services.

Keep reading

Images

WebP vs AVIF vs PNG vs JPG: Choosing the Right Image Format in 2026

7 min read
Data

CSV, JSON and XLSX: The Conversion Pitfalls That Corrupt Your Data

8 min read
CSS

Glassmorphism, Gradients and Shadows: Modern CSS Effects Done Right

7 min read

We write these guides from our client work. If you’d rather have it built than explained, we’re available.

Work with us Contact us