Minificator JavaScript

Lipește JavaScript pentru a-l micșora cu Terser: codul mort este eliminat, numele sunt scurtate, iar spațiile albe dispar. Erorile de sintaxă indică linia și coloana exacte.

Rulează în browserFără înregistrareNimic nu este încărcat

Rezultat minificat

Cum se folosește: Minificator JavaScript

  1. Lipește JavaScript-ul sau deschide un fișier .js.
  2. Alege opțiunile: Scurtează numele scurtează variabilele locale, Comprimă rescrie codul într-un echivalent mai mic, Modul ES permite import/export la nivel superior.
  3. Alege ținta ECMAScript acceptată de browserele utilizatorilor tăi. ES2020 este sigur pentru toate browserele actualizate automat.
  4. Verifică dimensiunea, economia și estimarea gzip de sub rezultat.
  5. Copiază codul minificat sau descarcă-l ca output.min.js.

Ce face un minificator JavaScript?

Minificarea face JavaScript-ul mai mic fără să schimbe ce face. Acest instrument folosește Terser, minificatorul din spatele webpack, Vite și Rollup, și aplică trei tipuri de modificări:

  • Eliminarea spațiilor albe și a comentariilor: indentarea, liniile noi și comentariile nu sunt necesare motorului JavaScript.
  • Mangling: numele variabilelor locale și ale parametrilor funcțiilor, precum subtotal, devin litere unice. Numele globale și proprietățile obiectelor sunt lăsate neatinse, ca API-ul tău public să funcționeze în continuare.
  • Compresie: expresiile constante sunt calculate, codul inaccesibil este eliminat, instrucțiunile if devin operatori ternari, iar funcțiile scurte sunt inserate inline.

Minificare vs. gzip: ai nevoie de ambele?

Da. Gzip și Brotli comprimă tiparele repetate de octeți la transfer, în timp ce minificarea elimină octeți pe care browserul ar trebui altfel să-i descarce, să-i parseze și să-i compileze. Un script tipic se micșorează cu 40–60% prin minificare și apoi cu încă 60–70% prin gzip. Dimensiunea gzip afișată aici este o estimare bună a ceea ce va trimite efectiv serverul tău.

Păstrarea comentariilor de licență

Multe licențe open-source (MIT, BSD, Apache) cer ca notificarea de copyright să rămână împreună cu codul. Prin convenție, comentariile care încep cu /*! sau conțin @license sau @preserve sunt păstrate când Păstrează comentariile de licență este activat.

Când să nu minifici manual

Dacă proiectul tău folosește deja un bundler, lasă-l să minifice build-urile de producție și să genereze source map-uri pentru depanare. Un minificator online este ideal pentru scripturi ocazionale, fragmente pentru un CMS sau tag manager, bookmarklet-uri și pentru a vedea cât de mic poate deveni un cod.

Întrebări frecvente

Este codul meu încărcat pe un server?
Nu. Terser rulează în tabul browserului, așa că un cod proprietar nu părăsește niciodată calculatorul tău.
Poate minificarea să-mi strice codul?
Terser aplică doar transformări care păstrează comportamentul identic pentru JavaScript valid. Codul care se bazează pe Function.prototype.toString() sau pe nume de variabile locale prin eval poate fi afectat; în acest caz dezactivează Scurtează numele.
Acceptă sintaxă modernă precum async/await, clase și optional chaining?
Da. Terser parsează sintaxă ES2022+. Setarea țintei controlează doar ce sintaxă poate folosi rezultatul; nu transpilează funcțiile mai noi în unele mai vechi.
Care este diferența dintre minify și uglify?
Înseamnă același lucru. UglifyJS a fost instrumentul clasic; Terser este fork-ul său întreținut, cu suport complet pentru ES2015+.

Instrumente similare