Aller au contenu

Articles marqués ‘compression’

23
avr

Compressez vos fichiers javascript et css

Vos fichiers JS font plusieurs centaines de lignes? Ne parlons même pas de vos fichiers CSS alors ? A l’heure actuelle, même s’il est vrai qu’optimiser vos fichiers, en terme de taille, n’est plus réellement un souci dans le développement de vos sites web, il est intéressant de découvrir les fonctionnalités apportées par l’outil de compression développé par Yahoo!

YUI Compressor est un logiciel développé par Yahoo en JAVA qui permet de compresser vos fichiers JS et CSS. Son utilisation s’avère très simple pour les inconditionnels de la ligne de commande et vous permet, à l’aide de petits scripts, de compresser tous vos fichiers!

Voici un exemple de commande:

java -jar yuic.jar --type js -o fichier.js

Comprendre: Compresser le fichier de type ‘js’ qui a pour nom ‘fichier.js’.

Mais si j’ai pas linux ?

Pas de problème, il suffit d’installer une JVM (Java Virtual Machine) pour utiliser cet outil, car une application développée en JAVA est multiplateforme (Windows, Linux, etc…).

Pour les fichiers CSS, la méthode est la même sauf que l’option « type js » devient « type css ». C’est aussi simple, et ça ne demande pas d’efforts supplémentaires … sauf si vous avez 15 fichiers CSS et 40 fichiers JS…

Alors pourquoi ne pas écrire un petit script (tcsh … sous linux) qui réalise toutes ces tâches ?

#!/bin/bash
find $1 -type f -name *.js -exec java -jar yuic.jar \
    --type js -o {} {} \;
find $1 -type f -name *.css -exec java -jar yuic.jar \
    --type css -o {} {} \;

Admettons que le script porte le nom « compression.sh » et que vous avez bien mis les droits d’exécution sur ce dernier, on compressera tous nos fichiers à l’aide de cette ligne de commande:

compression.sh mon_repertoire

Pensez à bien mettre « yuic.jar » dans le même répertoire que votre script!

Une dernière chose, les fichiers originaux seront écrasés lors de la compression, pensez à faire une copie de tous vos script CSS et JS avant toute manipulation!