+- JeuWeb - Crée ton jeu par navigateur (https://jeuweb.org)
+-- Forum : Discussions, Aide, Ressources... (https://jeuweb.org/forumdisplay.php?fid=38)
+--- Forum : Programmation, infrastructure (https://jeuweb.org/forumdisplay.php?fid=51)
+--- Sujet : Regrouper et compresser les fichiers CSS ou Javascript simplement (/showthread.php?tid=5377)
Regrouper et compresser les fichiers CSS ou Javascript simplement - Sephi-Chan - 13-04-2011
Bonjour,
J'ai eu l'occasion d'utiliser un petit script qui s'occupe de regrouper des fichiers (CSS et Javascript) et de les compresser (minify). Ce n'est pas aussi complet que des outils comme Jammit mais je pense que ça convient aux besoins de 90% des développeurs.
C'est écrit en Ruby mais ça ne vous empêche pas de l'utiliser pour une application PHP, c'est juste un petit script. Ça implique donc d'installer Ruby (1.9.2p180 à l'heure où j'écris ces lignes) et Rubygems, puis d'installer les Gems cssmin et jsmin avec la commande :
gem install cssmin jsmin
Une fois ceci fait, créez le fichier minify_resources.rb.
Le script part du principe que vous utilisez l'arborescence suivante. Changez le noms des répertoires dans le script pour coller à vos besoins.
.
├── ...
├── minify_resources.rb
└── public
├── blob.css
├── blob.js
├── css
│ ├── board.css
│ ├── common.css
│ ├── manifest.txt
│ ├── tiles.css
│ └── map.css
└── js
├── application.js
└── jquery.js
Par défaut, quand vous exécuterez le script minify_resources.rb, tous vos fichiers CSS seront rassemblés et compressés en un fichier blob.css, idem pour vos fichiers Javascript (avec blob.js, bien sûr).
Si vous ne souhaitez pas que tous les fichiers soient rassemblés, vous pouvez en détailler la liste des fichiers à rassembler dans un fichier manifest.txt (un nom de fichier par ligne).
Ici, j'ai écris un fichier manifest.txt contenant :
board.css
map.css
tiles.css
Mon fichier blob.css ne contient alors que les contenus compressés de ces 3 fichiers.
En revanche, mon fichier blob.js contient les contenus compressés de tous les fichiers Javascript.
Voilà, voilà, ça permet de facilement créer des packages de ressources et donc d'économiser des requêtes HTTP et des octets tout en conservant son code bien séparé dans différents fichiers !
J'essayerai peut-être d'améliorer le script à l'occasion pour permettre de créer plusieurs packages, à la manière de Jammit.
Sephi-Chan
RE: Regrouper et compresser les fichiers CSS ou Javascript simplement - niahoo - 13-04-2011
question, por les CSS, l'ordre d'inclusion est significatif, est-on obligés de passer par un fichier manifest pour spécifier l'ordre ?
RE: Regrouper et compresser les fichiers CSS ou Javascript simplement - Sephi-Chan - 13-04-2011
L'ordre par défaut est l'ordre alphabétique.
L'utilisation de l'ordre des fichiers est assez loin dans la chaîne de décision lors d'un rendu CSS, je ne sais pas si c'est un problème pour beaucoup de personne.
Au pire, on peut cheat en préfixant les noms des fichiers si on ne veut pas s'embêter à éditer le manifest.
Sephi-Chan