Le but
La compression des css et des javascripts est avec la l’optimisation des images un facteur de performance pour les sites web. J’ai fait la démonstration il y a quelque année avec voici.fr du gain et de la pertinence. Dans les deux cas le but est de transmettre moins de donnée (moins de bande passante consommé, moins de stockage, moins de donnée manipulé par les processus) , donc d’afficher plus rapidement une page, donc d’être mieux référencé par les moteurs de recherche.
yui-compressor
Yui Compresssor est un outil Yahoo inventé par leurs développeurs de la performance team. Le yui-compressor est un outil java disponible dans votre dépôt debian. Alors laissez faite apt ou aptitude …
# apt-cache show yui-compressor Package: yui-compressor Priority: optional Section: java Installed-Size: 824 Maintainer: Debian Java Maintainers <pkg-java-maintainers@lists.alioth.debian.org> Architecture: all Version: 2.4.2-2 Depends: default-jre-headless | java5-runtime-headless, libjargs-java, java-wrappers Filename: pool/main/y/yui-compressor/yui-compressor_2.4.2-2_all.deb Size: 747892 MD5sum: 492d2c30c7f91a1307ce29bd4df7116a SHA1: 69cc96ae9bd7c3e92a802576dc2a13892f02b8b7 SHA256: ea6577e753bdfa84ed980283f26f8aa392dd4e6595febc30da3bd767236536d5 Description: JavaScript/CSS minifier The YUI Compressor is a JavaScript compressor which, in addition to removing comments and white-spaces, obfuscates local variables using the smallest possible variable name. This obfuscation is safe, even when using constructs such as 'eval' or 'with' (although the compression is not optimal is those cases) Compared to jsmin, the average savings is around 20%. . The YUI Compressor is also able to safely compress CSS files. The decision on which compressor is being used is made on the file extension (js or css). Homepage: http://developer.yahoo.com/yui/compressor/
Oui pour l’utiliser vous avez besoin de Java
# apt-get install yui-compressor Lecture des listes de paquets... Fait Construction de l'arbre des dépendances Lecture des informations d'état... Fait Les paquets supplémentaires suivants seront installés : ca-certificates-java default-jre-headless java-common java-wrappers libjargs-java liblcms1 libnspr4-0d libnss3-1d openjdk-6-jre-headless openjdk-6-jre-lib tzdata-java Paquets suggérés : default-jre equivs libjargs-java-doc liblcms-utils libnss-mdns sun-java6-fonts ttf-dejavu-extra ttf-baekmuk ttf-unfonts ttf-unfonts-core ttf-sazanami-gothic ttf-kochi-gothic ttf-sazanami-mincho ttf-kochi-mincho ttf-wqy-microhei ttf-wqy-zenhei ttf-indic-fonts Les NOUVEAUX paquets suivants seront installés : ca-certificates-java default-jre-headless java-common java-wrappers libjargs-java liblcms1 libnspr4-0d libnss3-1d openjdk-6-jre-headless openjdk-6-jre-lib tzdata-java yui-compressor 0 mis à jour, 12 nouvellement installés, 0 à enlever et 8 non mis à jour. Il est nécessaire de prendre 33,8 Mo dans les archives. Après cette opération, 91,9 Mo d'espace disque supplémentaires seront utilisés. Souhaitez-vous continuer [O/n] ?
Résultat
Le résultat sur le fichier css du blog est éloquent
# cp -a style.css style.css.ori
# yui-compressor -v --type css style.css.ori -o style.css
#ls -lrth style.css* -rw-r--r-- 1 root root 66K 16 févr. 09:27 style.css.ori -rw-r--r-- 1 www-data www-data 50K 16 févr. 09:28 style.css
16ko de gagné sur ce seul fichier. Je vous laisse imaginer le gain sur l’ensemble des fichiers css et js, le facteur de multiplication avec votre audience etc..