Cos’è la minificazione e perché farla?

Immagine Cos’è la minificazione e perché farla?

La minimizzazione è il processo di minimizzazione del codice e del markup nelle pagine Web e nei file di script. È uno dei metodi principali utilizzati per ridurre i tempi di caricamento e l’utilizzo della larghezza di banda sui siti Web.

La minimizzazione migliora notevolmente la velocità e l’accessibilità del sito, traducendosi direttamente in una migliore esperienza utente. È anche vantaggioso per gli utenti che accedono al tuo sito Web tramite un piano dati limitato e che desiderano risparmiare sull’utilizzo della larghezza di banda durante la navigazione sul Web.

Perché minimizzare HTML, CSS e JavaScript (JS)

Durante la creazione di file HTML, CSS e JavaScript (JS), gli sviluppatori tendono a utilizzare spaziatura, commenti e variabili ben definite per rendere leggibili il codice e il markup.

Questo sistema, aiuta anche gli altri che potrebbero in seguito lavorare sulle risorse. Sebbene questo sia un vantaggio nella fase di sviluppo, diventa negativo quando si tratta di servire le tue pagine. I server Web e i browser possono analizzare il contenuto dei file senza commenti e codice, che creano entrambi traffico di rete aggiuntivo senza fornire alcun vantaggio funzionale.

Per minimizzare i file JS, CSS e HTML, i commenti e gli spazi extra devono essere rimossi, così come il crunch dei nomi delle variabili in modo da minimizzare il codice e ridurre le dimensioni del file. La versione del file ridotta fornisce le stesse funzionalità riducendo la larghezza di banda delle richieste di rete.

Ecco come uno sviluppatore scriverebbe un file JavaScript da utilizzare in un sito Web:

Gli spazi bianchi sono usati generosamente e i nomi lunghi e coerenti sono usati per dichiarare le variabili.

Quando minimizzato, lo stesso codice appare così:

minificazione-2

La versione ridotta di questo codice di esempio è inferiore del 48%. In alcuni casi, la minimizzazione può ridurre le dimensioni del file fino al 60%. Ad esempio, c’è una differenza di 176 kb tra la versione originale e ridotta della libreria JavaScript JQuery.

La minimizzazione è diventata una pratica standard per l’ottimizzazione della pagina. Tutti i principali sviluppatori di librerie JavaScript (bootstrap, JQuery, AngularJS, ecc.) forniscono versioni ridotte dei loro file per le distribuzioni di produzione, generalmente indicate con un’estensione del nome min.js.

Manuela Maurizi
BHOOST Super Team

As the lead of the Business Partner Network, Manuela guides the proactive development of new opportunities, primarily through building relationships with new and existing partners. She works on evolving the structure of the Network as well as Partner recruitment and activation processes. Manuela also doesn’t like Brussels sprouts.

Lascia un commento

Il tuo indirizzo email non sarà pubblicato.