Pourquoi et comment compresser Javascript ?

Pourquoi et comment compresser Javascript ?

Publié le 5 septembre 2008 par eroan dans Développement | 5 commentaires »

Très largement critiqué à une époque pour son manque de structure, le Javascript a su se faire une belle place dans le Web 2.0 grâce à des front-end tels que Prototype, Mootools ou encore JQuery. Ces derniers, en plus d’offrir des environnements de développement multi-plateformes hyper performants, permettent également de travailler en Ajax très simplement. Et oui, la technologie Ajax n’est ni plus ni moins que du Javascript permettant de faire des appels de fichiers sur des serveurs…

C’est en grande partie ce qui explique que les scripts Javascript prennent de plus en plus de poids. Alors qu’en 2001 une page pesait 60ko pour 5ko de Javascript, aujourd’hui les pages pèsent 20ko (grâce à l’adoption des techniques du css/xhtml) pour souvent plus de 50ko de Javascript. La tendance s’est donc inversée !

Face à ce constat, 2 pratiques se sont développées. Tout d’abord, les scripts sont maintenant de plus en plus souvent conservés dans des fichiers .js externes aux pages html. Le cache des navigateurs les conserve en mémoire, diminuant fortement les temps de chargement (heureusement d’ailleurs !). Mais, en plus de cela, des techniques de compression du code sont apparues. Les front-end Javascript dont je vous parlais plus haut sont par exemple proposés en modes compressés, à l’image de Mootools qui peut être téléchargé avec une compression YUI (de Julien Lecomte) ou JsMin (de Douglas Crockford).

Le souci, c’est que lorsque vous codez vous-même ou bien que vous trouvez des portions de code sur des sites d’entraide, il n’y a pas de compression. Or, il s’agit d’une science exacte qui n’admet pas de bidouilles : il faut utiliser un logiciel de compression, avec un algorithme, etc…

C’est ici qu’intervient JavascriptCompressor, un outil en ligne très simple d’utilisation. Il vous suffit de coller votre code dans la zone de texte du haut puis de cliquer sur le bouton « Compress » pour voir votre code apparaître compressé en dessous. L’outil permet également, chose étonnante, de décompresser un code javascript préalablement compressé ! C’est complet, rapide et gratuit alors… à vos Bookmarks ;)


5 commentaires sur “Pourquoi et comment compresser Javascript ?”

  1. 1 Philodido le 5 mai 2009 à 15:36

    Merci du tuyau eroan, je chercher justement à compresser mon code mootools.
    A+

  2. 2 Eroan le 5 mai 2009 à 18:06

    Mais de rien, c’est fait pour ça ;)

  3. 3 Alexandre le 10 juillet 2010 à 23:59

    Et oui, nos fichiers js prennent de plus en plus de poids :)

    Mais peut être qu’avec l’arrivée du css3, c’est le fichier css qui prendra du poids au détriment du js ?

    (ps : l’article n’est pas visible depuis la page d’accueil ou depuis sa catégorie)

  4. 4 Alexandre le 11 juillet 2010 à 17:16

    Autant pour moi, je n’avais pas vu que tu avais tweeté un ancien article ^^

  5. 5 Eroan le 11 juillet 2010 à 17:34

    Oui oui, pas grave ;)

Publiez un commentaire