Lo YUI Compressor è uno strumento molto valido per alleggerire i file Javascript e CSS che serviamo agli utenti: è possibile cioè ridurne il peso tra il 20 e il 50% senza intaccarne le funzionalità, così da poterli integrare nei nostri progetti in piena sicurezza.
Esistono varie librerie dedicate alla minimizzazione, ma lo YUI Compressor resta quella con un maggior focus sulla riduzione di peso, che è il fattore che ci interessa maggiormente quando vogliamo ottenere le massime performance in termini di velocità di caricamento dell’intero sito.
Come funziona?
Lo YUI Compressor è scritto in Java, ed è basato sulla libreria open source Rhino, che serve per “far leggere” Javascript a Java stesso. Il sistema di compressione inizia analizzando il file leggendo il codice che abbiamo scritto. Cambia poi i nomi di variabili e funzioni sostituendoli con nomi più brevi dove possibile. Infine, toglie più spazi bianchi possibili e rimuove tutti i commenti. Pare poca cosa, ma in termini di velocità otterremo grandi benefici, ve lo assicuro. Vediamo come usarlo.
Installazione di Java
Per eseguirlo, abbiamo bisogno di avere installato Java JRE (Java Runtime Environment) sul nostro sistema. Se lo avete già fatto, passate al punto successivo.
Installazione di Java su Linux basati su Red Hat, CentOS o Fedora
Per installarlo, ci affidiamo al gestore pacchetti yum
sudo yum install java-1.8.0-openjdk
Verifichiamo che l’installazione sia andata a buon fine
java -version
Installazione di Java su Linux basati su Ubuntu o Debian
Per installarlo, ci affidiamo al gestore pacchetti APT
sudo apt-get install openjdk-8-jre
Verifichiamo che l’installazione sia andata a buon fine
java -version
Installazione di Java su Windows
Procedete al download dal sito ufficiale ed installate il pacchetto. Al termine, riavviate la macchina.
Download di YUI Compressor
A questo punto non ci rimane che scaricare l’ultima versione del compressore, che consiste in un singolo file .jar, dalla pagina download ufficiale. Scarichiamo il pacchetto, manualmente oppure tramite il comando wget
wget https://github.com/yui/yuicompressor/releases/download/v2.4.8/yuicompressor-2.4.8.jar
Minimizziamo un file
A questo punto possiamo già utilizzare lo YUI Compressor, testiamolo quindi su un file javascript.
java -jar yuicompressor-2.4.8.jar file.js -o file-min.js
Abbiamo eseguito l’applicativo indicandogli come input il file file.js e come file output avremo la sua versione minimizzata nel file file-min.js . Il tipo di compressione (Javascript o CSS) è basato sull’estensione del file che stiamo minimizzando (.js oppure .css). Se i file che intendiamo processare non hanno una di queste estensioni, possiamo forzare il compressore ad un interpretare il tipo, usando l’opzione –type js oppure –type css
java -jar yuicompressor-2.4.8.jar filejavascript.txt -o file-min.js --type js
In questo caso un file javascript ha estensione .txt: diciamo al compressore di trattarlo come fosse un javascript (.js) e di mettere l’output minimizzato nel file file-min.js.
Opzioni disponibili
È possibile modificare il comportamento del compressore usando una o più opzioni. Per consultare la lista delle opzioni disponibili, digitiamo
java -jar yuicompressor-2.4.8.jar -h
Una delle più interessanti è sicuramente la modalità verbose che ci permette di ottenere dei piccoli suggerimenti su come ottimizzare il codice. Ad esempio, quando dichiariamo una variabile che non utilizziamo successivamente. Per abilitare la modalità verbose, aggiungiamo l’opzione –verbose
java -jar yuicompressor-2.4.8.jar file.js -o file-min.js --verbose
Fatto. Se volete soltanto provare lo YUI Compressor o utilizzarlo saltuariamente, sono disponibili diversi tool che vi permettono di utilizzarlo online, come questo.