Cosa fa la minificazione
Minificare significa ridurre la dimensione di CSS e JavaScript senza cambiarne il funzionamento: si tolgono commenti, spazi e a capo non necessari. File più leggeri si scaricano più in fretta, soprattutto da rete mobile.
Come lavora questo strumento
- CSS: rimuove commenti, spazi intorno a parentesi graffe, due punti e punti e virgola, e l'ultimo punto e virgola di ogni blocco.
- JavaScript: analizza il codice carattere per carattere e lascia intatti stringhe, template literal ed espressioni regolari. Rimuove commenti e spazi superflui, ma conserva gli a capo dove servono all'inserimento automatico del punto e virgola, per non cambiare il significato del codice.
Abbiamo verificato lo strumento sugli oltre cento script di questo sito: il codice minificato resta valido, con una riduzione media della dimensione intorno al 25%.
Esempio
Il codice
function somma(a, b) {
// restituisce la somma
return a + b;
}
diventa function somma(a,b){return a+b;}.
Minificazione, compressione e build
- Compressione gzip o Brotli: si applica sul server e si somma alla minificazione; i due interventi insieme danno il risultato migliore.
- Strumenti di build: per progetti grandi si usano minificatori completi come Terser o esbuild, che accorciano anche i nomi delle variabili ed eliminano il codice non usato. Questo strumento è pensato per file singoli e verifiche veloci.
- Mappe sorgente: in produzione conviene conservare la versione originale per il debug.
Domande frequenti
Il mio codice viene inviato a un server?
No, la minificazione avviene interamente nel tuo browser.
Il codice minificato si può riportare leggibile?
Commenti e formattazione originali sono persi, ma un formattatore ("beautifier") può reintrodurre rientri e a capo. Conserva sempre il file sorgente.