Ottimizzare la compressione del Javascript
Martedì 23 Giugno 2009 - 08:28
di Riccardo Degni
Matt Snider ha scritto sul suo blog un interessante articolo in cui espone alcuni consigli utili ad ottimizzare la compressione dei file Javascript. Quello di comprimere i file Javascript è un compito comune, ma occorre eseguirlo nel migliore dei modi. Ecco dunque i consigli di Matt.
Usare meno “var”
Come sappiamo, per dichiarare una variabile occorre usare la keyword var, ma per gruppi di variabili, è consigliabile usarla una sola volta e raggruppare una lista di nomi:
// tante var
var v1 = 1;
var v2 = {};
var v3 = function() {
// function code
};
// una var
var v1 = 1,
v2 = {},
v3 = function() {
// function code
};
Usare shortuct pointers per i namespace prolissi
Perché ripetere sempre lo stesso namespace quando possiamo avvalerci dei puntatoti locali, il cui namespace è completamente sotto il nostro controllo? Questo migliora di molto l’esito della compressione:
function() {
MyLib.Utilities.Events.add('el1', 'click' function() {/* function code */});
MyLib.Utilities.Events.add('el2', 'click' function() {/* function code */});
MyLib.Utilities.Events.add('el3', 'click' function() {/* function code */});
}());
// shortcut pointer
(function() {
var evts = MyLib.Utilities.Events;
evts.add('el1', 'click' function() {/* function code */});
evts.add('el2', 'click' function() {/* function code */});
evts.add('el3', 'click' function() {/* function code */});
}());
Concatenare i file prima della compressione
Una buona regola è inoltre quella di concatenare i file in un unico file prima di eseguire la compressione. Questo permette di riutilizzare i namespace più corti scelti in precedenza dal compressore, senza la necessità di usarne di nuovi nel caso di nuove variabili globali (i compressoreinon hanno la capacità di ricordare le informazioni tra più file).
Variabili al posto di oggetti
Quest’ultima regola è molto soggettiva: se da un lato ottimizza la compressione, dall’altro può incidere notevolmente sulla qualità del nostro codice. Essa si traduce nell’utilizzare le semplici variabili al posto delle proprietà degli oggetti: questo perchè molti compressori non sono attualmente in grado di ridurre e dunque rinominare le proprietà degli oggetti.
Queste le regole di Matt Snider per ottimizzare le nostre compressioni. Qualcuno ha qualche altro suggerimento?
Categoria: Scripting | Permalink
Commenti
1
… in pratica si e’ letto i vecchi suggerimenti dello YUICompressor e ci ha fatto un post? Geniale, e la novita’ “da prima pagina” sarebbe?
2
La novita’ sarebbe che la documentazione di YUICompressor non la legge quasi nessuno… mentre un post su un blog arriva a molte piu’ persone :D
# - postato da Andrea - 23 Giugno 2009 - 11:00
3
Ma sbaglio, o usando questo compressore: http://dean.edwards.name/packe.....r/
usare shortuct pointers per i namespace prolissi allunga il codice compresso invece che ridurlo?
# - postato da Fra_T - 23 Giugno 2009 - 11:25
4
@Fra_T, infatti quella della shortcut e’ solo una comodita’ poiche’ qualunque compressore lavorera’ meglio con dizionari ridotti piuttosto che combinazioni capaci di aggiungere solo “rumore” alla compressione. 3000 volte MyLib.Utilities.Events.add sara’ compresso meglio di 300 var thisOne = … , thisOther = … shortcuts, soprattutto con gzip.
@Andrea, io non so chi sia lo sviluppatore JavaScript che per ogni variabile mette var davanti, voglio dire sono pratiche comuni usate da anni. Per questo mi sfugge la novita’ … cioe’, non c’e’ niente di nuovo in questo post mentre di cose interessanti “la fuori” ne hanno fatte parecchie negli ultimi giorni. ( fate un salto su Ajaxian, per dirne uno )
Mi ha fatto solo strano vedere enfasi per tale sciocchezza, di solito edit e’ al passo coi tempi, tutto qua.
5
@andr3a: dunque non solo edit, ma secondo te anche uno come snider non è al passo coi tempi.
Ti dico solo una cosa: è possibile che ad un programmatore - come me - sfugga qualche informazione ogni tanto. Io ho trovato i suggerimenti di snider presentati in questo post molto utili, perchè me li ero “persi” nella documentazione di yui che dicevi.
Ok, non sono sicuramente un programmatore di livello eccelso e purtroppo continuo a trovare utili le indicazioni ed i post che i “geni” come te ritengono antiquate… eh, che ci vuoi fare?
PS: grazie per la segnalazione.
# - postato da Jacopo L - 23 Giugno 2009 - 12:41
6
@Jacopo poteva essere Crockford o chicchessia, sono pratiche comuni vecchie di anni. Se ti leggi qualunque sorgente di un codice o una lib aggiornata troverai queste pratiche.
Se usi JavaScript attivamente (non usi solo librerie ma sei interessato ad imparare JavaScript) non devi essere un genio per tenerti agigornato. Se invece non usi JavaScript questa news ti e’ trasparente. Se domani aprono un post tipo: JavaScript, un linguaggio per il browser … cosa fai, difendi tutti quelli che ancora lo chiamavano Java e non sapevano fosse un linguaggio diverso? Da un blog come edit mi aspetto di solito post piu’ interessanti, non e’ questione di essere “geni”. Ciao.P.S. io non ricordo nemmeno chi sia questo snider, ma non a caso ha aggiornato il post grazie al primo commento:
Nick Zakas of YUI also recommends the following, Helping The YUI Compressor.
Quindi questo guru non e’ cosi’ al passo con i tempi, almeno su questo argomento. Mi spiace deluderti il mito … (poi se qualcuno mi ricorda perche’ lui e’ un intoccabile mi fate un favore, grazie)
7
@andr3a: omg quante polemiche… Dai concludiamo che per te è una notizia poco rilevante. Però se permetti, per altri può esserlo, non denigrare tutto e tutti, ricorda, c’è sempre da imparare. Stop.
# - postato da Jacopo L - 23 Giugno 2009 - 13:22
8
@Jacopo, sono il primo a pensarla cosi’, ma come ho detto ci sono state tante novita’ di recente e questa secondo me non era nemmeno in top ten.
La mia era una critica verso la scelta dell’autore, se poi non si puo’ piu’ dire niente qui allora continuate con news di questo tipo, sara’ un successo. OK? Saluti.
9
[…] Quest’ultima regola è molto soggettiva: se da un lato ottimizza la compressione, dall’altro può incidere notevolmente sulla qualità del nostro codice. Essa si traduce nell’utilizzare le semplici variabili al posto delle proprietà degli oggetti: questo perchè molti compressori non sono attualmente in grado di ridurre e dunque rinominare le proprietà degli oggetti. Fonte: Ottimizzare la compressione del Javascript […]
# - postato da Ottimizzare la compressione del Javascript | FaceitWeb.com - 25 Giugno 2009 - 12:26