JavaScript minifizieren
Kleinere Dateien, gleiches Verhalten
Hier können Sie JavaScript minifizieren, ohne dass sich das Verhalten Ihres Codes ändert: Das Online-Tool parst ihn, kürzt die Namen, entfernt Unerreichbares und gibt eine viel kleinere Datei zurück. Fügen Sie zuerst Ihr Skript ein oder legen Sie Ihre Dateien ab. Starten Sie dann die passende Aktion. Kopieren Sie schließlich das Ergebnis, denn die ganze Arbeit passiert in diesem Tab.
- KostenlosPreis
- Nicht nötigKonto
- KeineUploads
- Bei jedem DurchlaufGeprüft
JavaScript-Minifier
Code einfügen oder Dateien ablegen — nichts wird hochgeladen
Minifiziertes Ergebnis
- Original
- —
- Minifiziert
- —
- Gespart
- —
- Mit gzip
- —
- Gekürzte Namen
- —
- Dauer
- —
Bereit. Fügen Sie Ihr JavaScript ein und drücken Sie dann Minifizieren oder Verschönern.
Was bedeutet es, JavaScript zu minifizieren?
Ein JavaScript-Minifier nimmt eine Datei, die Sie für Menschen geschrieben haben, und schreibt sie für den Download durch einen Browser um. Ihre Kommentare gehen. Ihre Einrückung geht. Ihre langen, sprechenden Namen werden kurz. Der Code selbst tut jedoch genau dasselbe wie vorher, denn nichts davon ändert, was das Programm bedeutet.
Die Ersparnis ist echt. Ein lesbares Skript besteht größtenteils aus Abständen und Namen, und beides sind Bytes, die Ihre Besucher bei jedem Besuch bezahlen. Deshalb kommt eine Datei, die von 40 KB auf 18 KB schrumpft, schneller auf einem Handy, über eine langsame Verbindung und am anderen Ende der Welt an.
Dieser Minifier parst Ihren Code, statt zu raten. Er baut einen Syntaxbaum, benennt um, was sicher umbenannt werden kann, löscht, was nichts erreichen kann, rechnet vorab aus, was sich vorab ausrechnen lässt, und liest dann seine eigene Antwort zur Kontrolle erneut. Die folgenden Abschnitte erklären jeden Schritt, auch wo er bewusst aufhört.
Ein Minifier steht und fällt damit, wo Anweisungen wirklich enden. Die MDN-Referenz zur lexikalischen Grammatik von JavaScript ist das Regelwerk dafür.
Wann Sie JavaScript minifizieren sollten
Minifizieren Sie am Ende, nie am Anfang. Sie wollen die lesbare Datei im Editor und die kleine auf dem Server. Behalten Sie also das Original, veröffentlichen Sie die Ausgabe und bearbeiten Sie die minifizierte Kopie nie von Hand.
Am wichtigsten ist es bei den Skripten, die jede Seite lädt. Zum Beispiel verdient ein gemeinsames Bundle, das jeder Besucher lädt, mehr Aufmerksamkeit als ein Skript auf einer Seite, die niemand öffnet.
Was dieser JS-Minifier nicht tut
Er benennt nichts um, dessen Sicherheit er nicht beweisen kann. Enthält Ihre Datei einen `with`-Block oder einen direkten eval-Aufruf, kann ein Name zur Laufzeit als String gesucht werden, und dem kann kein Parser folgen. In solchen Dateien schaltet sich die Umbenennung für die ganze Datei ab, und das Tool sagt Ihnen, warum, statt eine Umbenennung auszuliefern, die in der Produktion bricht.
Er benennt Ihre Namen auf oberster Ebene nicht um, außer Sie setzen das Häkchen. Eingefügter Code ist meist ein klassisches Skript, in dem eine Funktion auf oberster Ebene zu einer Eigenschaft von window wird, die eine andere Datei beim Namen aufrufen kann. In einem Modul oder einer IIFE kann dagegen nichts von außen diese Namen erreichen, also bringt der Schalter dort Bytes gratis.
Er rührt keine globalen Namen oder Browser-APIs an. window, document und console gehören nicht Ihnen, also bleiben sie genau so stehen, zusammen mit allem, was importiert, exportiert oder in der übergebenen Datei nie deklariert wurde.
Ein Hinweis zu Source Maps
Dieses Tool schreibt noch keine Source Maps, daher nennt ein Stacktrace aus umbenannter Ausgabe Funktionen bei ihren kurzen Namen. Brauchen Sie lesbare Traces dringender als die letzten Bytes, schalten Sie die Umbenennung aus; die übrigen Durchgänge laufen trotzdem, und Sie behalten Ihre Originalnamen.
Auf dieser Seite
- Das Tool
- Was bedeutet es, JavaScript zu minifizieren?
- JavaScript in vier Schritten minifizieren
- Ein JavaScript-Minifier, der seine eigene Arbeit prüft
- Das Beste aus diesem JS-Minifier herausholen
- Fehler, die einen minifizierten Build zerstören
- Häufige Fragen zum JavaScript-Minifier
- Weitere Tools, die Sie sofort nutzen können
Weiterlesen
JavaScript in vier Schritten minifizieren
Ohne Software, ohne Registrierung, ohne Warteschlange. Das Ganze läuft in dem Tab, den Sie schon offen haben.
- 1
Code hinzufügen
Fügen Sie ein Skript in den Editor ein oder legen Sie Ihre .js-Dateien im Upload-Tab ab. Beide Wege funktionieren gleich.
- 2
Wählen, was wegfällt
Kommentare fallen standardmäßig weg, und auch Umbenennung, Entfernen ungenutzten Codes und Konstantenfaltung sind aktiv. Außerdem können Sie console-Aufrufe und debugger-Anweisungen entfernen, wenn Sie in die Produktion ausliefern.
- 3
Minifizieren drücken
Das Tool parst Ihre ganze Datei, schreibt den Baum neu und liest dann seine eigene Antwort erneut, bevor es sie Ihnen zeigt.
- 4
Kopieren oder herunterladen
Nehmen Sie das Ergebnis als Text oder speichern Sie es als .min.js-Datei. Dabei bleibt Ihr Original genau so, wie Sie es verlassen haben.
Ein JavaScript-Minifier, der seine eigene Arbeit prüft
Die meisten Tools geben Ihnen eine Datei und hoffen. Dieses liest das Ergebnis dagegen erneut, bevor Sie es überhaupt sehen.
Es prüft jeden Durchlauf
Nach dem Minifizieren parst es seine eigene Ausgabe wieder zu einem Syntaxbaum und prüft ihn gegen Ihr Original: jeden Namen, auf den der Code noch zugreift, und die Form des Baums selbst. Ist etwas abgewichen, sagt es das und gibt Ihnen Ihr Original zurück, statt zu schweigen.
Es versteht echte Syntax
Template-Literale, reguläre Ausdrücke, Klassenfelder, Optional Chaining und BigInt werden richtig gelesen. Deshalb wird ein Schrägstrich nie mit einem Kommentar verwechselt.
Es respektiert Semikolons
Wo JavaScript ein Semikolon für Sie einfügt, bleibt der Zeilenumbruch. Da dieser Umbruch ein Byte kostet, ist das Behalten kostenlos und außerdem sicherer.
Nichts verlässt Ihren Tab
Ihr Code verlässt nie den Tab. Es gibt keine Anfrage, keinen Speicher und kein Protokoll, deshalb können Sie sogar private Arbeit hier sicher einfügen.
Es behält Ihre Lizenzen
Banner-Kommentare, die mit einem Ausrufezeichen, @license oder @preserve markiert sind, bleiben in der Datei. Daher können Sie Code minifizieren, dessen Urheber Sie nennen müssen.
Es zeigt die echte Zahl
Sie sehen die gzip-Größe zusätzlich zur Rohgröße, denn gzip ist das, was tatsächlich zu Ihrem Besucher reist.
Das Beste aus diesem JS-Minifier herausholen
Ein paar kleine Gewohnheiten halten einen minifizierten Build berechenbar.
- Das Original behalten. Bearbeiten Sie immer die lesbare Datei. So bleibt die minifizierte Kopie etwas, das Sie erzeugen, nie etwas, das Sie pflegen.
- Zuletzt minifizieren. Führen Sie es nach Ihrem Bundler und nach Ihren Tests aus. Sonst testen Sie eine Datei und liefern eine andere aus.
- Mit gzip ausliefern. Minifizieren und Komprimieren addieren sich. Dadurch liegt die Übertragungsgröße weit unter der Dateigröße auf der Festplatte.
- console-Aufrufe bewusst entfernen. Dieser Schalter ist standardmäßig aus, denn eine Log-Zeile trägt manchmal Last. Schalten Sie ihn ein, wenn Sie wissen, dass das nicht so ist.
- Auf das Prüfsiegel achten. Meldet es je, dass ein Durchlauf nicht geprüft wurde, liefern Sie diese Datei nicht aus. Schicken Sie uns stattdessen den Fall und behalten Sie Ihr Original.
- Auf Lizenzhinweise achten. Lassen Sie den Banner-Schalter an, wenn Ihr Code einen Urheberhinweis trägt, den Sie behalten müssen.
Fehler, die einen minifizierten Build zerstören
Fast jede Geschichte à la „der Minifier hat meine Website kaputt gemacht“ ist einer dieser drei Fälle.
Die minifizierte Datei bearbeiten
Änderungen dort verschwinden beim nächsten Build. Die Korrektur gehört also immer in den Quellcode.
Sich auf Funktionsnamen verlassen
Code, der fn.name liest oder einen Klassennamen als String vergleicht, bricht bei jedem Minifier, der umbenennt, auch bei diesem. Schalten Sie die Umbenennung für solche Dateien deshalb aus, oder hören Sie auf, vom Namen abzuhängen.
Zweimal minifizieren
Eine bereits minifizierte Datei erneut durchlaufen zu lassen, spart nichts und macht einen Diff nur schwerer lesbar.
Häufige Fragen zum JavaScript-Minifier
Zerstört das Tool meinen Code, wenn ich JavaScript minifiziere?
Das sollte es nicht, und es prüft das, statt es anzunehmen. Es parst seine eigene Ausgabe erneut und vergleicht sie mit Ihrem Original, sowohl die Namen, auf die der Code zugreift, als auch die Form des Baums, sodass ein beschädigter String, eine verlorene Klammer oder eine Umbenennung, die die falsche Variable erwischt, erkannt und gemeldet wird. Besteht ein Durchlauf die Prüfung nicht, erhalten Sie Ihr Original unverändert zurück.
Wie viel Gewicht spart meine Datei?
Lesbarer Quellcode schrumpft meist um 40 bis 60 Prozent, und das Tool zeigt Ihnen den genauen Wert für Ihre Datei. Stark kommentierter Code mit langen Namen spart am meisten; bereits kompakter Code spart dagegen viel weniger, weil weniger zu holen ist.
Benennt es Variablen um wie andere Tools?
Ja. Es analysiert jeden Scope der Datei und gibt lokalen Variablen, Parametern und Funktionen kurze Namen, die kürzesten dem, was am häufigsten vorkommt. Globale Namen, Browser-APIs wie window und document, Importe und Exporte werden nie umbenannt; enthält die Datei außerdem einen `with`-Block oder ein direktes eval, wo ein Name zur Laufzeit als String gesucht werden kann, schaltet sich die Umbenennung ganz ab, und das Tool erklärt Ihnen, warum.
Wird mein Code irgendwohin hochgeladen?
Nein. Der ganze Minifier läuft in Ihrem Browser-Tab. Es gibt keine Anfrage, keinen Speicher und kein Protokoll, deshalb können Sie auch Arbeit einfügen, die Sie nicht weitergeben dürfen.
Kann ich mehrere Dateien auf einmal minifizieren?
Ja. Öffnen Sie den Upload-Tab und legen Sie beliebig viele .js-, .mjs- oder .cjs-Dateien ab. Das Tool minifiziert jede einzeln, und Sie können sie nacheinander herunterladen.
Kommt es mit modernem JavaScript zurecht?
Ja. Module, Klassen, private Felder, Template-Literale, Optional Chaining, Nullish Coalescing, BigInt und Zahlentrenner werden korrekt gelesen. JSX und TypeScript sind jedoch kein JavaScript, also kompilieren Sie diese zuerst.
Weitere Tools, die Sie sofort nutzen können
Jedes davon läuft in Ihrem Browser und verlangt nichts.
SVG komprimieren
Verkleinern Sie SVG-Dateien oder eingefügtes Markup und entfernen Sie darin versteckte Skripte.
Tool öffnen →PNG-zu-WebP-Konverter
Wandeln Sie einen Stapel Bilder in ein leichteres Format um, mit erhaltener Transparenz.
Tool öffnen →Passwort-Generator
Erstellen Sie ein starkes Zufallspasswort oder eine Passphrase, die Sie laut aussprechen können.
Tool öffnen →
Verkleinern Sie Ihr nächstes Skript in Sekunden
Code einfügen, eine Schaltfläche drücken und die Ersparnis selbst prüfen. Es werden keine Daten übertragen oder abgelegt.