Introduction à MooTools

| Synbioz | Bovino |

MooTools est un framework JavaScript, léger et orienté objet. Il est particulièrement adapté à l'élaboration d'applications Web.

Il vous permet d'écrire facilement du code robuste et flexible de manière portable (cross-browser). Son code est élégant et bien documenté autour d'une API cohérente.

L'article original peut être lu sur le blog de Synbioz : Introduction à MooTools.

Commentez ♪

- Titre : Introduction à MooTools

- Auteurs : Synbioz, Bovino

- Parution : 19 janvier 2012

- Licence : Les sources présentées sur cette page sont libres de droits et vous pouvez les utiliser à votre convenance. Par contre, la page de présentation constitue une œuvre intellectuelle protégée par les droits d'auteur. Copyright ®  . Aucune reproduction, même partielle, ne peut être faite de ce site et de l'ensemble de son contenu : textes, documents, images, etc. sans l'autorisation expresse de l'auteur. Sinon vous encourez selon la loi jusqu'à trois ans de prison et jusqu'à 300 000 € de dommages et intérêts.

Sommaire

- MooTools, qu'est-ce que c'est ?

- Pourquoi utiliser MooTools ?

- Compatibilité

- Bénéfices

- Modularité

- Aspect objet

- Les ajouts de MooTools

- MooTools vs jQuery

- Conclusion et remerciements

MooTools, qu'est-ce que c'est ?

En utilisant MooTools, vous aurez la possibilité de :

- créer des classes ;

- écrire du code en étant sûr que les objets natifs se comportent partout de la même manière ;

- avoir des objets natifs incluant toutes les fonctions qui font cruellement défaut au JavaScript natif ;

- gérer facilement les événements ;

- manipuler le DOM et ses objets ;

- rechercher des éléments grâce à un moteur de sélecteurs CSS3 ultrarapide ;

- faire de l'AJAX ;

- gérer les cookies ;

- ajouter des effets de transition ;

- …

À côté de cela, MooTools More propose des extensions à cette bibliothèque de base en lui permettant de s'enrichir à l'aide de :

- pseudoévénements ;

- gestion simplifiée des dates ;

- gestion des URI ;

- raccourcis clavier ;

- nouveaux effets ;

- gestion des assets ;

- gestion des locales ;

- …

Pour finir, une communauté très active enrichit l'écosystème de MooTools via des plugins proposés sur la forge.

MooTools respecte de manière stricte les standards et n'affichera donc aucun warning. La clarté de son API assure que vous n'aurez aucun mal à vous y mettre et vous y prendrez certainement plaisir !

Pourquoi utiliser MooTools ?

Compatibilité

MooTools grâce à son modèle de surcharge des prototypes (entre autres) permet d'assurer un maximum de compatibilité à travers les navigateurs. Voici ceux pour lesquels MooTools est testé :

- Safari 3+ ;

- Internet Explorer 6+ ;

- Mozilla Firefox 2+ ;

- Opera 9+ ;

- Chrome 4+.

Bénéfices

Utiliser MooTools fournit un certain nombre d'avantages par rapport au JavaScript natif :

- utilisation des notions objet (classes, instances et héritage) ;

- facilite le DRY (« Do not Repeat Yourself ») ;

- extensible et modulaire ;

- effets de transitions faciles à mettre en place ;

- amélioration du DOM pour faciliter la manipulation des éléments ;

- sélecteurs CSS3 pour les manipulations CSS ;

- possibilité de stocker et récupérer des informations directement dans les éléments.

Sa documentation claire et son API cohérente vous permettront de prendre rapidement la bibliothèque en main et vous y prendrez vite goût.

MooTools est également un très bon compagnon pour CoffeeScript.

Modularité

MooTools a été pensé pour être le plus modulaire possible. Premier bénéfice, en tant que développeur, il vous est possible de construire votre release de MooTools pour n'inclure que les modules dont vous avez besoin. Pratique pour alléger votre JavaScript quand vous n'avez besoin que des sélecteurs CSS3 par exemple.

