HTML Minifier
Collapses whitespace and removes comments, leaving pre and script blocks alone.
Results
What this tool does
HTML written by hand carries indentation that exists only for the person reading the source. A browser does not need it, and on a large page it can be a tenth of the bytes. The care needed is in knowing where whitespace matters: inside a pre block it is the whole point, inside a script it might be inside a string, and between two inline elements it is a visible word gap. This leaves all three alone.
Formula
collapses whitespace, except inside pre, textarea, script and style
Variables
| Symbol | Meaning | Unit |
|---|---|---|
text | HTML | — |
OUT | Minified | — |
SB | Size before | B |
SA | Size after | B |
SV | Bytes saved | B |
SP | Share saved | % |
Worked example
- HTML<!-- cabeçalho --> <div class="caixa"> <p> Olá </p> <pre> isto fica </pre> </div>
- Minified<div class="caixa"> <p> Olá </p> <pre> isto fica </pre> </div>
- Size before93 B
- Size after64 B
- Bytes saved29 B
- Share saved31.18 %
Limitations
- The calculation runs entirely in your browser. The values you type are never sent to a server.
Frequently asked questions
Why does it leave a space between tags?
Because in HTML a space between two inline elements is visible, and removing it changes the page. <span>a</span> <span>b</span> reads as "a b"; take the space out and it reads as "ab". A minifier that removes every space between tags breaks exactly this, and the bug is easy to miss because it only shows up on inline content. Whitespace between block-level tags is collapsed, and inside pre, textarea, script and style nothing is touched at all.