Minify, réduisez et réunissez vos fichiers CSS et Javascript

Rédacté le 22/01/2009 WebDev

Tags: , , ,

Ah les jolis sites, avec leurs feuilles de styles, leurs animations en Javascript et leurs morceaux d’AJAX dedans !
C’est joli, c’est très « 2.0 et cie », mais ça fait encore plus de lignes de code, encore plus de fichiers et donc encore plus de bande passante.

balance

Les sites s’allourdissent (sans parler des pubs, du flash, etc …). Bref ! C’est la crise, faut alléger tout ça ! (oui, je sais que la crise n’a rien à voir, mais c’est dans l’ère du temps :D ).

Je vais parler aujourd’hui d’un petit bout de php qui ne fera de mal à personne : Minify.

Minify est un script codé en php5 qui permet de réduire et de réunir efficacement les fichiers CSS et Javascript.
Cette application supprime tous les caractères inutiles à l’interprétation du code par les navigateurs, à savoir les espaces et les commentaires.
De plus, elle concatène ces scripts entre eux, ce qui permet de réduire le nombre de requêtes effectuées par le navigateur de vos visiteurs (ce qui implique un temps de chargement ainsi qu’une charge en bande passantes réduits).
Autre atout, les fichiers crées sont envoyés avec un encodage HTTP (gzip/deflate), ce qui signifie qu’au moment de l’envoi au navigateur, ils vont être (g)zippés (compressés).

Au niveau de l’installation, c’est assez simple puisqu’un assistant de création d’URL est fourni avec l’outil pour permettre une integration plus aisée à vos créations existantes ou futures. Le fichier readme explique tout ça bien mieux que moi ^^

Cette petite application est simple, mais diablement efficace. De plus, elle est gratuite et sous licence BSD (une des nombreuses licences OpenSource).

Via : WebAppers

5 commentaires to Minify, réduisez et réunissez vos fichiers CSS et Javascript

  • PJ dit :

    Bonjour, je déterre un peu ce post.

    Je suis en train d’essayer Minify, pour remplacer ma solution home-made, un peu lourde à maintenir, et un peu trop manuelle à mon goût (bien que ça aie des avantages).

    Le problème principal que je rencontre, c’est l’interprétation des CSS et surtout des JS par PHP. En effet, je fais interpréter mes JS par PHP avec la directive Apache qui va bien, principalement afin de pouvoir passer des paramètres en GET à mes scripts (utile pour avoir de URLs absolues pour les requêtes Ajax par exemple). Bref, ça donne une flexibilité très appréciable.

    Je me demandais donc si vous saviez s’il était possible d’obtenir un tel fonctionnement avec Minify. Pour l’instant, je n’ai rien trouvé de mon côté, mais je vous tiendrai au courant si jamais je trouve mon bonheur.

    • Loïc dit :

      Bonjour,
      je dois avouer que je n’ai pas pris le temps d’essayer réellement minify…

      Bonne recherche

      • PJ dit :

        Plus je cherche, et plus j’ai l’impression que c’est impossible (sauf à utiliser l’option postprocessor, en fournissant une fonction qui va parser l’output avant de le servir, mais ça me semble risqué et relativement catastrophique en termes de perfs).

        • Loïc dit :

          Pour le postprocessor, je ne vois pas en quoi ce serait plus gourmand en ressource qu’un autre traitement ?
          Quel traitement souhaites-tu réaliser sur ton fichier avant de l’envoyer au navigateur ?

          • PJ dit :

            En fait, l’idée principale c’est de faire interpréter les JS et CSS par PHP, afin de pouvoir utiliser des variables PHP. Là, concrètement, je fais passer des paramètres GET à mes scripts, pour bénéficier de constantes définies côté PHP.
            Du coup, pour la solution avec postprocessor, à mon avis, il faudrait faire un gros eval() sur l’output. Je n’ai pas trop creusé cette solution, donc je n’en suis pas certain, mais à mon avis, ça va se résumer à ça. En plus, du coup, est-ce que la sortie du postprocessor est mise en cache ? Si oui, à la limite, bon… Ce n’est pas très grave. Mais sinon, gros problèmes de perfs en vue.

            Sinon, j’ai déjà une solution qui me paraît plus élégante et qui autorise plus de flexibilité. Je la peaufine un peu et je la partagerai dès qu’elle sera un minimum éprouvée. :-)

  • Leave a Reply

    Notifiez-moi des commentaires à venir via email. Vous pouvez aussi vous abonner sans commenter.

    Bienvenue sur mon blog.
    Il s'agit avant tout d'une zone de veille pour moi, un lieu où je stocke les astuces qui me serviront à nouveau plus tard.
    Au menu, du PHP, javascript, un peu de CSS et des astuces diverses...