HTML-Code minifizieren und Größenersparnis messen

Sichtbarer Text, Attribute, Werte in Anführungszeichen, Skripte und Stylesheets bleiben erhalten. Das Werkzeug prüft außerdem, ob gewöhnliche Elemente in der richtigen Reihenfolge geschlossen werden, und berücksichtigt sowohl standardmäßige leere HTML-Elemente als auch ausdrücklich selbstschließende Tags. Jedes erfolgreiche Ergebnis enthält das kompakte HTML, die ursprüngliche und die minifizierte UTF-8-Bytezahl, die prozentuale Ersparnis und die Anzahl entfernter Kommentare. Die Verarbeitung ist deterministisch, benötigt keine Netzwerkverbindung und ist eine vorsichtige Alternative zu aggressiven Änderungen am Markup.

Entfernen Sie Formatierung, ohne Inhalte zu löschen

Gut lesbares HTML enthält häufig Einrückungen, Leerzeilen und erklärende Kommentare. Diese erleichtern die Pflege eines Dokuments, vergrößern jedoch die ausgelieferte Ressource. Diese Fähigkeit entfernt gewöhnliche HTML-Kommentare und löscht reine Leerraum-Textknoten, wenn sie zwischen zwei Markup-Tags stehen. Text mit mindestens einem anderen Zeichen bleibt bewusst erhalten, denn ein Leerzeichen in sichtbarem Text kann Wörter trennen und für Layout oder Barrierefreiheit bedeutsam sein. Attributwerte werden nicht verändert. Das gilt auch für Werte in Anführungszeichen, die spitze Klammern, Leerzeichen, kommentarähnliche Folgen oder eingebettete Daten enthalten. Der Scanner liest jeden vollständigen Tag und beachtet dabei Anführungszeichen, statt beim ersten Größer-als-Zeichen anzuhalten. Inhalte von script und style werden gesondert behandelt: Sie werden bis zum passenden schließenden Tag unverändert kopiert. Vergleichsoperatoren, Zeichenketten, CSS-Selektoren und interne Kommentarsyntax werden deshalb nicht mit HTML-Markup verwechselt. Sie können das zurückgegebene Feld html als Bereitstellungsartefakt speichern und die lesbare Quelle weiterhin in der Versionsverwaltung pflegen. Dieser vorsichtige Umfang verzichtet auf das Umsortieren von Attributen, die Normalisierung von Text, das Dekodieren von Entitäten, das Weglassen von Tags und andere Änderungen, die das Browserverhalten beeinflussen könnten.

Erkennen Sie unvollständiges oder falsch verschachteltes Markup

Eine Minifizierung darf eine abgeschnittene Vorlage niemals als produktionsbereite Datei erscheinen lassen. Beim Lesen des Dokuments merkt sich die Fähigkeit jedes gewöhnliche öffnende Element und verlangt, dass die Elemente in umgekehrter Reihenfolge geschlossen werden. Wird beispielsweise zuerst ein div und danach ein span geöffnet, muss das span vor dem div enden. Ein unerwarteter schließender Tag, ein unvollständiger Tag, ein nicht abgeschlossener Kommentar oder ein am Ende noch offenes Element führt zu einem Fehler wegen ungültiger Eingabe und nicht zu einer Teilausgabe. Standardmäßige leere Elemente wie img, input, meta, link, br, hr, source und wbr benötigen keinen schließenden Tag. Ausdrücklich selbstschließende Syntax wird ebenfalls für jedes benannte Element akzeptiert. Damit lassen sich XML-förmige Fragmente und Komponentenausgaben mit abschließendem Schrägstrich verarbeiten. Diese Prüfung ist bewusst eine strukturelle Validierung und kein vollständiger Konformitätstest für die HTML-Spezifikation. Der Algorithmus ergänzt insbesondere keine optionalen End-Tags und repariert kein Markup, das Browser möglicherweise tolerieren. Wenn Ihre Quelle schließende Tags für Absätze oder Listenelemente auslässt, fügen Sie diese vor dem Senden ausdrücklich ein. Die strenge Regel erleichtert das Erkennen fehlerhafter Vorlagenausgaben und sorgt für vorhersehbare Resultate in unterschiedlichen Automatisierungsumgebungen.

Messen Sie Einsparungen in einem reproduzierbaren Ablauf

Die Antwort misst sowohl die eingereichte Quelle als auch das kompakte Ergebnis in UTF-8-Bytes. Dies bildet die Speicher- und Übertragungsgröße gewöhnlicher HTML-Ressourcen genauer ab als eine JavaScript-Zeichenzählung. Der Unterschied ist wichtig, wenn das Markup Akzente, nichtlateinische Schriften, Emoji oder andere Zeichen enthält, die mehrere Bytes benötigen. reduction_percent wird aus diesen exakten Summen berechnet und auf zwei Dezimalstellen gerundet. comments_removed zeigt zusätzlich, wie viele vollständige HTML-Kommentare gelöscht wurden. Ein Generator für statische Websites kann jede gerenderte Seite verarbeiten, den zurückgegebenen html-Wert speichern und die Messwerte im Buildbericht festhalten. Eine Vorlagenpipeline kann bei Strukturfehlern die Veröffentlichung stoppen, sobald erzeugtes Markup abgeschnitten oder falsch verschachtelt ist. Da die Verarbeitung rein und deterministisch erfolgt, liefert dieselbe Eingabe immer dieselbe Ausgabe und dieselben Messwerte, ohne Netzwerkaufrufe, externe Abhängigkeiten, Zufall oder zeitabhängiges Verhalten. Jede automatisierte API-Anfrage kostet $0.002. Die Operation komprimiert keine Transportdaten, bündelt keine verknüpften Ressourcen, optimiert kein eingebettetes JavaScript oder CSS und ändert nicht die Dokumentsemantik. Anschließend können Sie eine Serverkompression wie Brotli verwenden, um die Übertragungsgröße weiter zu reduzieren.