Dernièrement, Google a lancé officiellement Google Closure, une gamme d’outils pour le javascript. Il y a trois volets dans Google Closure : Google Closure, Compiler, Google Closure, Library et Google Closure, Templates.

Closure Templates offre des modèles de projets pour programmer des applications en java. Du moins, c’est ce que j’en comprends. Puisque je travaille en .Net, je n’ai pas regardé cet aspect plus en détail.

Closure Library, comme le dit le nom, est un cadre d’application pour le javascript. Mais pour l’instant je préfère toujours jQuery.

Par contre, Closure Compiler est assez impressionnant, voici quelques explications.

Premièrement, j’aime bien les différentes possibilités d’utilisation du compilateur :

• Google Closure Compiler, En ligne sur le site officiel
• Google Closure Compiler, Directement dans Firefox avec Firebug
• Google Closure Compiler, Possibilité de créer son propre outil

Il y a trois modes de compilation pour Google Closure Compiler :

• Retrait des espaces blancs (Whitespace only)
• Renommage des fonctions et variables (Simple)
• Avancé

C’est de ce dernier que je parlerai car c’est ce qui est révolutionnaire. La compilation en mode avancée cherche à optimiser le javascript.

Exemple de base

Code initial


function printText(txt)
{
  alert("text : " + txt);
}
printText("aaa");


Code compilé

alert("text : aaa");

Explication

Puisque la méthode est simple, le compilateur élimine la déclaration de la fonction dans le but d’appeler directement son exécution. Un compilateur qui fait seulement renommer les fonctions aurait laissé la fonction en place ce qui aurait généré plus de texte.

Exemple légèrement plus complexe

Code initial


function printText(txt)
{
  if (txt == "")
  {
    alert("rien");
  }
  else
  {
    alert(txt);
  }
}
printText("");
printText("le texte");


Code compilé

alert("rien");alert("le texte");

Explication

Le compilateur ne fait pas seulement extraire le corps de la méthode, en fait il est capable d’interpréter le résultat dans le but de fournir le code optimal.

Exemple même complexité, plus de texte

Code initial


function printText(txt)
{
  if (txt == "")
  {
    alert("Le texte envoyé à cette fonction est vide");
  }
  else
  {
    alert ("Voici votre texte pour cette fonction : " + txt);
  }
}
printText("");
printText("le texte");


Code compilé


function a(b){b==""?alert("Le texte envoy\u00e9 \u00e0 cette m\u00e9thode est vide"):alert("Voici votre texte pour cette fonction : "+b)}a("");a("le texte");


Explication

Ici, c’est la même logique que l’exemple précédent par contre dû à la grosseur des chaînes de caractères le compilateur à laisser la méthode en place. Donc, l’élimination de la déclaration de la méthode ne se fait pas systématiquement, il y a une comparaison afin de savoir si oui ou non c’est optimal de retirer la fonction.

Attention

À moins que tout le javascript soit dans le même fichier il se peut que le code compilé ne fonctionne plus. Il est fortement suggéré de lire la documentation de la compilation avancée.

Malgré ça, le mode avancé de Google Compiler est le premier en son genre et je crois que ça deviendra un incontournable pour ceux qui veulent optimiser au maximum le javascript. Il ne serait pas étonnant que d’autres grands joueurs dans le domaine – YUI (Yahoo! User Interface Library) par exemple – offrent bientôt un outil similaire.