Bien le bonjour !
Souvenez-vous, il y a quelques temps, je vous présentais Minifier, un plugin pour Atomik Framework qui compresse vos fichiers CSS directement sur votre serveur. Plusieurs avantages à cela :
- une seule requête HTTP sur chaque page, quel que soit le nombre de vos fichiers CSS
- suppression des espaces superflus et des commentaires, donc des fichiers plus légers
- moins de bande passante utilisée
- une mise en cache des fichiers compressés, donc pas d'utilisation inutile des ressources
Seul "inconvénient", les utilisateurs reçoivent un fichier compressé et donc relativement illisible. Mais honnêtement, dans le cadre d'un site de taille respective, est-ce vraiment un problème ?
Petit rappel pour les gens qui découvrent : ce plugin s'utilise uniquement avec Atomik Framework, un framework PHP5 léger, gratuit, open source, et que j'apprécie beaucoup.
Bien. Il se trouve que la première version de plugin ne marchait pas bien du tout, parce que j'utilisais des liens pour régler le problème des urls relatives des fichiers CSS. En gros, je créais dans le dossier assets/css/ un lien vers le fichier compressé, ainsi les url étaient prises en compte depuis le dossier assets/css/ et non depuis le dossier de cache. Mais faire des liens en PHP, c'est pas beau, et surtout ça ne marche que très peu sur les serveurs ! A côté de ça, j'avais aussi quelques problèmes au niveau de la manipulation des adresses des fichiers.
Ce matin, j'ai eu une illumination en repensant à ces problèmes, et j'ai donc pu facilement résoudre le premier : il suffisait tout simplement de mettre les fichiers compressés dans un dossier situé au même niveau que le dossier contenant les CSS ! Par exemple, dans un dossier assets/css_cache/ ! J'ai donc fait ça, et j'en ai profité pour corriger les problèmes d'adresses et pour ajouter quelques fonctionnalités. Vous avez désormais trop moyens d'ajouter le <link>, comme décrit sur la page officielle du plugin. De plus, j'ai ajouté deux clés de configuration : 'cache/dir' contient l'adresse du dossier contenant les fichiers cachés (par défaut, assets/css_cache/), et 'force_css_link' qui force l'affichage de la balise <link> complète plutôt que le retour de l'url du fichier compressé. Des exemples d'utilisation sont disponibles sur la documentation de Minifier.
J'espère que les utilisateurs d'Atomik Framework prendront plaisir à utilliser Minifier, et qu'il leur sera utile pour améliorer les performances de leurs sites !
Si vous avez des remarques ou des questions, n'hésitez pas à vous exprimer en commentaire ou en m'envoyant un mail.
Quelques liens pour finir :
- Page officielle du plugin
- Le plugin Minifier sur AtomikFramework (avec lien de téléchargement)
- Téléchargement direct de Minifier version 1.1
- Présentation du plugin sur le forum d'Atomik
- Site officiel d'Atomik Framework
Bonne journée !
Comments
Est mort de rire devant :
$css = str_replace(array("\n", "\r", "\t"), " ", $css);et sa ligne suivante
$css = preg_replace("/\s\s+/", " ", $css);@Jordan : Dans l'optique où je suis plutôt mauvais pour tout ce qui est des regex, je veux bien bénéficier des tes lumières sur cette partie du code que j'ai, je l'avoue, honteusement reprise d'autres codes (libres bien entendu... ;) ).
La classe \s se recouvre les caractères suivants : \t \n \r et l'espace blanc.
Concrètement, tu peux retirer la ligne suivante sans modifier le résultat final :
$css = str_replace(array("\n", "\r", "\t"), " ", $css);Et je pense que tu peux même améliorer la suivante simplement en retirant le remplacement par un espace : le CSS supporte très bien la compression maximum.
$css = preg_replace('/\s\s+/', '', $css);PS : Et par pitié, privilégie les ' aux " pour tes chaines de caractères.
Ok, c'est corrigé, voila le code maintenant :
$css = preg_replace('/\/\*\d\D*?\*\/|\t+/', '', $css);$css = preg_replace('/\s\s+/', '', $css);
$css = preg_replace('/\s*({|}|[|]|=|~|\+|>|\||;|:|,)\s*/', '$1', $css);
Merci pour ton aide ! ;)
Je m'interroge, il faudrait faire un benchmark pour vérifier mais je pense qu'on doit pouvoir tout compresser en une seule regex et donc faire un seul appel à la fonction preg_replace. Ce que tu perds en visibilité, tu devrais le gagner en vitesse d'exécution.