JavaScript Minifier — JavaScript-Minifizierer

So funktioniert die JavaScript-Minifizierung

Minifizierung macht JavaScript kleiner, ohne sein Verhalten zu ändern. Dieses Tool verwendet Terser, einen ausgereiften Minifizierer, der deinen Code in einen abstrakten Syntaxbaum zerlegt, ihn umformt und ohne überflüssige Leerzeichen und Kommentare wieder ausgibt. Der Schritt compress wendet Dutzende Optimierungen an: Er entfernt unerreichbaren Code und ungenutzte Variablen, setzt Konstanten direkt ein, fasst aufeinanderfolgende Variablendeklarationen zusammen, wandelt if-Anweisungen nach Möglichkeit in kürzere bedingte Ausdrücke um und berechnet einfache konstante Ausdrücke bereits vorab. Anschließend benennt der Schritt mangle lokale Variablen, Parameter und Funktionsnamen in ein oder zwei Buchstaben um. Eigenschaftsnamen und globale Variablen bleiben unangetastet, sodass das öffentliche Verhalten deines Codes gleich bleibt.

Die Größenanzeigen zeigen die UTF-8-Bytegröße von Eingabe und Ausgabe sowie die prozentuale Ersparnis. Typischer handgeschriebener Code schrumpft um 40–70 %; bereits kompakter Code oder Code mit vielen langen Zeichenketten schrumpft weniger. Beachte, dass Server JavaScript meist zusätzlich mit gzip oder Brotli komprimieren. Die tatsächliche Ersparnis bei der Übertragung ist daher kleiner als der Rohwert, doch minifizierter Code wird trotzdem schneller geparst und verbraucht weniger Bandbreite.

Die richtigen Optionen wählen

Das ECMAScript target legt fest, welche Syntax Terser in der Ausgabe verwenden darf. Mit ES2020 kann es Pfeilfunktionen, Optional Chaining und andere moderne Formen erzeugen; mit ES5 vermeidet es neuere Syntax, transpiliert aber keinen modernen Code, den du selbst geschrieben hast – dafür brauchst du ein Tool wie Babel oder esbuild. Keep console.* erhält Log-Ausgaben, was für Staging-Builds praktisch ist. Aktiviere ES module für Dateien, die import/export verwenden; dann können auch Namen auf oberster Ebene gekürzt werden, weil der Modul-Scope privat ist.

Privat by Design

Der Minifizierer wird bei Bedarf geladen und läuft lokal, dein Quellcode wird also nie hochgeladen. Damit eignet er sich gut für schnelle einmalige Aufgaben, etwa um ein Inline-Skript, ein Bookmarklet oder ein Snippet für einen Tag-Manager eines Drittanbieters zu verkleinern. Meldet Terser einen Syntaxfehler, enthält die Meldung Zeile und Spalte, damit du die Eingabe korrigieren kannst. Für Produktions-Bundles solltest du die Minifizierung in deiner Build-Pipeline belassen, damit sie reproduzierbar ist, und Source Maps für das Debugging erzeugen.