La construction de votre bibliothèque se fait via le Builder qui existe aussi pour MooTools More.

Au-delà de cela, la philosophie de MooTools est de prendre les avantages de la flexibilité et de la puissance de JavaScript pour en accroître la modularité et les possibilités de réutilisation. La façon dont cette philosophie est mise en place en pratique permet aux développeurs de se sentir de suite à l'aise avec la bibliothèque. Tout semble naturel (pour le peu que l'on souhaite et que l'on aime programmer en objet) grâce à l'inclusion du principe des classes.

Les classes sont très simples à mettre en œuvre bien qu'elles soient très puissantes. On peut faire de l'héritage, des mixins, étendre une instance… On se met donc très vite à utiliser toute la puissance du système d'héritage par prototype propre à JavaScript via les classes MooTools bien plus amusantes et simples à utiliser.

Aspect objet

MooTools fournit tout le nécessaire pour construire et utiliser des classes, voici un exemple :

var Animal = new Class({
initialize: function(name) {
this.name = name;
}
});

var Cat = new Class({
Extends: Animal,

talk: function() {
return 'Miaou';
}

});

var Dog = new Class({
Extends: Animal,

talk: function() {
return 'Woof ! Woof !';
}

});

var animals = {
a: new Cat('Neige'),
b: new Cat('Le chat'),
c: new Dog('Ruby')
};

animals.each(function(animal) {
console.log(animal.name + ': ' + animal.talk());
});

Les ajouts de MooTools

Il serait bien trop long de vous décrire ici chaque ajout apporté par MooTools mais je vous conseille vivement de jeter un œil aux liens suivants pour en découvrir les fonctionnalités qui me semblent les plus utiles :

- Array ;

- String ;

- Function ;

- Class ;

- Element ;

- Fx ;

- Request ;

- DOMReady.

MooTools vs jQuery

L'un n'est pas meilleur que l'autre, n'allez pas vous y tromper. Les deux bibliothèques n'ont pas la même philosophie et c'est donc votre style de programmation qui vous fera pencher d'un côté. Je trouve que jQuery est particulièrement bien adapté au développement rapide qui n'est pas voué à la réutilisation. Si vous avez par contre plus de temps à consacrer à votre code et que vous souhaitez l'organiser, le modulariser et le partager, il y a alors de fortes chances que vous préfériez MooTools.

Il faut également noter que, bien que très active, la communauté MooTools est bien plus petite que la communauté jQuery. Vous trouverez sûrement moins de ressources, de blogs et devrez parfois plus vous impliquer pour résoudre vos problèmes. Il n'en reste pas moins que la mailing list sera utile pour vous dépanner et que les articles que vous trouverez seront souvent de qualité.

Je vous recommande cette lecture qui compare les possibilités des deux bibliothèques à travers des exemples de code.

Au final, les possibilités sont les mêmes mais vous n'écrirez pas votre code de la même façon avec l'un et l'autre. Mais après tout, tout est question de style non ? Et en ce qui concerne le style, je préfère MooTools !

MooTools a une approche objet alors que jQuery, lui, préfère l'approche fonctionnelle.

Conclusion et remerciements

Nous avons donc vu avec cette rapide introduction à MooTools, que cette bibliothèque est une vraie alternative à jQuery et Prototype. Le seul moyen de se faire une idée est d'essayer. Prenez-le pour un petit projet et voyez vos affinités avec l'API. Tout le monde n'adhérera pas, certains me diront « jQuery fait le même » mais en matière de programmation il faut se sentir à l'aise et prendre du plaisir.

Cet article a été publié avec l'aimable autorisation de Synbioz, l'article original peut être vu sur le blog de Synbioz.

Nous tenons à remercier michel.di et ClaudeLELOUP pour leur relecture attentive de cet article.