JavaScript-Formatierer & Minimierer

Was ist JavaScript-Formatierung?

Hauptfunktionen

Beispiele

function add(a,b){return a+b}const doubled=[1,2,3].map(x=>x*2);console.log(doubled)

async function load(id){const r=await fetch(`/api/${id}`);if(!r.ok)throw new Error('bad');return r.json()}

const cfg={retries:3,timeout:5000,headers:{'Content-Type':'application/json'},onError(e){console.warn(e)}}

class Counter{#n=0;inc(){this.#n++}get value(){return this.#n}}

Häufige Anwendungsfälle

Minimierten Code lesen

Ein minifiziertes oder verschleiertes Skript verschönern, um es zu verstehen und zu debuggen.

Code-Review

JavaScript vor einem Pull Request formatieren für konsistenten, differenzierbaren Code.

Kleinere Bundles ausliefern

Produktions-JavaScript mit Terser minimieren, um Bytes einzusparen und die Ladezeit zu beschleunigen.

Ausschnitt aufräumen

Einen schnellen Einfüger aus der Konsole oder einem Gist in sauberen, lesbaren Code umformatieren.

Technische Details

Verschönert mit js-beautify

Verwendet die bewährte js-beautify-Engine für vorhersehbare, konfigurierbare Einrückung und Abstände.

Minimiert mit Terser

Terser ist der de-facto-JavaScript-Minimierer — er benennt lokale Variablen um, entfernt toten Code und Kommentare, ohne das Verhalten zu verändern.

Browserbasiert

Läuft vollständig clientseitig; Ihr Code verlässt niemals Ihr Gerät oder erreicht einen Server.

Best Practices

Quelle formatieren, für Produktion minimieren

Lesbaren Code im Repository behalten und das Build-System mit Terser minimieren lassen.

Moderne Syntax mit Bedacht minimieren

Terser zielt auf Standard-JavaScript; sehr neue Vorschläge benötigen möglicherweise zuerst einen Transpilierungsschritt.

Minimierten Code nicht manuell bearbeiten

Umbenannte Variablen machen minimierten Code schwer zu pflegen — den Quellcode bearbeiten und dann neu minimieren.

Häufig gestellte Fragen