Minimieren Sie JavaScript Online – Kostenloser JS-Minifier

Minimieren Sie den JavaScript-Code sofort mit unserem kostenlosen Online-Tool. Komprimieren Sie JS für die Produktion, reduzieren Sie die Dateigröße oder verketten Sie mehrere Dateien. Die gesamte Verarbeitung erfolgt in Ihrem Browser – es wird kein Code an einen Server gesendet.

Laden…

JavaScript Minimierung

Minimieren Sie JavaScript online mit Terser. Komprimieren Sie JS für die Produktion – sofortige Browserverarbeitung, keine Uploads.

Merkmale

Reduzieren Sie die Größe Ihres JavaScript-Codes, indem Sie Leerzeichen, Kommentare und unnötige Zeichen entfernen.

Minimieren

Reduzieren Sie die Größe Ihres JavaScript-Codes, indem Sie Leerzeichen, Kommentare und unnötige Zeichen entfernen.

Paket verwendet

Terser

v5.47.1

Terser ist ein moderner JavaScript-Kompressor, der die Größe und Leistung Ihres Codes optimiert.

Einfaches Beispiel

Eingabecode

Funktion berechneTotal(items) {
  let total = 0;
  for (let i = 0; i < items.length; i++) {
    total += items[i].price;
  }
  Gesamtrendite;
}

const Produkte = [
  { name: 'Laptop', price: 999 },
  { name: 'Mouse', price: 25 }
];

console.log('Total:', calculateTotal(products));

Minimierter Code

function calculeTotal(e){let t=0;for(let o=0;o<e.length;o++)t+=e[o].price;return t}const products=[{name:"Laptop",price:999},{name:"Mouse",price:25}];console.log("Total:",calculateTotal(products));

JavaScript Optimierungsleitfaden

Minifizierungsoptionen

ECMAScript-Version

Definiert die Ziel-ECMAScript-Version für die Minifizierung (ES5, ES2015, ES2017, ES2020, ES2022).

Beispiele nach ECMAScript-Version:

Originalcode (ES2022)

const data = { name: 'test' };
const { name } = data;
console.log(name);

ES2022

const{name:data}=data;console.log(data)

ES5

var data={name:'test'};var name=data.name;console.log(name)

Komprimierungsstufe

Steuert die Aggressivität der Kompression (konservativ, normal, aggressiv)

ConservativeKonservativ – Minimale Kompression, sicherer

NormalNormal – Gleichgewicht zwischen Größe und Kompatibilität

AggressiveAggressiv – Maximale Komprimierung, kann Code beschädigen

Komprimierungsbeispiele:

Originalcode

function calculateTotal(items) {
    let total = 0;
    for (let i = 0; i < items.length; i++) {
        total += items[i].price;
    }
    return total;
}

Conservative

function calculateTotal(items){let total=0;for(let i=0;i<items.length;i++)total+=items[i].price;return total}

Normal

function calculateTotal(t){let e=0;for(let l=0;l<t.length;l++)e+=t[l].price;return e}

Aggressive

function e(e){let t=0;for(let n=0;n<e.length;n++)t+=e[n].price;return t}

Klassennamen beibehalten

Behält CSS-Klassennamen in String-Literalen bei

Vergleich mit/ohne Option:

Originalcode

element.className = 'my-class';
element.setAttribute('class', 'another-class');

Mit „preserveClassNames: true“.

element.className='my-class';element.setAttribute('class','another-class')

Mit „preserveClassNames: false“.

element.className='a';element.setAttribute('class','b')

Unterschied

CSS-Klassennamen werden in Zeichenfolgen gespeichert

Funktionsnamen beibehalten

Behält Funktionsnamen zum Debuggen bei

Vergleich mit/ohne Option:

Originalcode

function myFunction() { 
    return true; 
}
const obj = { myMethod() { return false; } };

Mit „preserveFunctionNames: true“.

function myFunction(){return!0}const obj={myMethod(){return!1}}

Mit „preserveFunctionNames: false“.

function a(){return!0}const obj={b(){return!1}}

Unterschied

Funktionsnamen bleiben zum Debuggen erhalten

Konsole entfernen

Entfernt alle Aufrufe von console.log, console.warn usw

Vergleich mit/ohne Option:

Originalcode

console.log('Debug info');
console.warn('Warning message');
const result = calculateTotal(items);
console.log('Result:', result);
return result;

Mit RemoveConsole: true

const result=calculateTotal(items);return result

Mit RemoveConsole: false

console.log('Debug info');console.warn('Warning message');const result=calculateTotal(items);console.log('Result:',result);return result

Unterschied

Alle console.*-Aufrufe werden entfernt

Debugger entfernen

Entfernt Debugger-Anweisungen aus dem Code

Vergleich mit/ohne Option:

Originalcode

if (condition) {
    debugger;
    return true;
}
function test() {
    debugger;
    return false;
}

Mit RemoveDebugger: true

if(condition)return!0;function test(){return!1}

Mit removeDebugger: false

if(condition){debugger;return!0}function test(){debugger;return!1}

Unterschied

Debugger-Anweisungen werden entfernt

Siehe Einrückungsoptionen verschönern →

So entminifizieren Sie JavaScript online

Erfahren Sie mehr über diese Aktion →

JavaScript Beautifier vs. Unminifier – Was ist der Unterschied?

Erfahren Sie mehr über diese Aktion →

Verketten von JavaScript-Dateien

Das Kombinieren mehrerer JavaScript-Dateien zu einer reduziert HTTP-Anfragen und kann die Seitenladeleistung verbessern. Verwenden Sie unsere Verkettungsfunktion, um mehrere JS-Dateien zusammenzuführen, und minimieren Sie dann optional das Ergebnis für maximale Komprimierung. Dies ist besonders nützlich für Projekte, die keinen Bundler wie Webpack oder Rollup verwenden.

Häufig gestellte Fragen – Minimieren

Alles zum Thema Minimierung

Warum JavaScript minimieren?

Durch die JavaScript-Minimierung werden Dateigrößen reduziert, indem Leerzeichen und Kommentare entfernt und Variablennamen gekürzt werden. Typische Größenreduzierungen liegen zwischen 30 % und 70 %.

Wie funktioniert die JavaScript-Minifizierung?

Unser Tool verwendet Terser, den branchenüblichen JavaScript-Kompressor. Es entfernt unnötige Zeichen und verstümmelt optional Variablennamen. Der minimierte Code ist funktional identisch mit dem Original.

Müssen Sie JavaScript entminifizieren?

Verwenden Sie unseren speziellen JavaScript-Unminifier bis restfür lesbare Formatierung aus minimiertem Code.

Müssen Sie JavaScript verschönern?

Verwenden Sie unseren Verschönerer JavaScript, um Code mit konsistenter Einrückung zu formatieren.

Wird mein Code sicher verarbeitet?

Die gesamte JavaScript-Verarbeitung erfolgt vollständig in Ihrem Browser. Es wird kein Code an einen Server gesendet.

Kann ich JavaScript-Dateien verketten?

Ja, verwenden Sie unsere Verkettungsfunktion, um mehrere Dateien zusammenzuführen und dann das kombinierte Ergebnis für maximale Komprimierung zu minimieren.

Suchen Sie nach Konvertern, Encodern, Formatierern und Minifiern an einem Ort? Hub für Entwicklertools Öffnen Sie den kuratierten Entwicklertools-Katalog.