HTML Minifier — HTML-minifier

Hoe HTML-minificatie werkt

HTML-minificatie verwijdert alles wat een browser niet nodig heeft om een pagina weer te geven: inspringing en regeleinden tussen tags, opmerkingen, overbodige attribuutwaarden en standaardattributen. Deze tool gebruikt html-minifier-terser, dat je markup in tags en tekst ontleedt, de geselecteerde optimalisaties toepast en alles weer uitschrijft. Collapse whitespace voegt reeksen spaties samen en verwijdert witruimte tussen blokelementen, terwijl de enkele spaties tussen inline tekst behouden blijven. Inhoud in <pre> en <textarea> blijft onaangeroerd, omdat witruimte daar telt. Remove comments verwijdert ontwikkelaarsnotities, en de inline minifiers verkleinen ingesloten <style>- en <script>-blokken met clean-css en Terser.

De grootte-badges tonen de UTF-8-bytegrootte van de invoer en uitvoer en het bespaarde percentage. Met de hand geschreven templates met ruime inspringing worden vaak 15–30% kleiner, nog meer als ze grote inline scripts of stijlen bevatten. Servers comprimeren HTML meestal nogmaals met gzip of Brotli, dus de besparing bij de overdracht is kleiner dan het ruwe getal, maar een kleiner document wordt toch sneller geparseerd en houdt kritieke inline code compact.

De juiste opties kiezen

Remove redundant attributes is een bundel veilige opschoningen: het verkort booleaanse attributen zoals disabled="disabled" tot disabled, verwijdert standaardwaarden zoals type="text" bij invoervelden en type="text/javascript" bij scripts, laat lege attributen vallen en vervangt lange verouderde doctypes door <!doctype html>. Remove optional tags laat afsluittags zoals </li>, </p> en </body> weg die browsers volgens de HTML-specificatie zelf mogen afleiden. Remove attribute quotes verwijdert aanhalingstekens rond waarden die ze niet nodig hebben. Beide leveren geldige HTML op, maar ze kunnen andere tools verrassen die je markup lezen, daarom staan ze standaard uit.

Privé door ontwerp

De minifier wordt op aanvraag geladen en draait lokaal, dus je templates, e-mailmarkup en landingspagina's worden nooit geüpload. Dat maakt hem handig voor eenmalige klussen, zoals het verkleinen van een HTML-e-mail, een embed-snippet of een statische pagina voordat je die in een CMS plakt. Meldt de parser een fout, controleer dan de invoer op niet-gesloten tags of losse punthaken. Houd de minificatie voor productiesites in je buildpipeline, zodat het resultaat reproduceerbaar is.