Compresser du javascript. Réduire la taille de ses fichiers JS.

15 août 2008 à 20:52

Pour gagner quelques centièmes de secondes afin d'optimiser le temps de chargement de votre page web, il est judicieux de compresser votre code javascript, surtout si celui-ci est important.

Les frameworks de type jquery, extjs, yahoo! library, dojo ou encore prototype utilisent bien évidemment la compression dans les fichiers de productions. Ainsi jquery, mon framework préféré, met à disposition des internautes 3 versions à chaque fois à télécharger :
- une version à utiliser pour la production. La version où les variables sont renommées et encodées et où les espaces, tabulations, sauts de lignes sont supprimés. >> jQuery 1.2.6 (16kb, Minified and Gzipped)
- une version sans encodage de variables mais avec suppressions des espaces, tabulations et sauts de ligne. >> jQuery 1.2.6 (30kb, Packed)
- une version sans compression jQuery 1.2.6 (97kb, Uncompressed)

Il existe une petite application en ligne http://dean.edwards.name/packer/ qui fait ça très bien. Vous copiez/collez votre code dans le champ de formulaire, vous cochez Base encode et Shrink variables et vous cliquez sur le bouton Pack.

Et vous obtenez un code qui commence comme celui-ci :

eval(function(p,a,c,k,e,r){e=function(c){return(c

Ajouter un commentaire

Par manu (non vérifié), le 15 août 2008 à 21:14.

Et il y a possibilité de faire l'inverse?Le jour on veut reprendre le code ca va être coton sinon

répondre

Par Diego (non vérifié), le 15 août 2008 à 21:27.

Il est impossible de faire l'inverse.

Quand tu compresses ton code javascript c'est que tu ne vas plus jamais y toucher. Il faut donc s'organiser pour avoir une version de son code non compressé si jamais tu veux effectuer une modification ou autre chose.

On compresse son code uniquement en fin de projet.

répondre

Par Kévin (non vérifié), le 05 septembre 2008 à 18:05.

Il est impossible de faire l’inverse.

Je crois bien que c'est faux =)

Pour « révéler » un code compressé ressemblant à ceci : eval(function(p,a,c,k,e,r){e=function(c){return(c, il suffit d'utiliser une fonction « write_div() » (créée par le développeur, et dont je vous laisse le soin d'imaginer son action :-°) en lieu et place de la fonction « eval() » par laquelle commence le code compressé ;)

Pour faire simple, le code compressé est donc affiché au lieu d'être interprété.