Minificatore JavaScript
Riduci i file JavaScript e vedi esattamente quanto hai risparmiato.
Funziona nel browser. Quello che scrivi non viene inviato da nessuna parte.
- Abbrevia i nomi delle variabili
- Mostra i byte risparmiati
- Niente viene caricato
Come minificare JavaScript
- Incolla il tuo JavaScript.
- Disattiva Comprimi o Abbrevia i nomi delle variabili se ti servono leggibili.
- Copia o scarica il file minificato.
Cosa fanno Comprimi e Abbrevia i nomi delle variabili
| Opzione | Cosa fa |
|---|---|
| Comprimi | Rimuove il codice morto e semplifica le espressioni |
| Abbrevia i nomi delle variabili | Rinomina le variabili locali con nomi brevi come a, b e c |
Cosa resta uguale in entrambi i casi
- Comportamento pubblico: gli stessi input producono ancora gli stessi output.
- Ogni stringa nel codice, incluso qualsiasi testo mostrato agli utenti.
- L'ordine in cui vengono eseguite le operazioni.
- Un commento /*! ... */, perché Terser mantiene questo stile per impostazione predefinita, la convenzione che molte librerie usano per i banner di licenza.
Consigli per minificare JavaScript
- Conserva una copia non minificata, oppure genera una source map nel tuo strumento di build, così gli errori in produzione restano leggibili.
- Disattiva Abbrevia i nomi delle variabili per una libreria che altri sviluppatori dovranno leggere, così i messaggi di errore mantengono nomi significativi.
- Esegui i test sull'output minificato prima di distribuirlo, perché un raro caso limite in un minificatore resta possibile anche se questo è ampiamente usato.
Domande su Minificatore JavaScript
Il JavaScript minificato è ancora codice valido?
Sì. Funziona esattamente come l'originale, solo con nomi più corti e senza spazi bianchi extra.
Di quanto si riduce di solito il JavaScript?
Spesso dal 30 al 60 percento, a seconda di quanti commenti e nomi di variabili lunghi ha l'originale.
Cosa succede se il mio codice ha un errore di sintassi?
L'errore viene mostrato con la riga e la colonna in cui si è verificato, così puoi correggerlo e riprovare.
Qual è la differenza tra Comprimi e Abbrevia i nomi delle variabili?
Comprimi riscrive il codice per rimuovere rami morti e semplificare le espressioni. Abbrevia i nomi delle variabili rinomina le variabili locali con singole lettere. Puoi disattivarle indipendentemente.
Può minificare sintassi moderna come async e le arrow function?
Sì, inclusa la sintassi ES2020 e successiva come l'optional chaining e async o await.
Quale minificatore usa questo strumento?
Terser, il successore standard di UglifyJS e il minificatore usato per impostazione predefinita dalla maggior parte dei bundler, tra cui webpack, Rollup ed esbuild.
La minifica può mai rompere il mio codice?
Non dovrebbe cambiare il comportamento per codice normale. Il codice che legge il nome originale di una funzione o variabile a runtime, per esempio con trucchi di introspezione non standard, può rompersi una volta abbreviati i nomi. Disattiva Abbrevia i nomi delle variabili se è il tuo caso.
Supporta la sintassi TypeScript?
No, questo strumento si aspetta JavaScript semplice. Le annotazioni di tipo di TypeScript non sono JavaScript valido e qui causeranno un errore di sintassi, quindi compila prima TypeScript in JavaScript.