jQuery, Mootools... les librairies JavaScript
Jeudi 3 avril 2008 à 01 h 12
Aujourd'hui je vais vous parler des librairies JavaScript. Tout bon informaticien qui se respecte est un gros fainéant qui a encore des morceaux de chips bolognaise dans sa barbe, composée de poils durs mais aussi de ceux de la puberté, vous savez, ceux qu'on a jamais vraiment voulu couper. Bref, il est tout à fait normal de ne pas vouloir refaire ce que des personnes ont déjà codé. C'est un fait (si bien sur ça ne vous apporte rien de plus qu'une perte de temps). Il arrive donc fréquemment lors de la conception d'un site Internet que l'on souhaite intégrer une fonctionnalité qui nous parait cool (en ce moment, il y a souvent le mot Ajax/Web2 qui traine a coté du nom de cette fonctionnalité) mais qui est franchement casse-couille à mettre en place. Heureusement pour vous, des librairies JavaScript sont là pour vous faire gagner un temps fou.
Elles ont pour but de vous faciliter la vie avec le JavaScript qui est par défaut un langage vraiment indigeste. Elles vous permettront avec une syntaxe facile et surtout en étant cross-browser (c'est à dire que le code produit le même résultat sur tous les navigateurs) de gérer vos pages HTML. Elles permettent d'accéder facilement à des éléments div, tableau, etc et entre autres d'y appliquer des effets pour les afficher, cacher, faire glisser de droite à gauche ou encore de les faire disparaitre avec un fondu des plus coquet. On peut aussi utiliser les fonctions d'XMLHttpRequest plus connu sous le doux nom d'Ajax pour pouvoir modifier votre page en interogeant des pages distances sans recharger toute votre page. Elles permettent aussi d'utiliser pas mal de fonctions qui vous faciliteront la tache tout au long de vos développements JavaScript. De quoi vous évitez beaucoup de boulot. Reste à décider lequel choisir.
jQuery (site officiel) : Surement le plus populaire. Il est facile à prendre en main et une des fonctionnalités que j'apprécie énormément c'est la possibilité d'enchainer les fonctions. Tester certaines fonctions ici mais la page et les démos ne montrent pas vraiment toutes les possibilités de ce framework.
Prototype (site officiel) : Très connu lui aussi et traine souvent avec script.aculo.us. C'est d'ailleurs son principal intérêt car il est à mon gout un peu moins bien que jQuery bien que mieux commenté. On se retrouve vite à faire en plusieurs lignes ce qu'on aurait fait en une seule avec jQuery. Vous pouvez voir des démos ici.
Mootools (site officiel) : Celui que j'utilise en ce moment. Je l'ai rajouté aussi sur Carrefour.fr par exemple, c'est un peu mon petit protégé du moment. Il dispose de très jolies animations, et possède une doc' agréable à lire et plutôt complète. De nombreux exemple sont disponible ici.
Dojo (site officiel) : je vous parle de celui là mais je ne l'ai pas encore testé. Il semble disposer d'énormément de fonctionnalité (mail, fisheye, etc) et à première vue dispose d'une documentation assez impressionnante. Par ici pour les démos.
Voilà, je n'ai pas parlé de Yahoo User Interface Librairy (YUI) que je ne connais pas du tout, ni de plusieurs autres frameworks. Bien sur la question que vous devez vous poser (si tout cela vous intéresse) c'est "lequel dois-je choisir ?" Et bien il n'y a pas vraiment de réponse. Certains framework sont plus rapide que d'autres. Certains offrent des fonctionnalités plus exotiques. C'est à vous de vous faire votre idée en fonction de vos besoins !
Elles ont pour but de vous faciliter la vie avec le JavaScript qui est par défaut un langage vraiment indigeste. Elles vous permettront avec une syntaxe facile et surtout en étant cross-browser (c'est à dire que le code produit le même résultat sur tous les navigateurs) de gérer vos pages HTML. Elles permettent d'accéder facilement à des éléments div, tableau, etc et entre autres d'y appliquer des effets pour les afficher, cacher, faire glisser de droite à gauche ou encore de les faire disparaitre avec un fondu des plus coquet. On peut aussi utiliser les fonctions d'XMLHttpRequest plus connu sous le doux nom d'Ajax pour pouvoir modifier votre page en interogeant des pages distances sans recharger toute votre page. Elles permettent aussi d'utiliser pas mal de fonctions qui vous faciliteront la tache tout au long de vos développements JavaScript. De quoi vous évitez beaucoup de boulot. Reste à décider lequel choisir.
jQuery (site officiel) : Surement le plus populaire. Il est facile à prendre en main et une des fonctionnalités que j'apprécie énormément c'est la possibilité d'enchainer les fonctions. Tester certaines fonctions ici mais la page et les démos ne montrent pas vraiment toutes les possibilités de ce framework.
Prototype (site officiel) : Très connu lui aussi et traine souvent avec script.aculo.us. C'est d'ailleurs son principal intérêt car il est à mon gout un peu moins bien que jQuery bien que mieux commenté. On se retrouve vite à faire en plusieurs lignes ce qu'on aurait fait en une seule avec jQuery. Vous pouvez voir des démos ici.
Mootools (site officiel) : Celui que j'utilise en ce moment. Je l'ai rajouté aussi sur Carrefour.fr par exemple, c'est un peu mon petit protégé du moment. Il dispose de très jolies animations, et possède une doc' agréable à lire et plutôt complète. De nombreux exemple sont disponible ici.
Dojo (site officiel) : je vous parle de celui là mais je ne l'ai pas encore testé. Il semble disposer d'énormément de fonctionnalité (mail, fisheye, etc) et à première vue dispose d'une documentation assez impressionnante. Par ici pour les démos.
Voilà, je n'ai pas parlé de Yahoo User Interface Librairy (YUI) que je ne connais pas du tout, ni de plusieurs autres frameworks. Bien sur la question que vous devez vous poser (si tout cela vous intéresse) c'est "lequel dois-je choisir ?" Et bien il n'y a pas vraiment de réponse. Certains framework sont plus rapide que d'autres. Certains offrent des fonctionnalités plus exotiques. C'est à vous de vous faire votre idée en fonction de vos besoins !
Y'a des trucs vraiment pas mal sur YUI, le YUI reset CSS par exemple.
De plus Mootools est très sympa à prendre en main et très souvent mis à jour.
Moi perso c'est mon préféré : c'est juste un framework (pas de trucs inutiles concernant l'UI, contrairement à YUI), et il est vraiment très facile a prendre en main, tout en permettant de réduire un maximum son code.
Si j'veux une fonctionnalité, je préfère la créer, quitte à me faire chier pour qu'elle marche mais au moins, j'aurais pas re-sucer un code utilisant une librairie.
Mais attention! J'ai pas dis que ça ne servait pas ! J'utilise pour ma part la librairie XHRClass de Thanh et ça me sert que pour l'Ajax en fait.
Les slides, effects fade in/out, je code et la documentation du web est assez complète pour que mon code soit rétro-compatible et fonctionnel.
J'ai jamais vraiment trop compris l'intérêt des librairies toutes faites qui font qu'en fin de compte t'as pas developpé de lignes de code mais t'as juste utilisé une appli web de quelqu'un d'autre.
Super pour la créativité et la découverte du fonctionnement du comment ça marche :s !
P.S: Je sens venir les remarques me prouvant le contraire, je vous écoute :)
Il vaut quand même mieux réfléchir à comment améliorer la navigation à l'aide de ses outils plutôt que de réinventer la roue à chaque fois.
Un framework comme Mootools permet d'étendre et d'améliorer considérablement Javascript pour le mettre pratiquement au niveau d'un AS3, en plus d'y ajouter une tonne de fonctionnalité et de raccourcis (surtout pour la manip du DOM) et autre oubli des versions JS embarquées par IE.
Moi en tout cas non, j'aurais l'impression d'avoir fait ce qu'un enfant connaissant jQuery/rOnRail/etc pourrait faire en tapant la bonne ligne de code.
Okay pour le cas d'Anonyme, ça aide vachement à developper son appli; je le reconnais pour symphony.
Okay pour le cas de Netsabes, mais là si t'as pas le temps à consacrer pour developper tes appli, autant prendre un CMS, quelque chose de déjà mis en place.
Mais pour ce qui est du cas de jQuery, j'ai l'impression de me servir d'un langage dans un langage, à la fin ya pas de créativité/et/ou de prise de tête; ça a jamais aidé à comprendre comment le système fonctionnait.
Pour ma part, je n'utilise qu'XHRClass comme j'ai dis plus haut et je developpe mon framework se servant de cette classe. Certains diront que c'est con vu que les autres ont déjà fait ça, que ça a eu tellement de reflexion qu'au bout du compte c'est stable et plus productif.
Mais, je préfère (et c'est mon avis) faire mon framework, mes classes de A à Z qui seront réutilisées dans mes autres projets (bien qu'interne) et dont le but n'est pas d'être distribué publiquement non plus, mais au moins, je pourrais modeler comme je le souhaite et savoir ce que telle ou telle fonction fait et comment la modifier, ajouter des possibilités plutôt que de prendre quelque chose qui va tout me macher et dont je n'aurai aucun contrôle de modification, juste d'execution.
Je sais pas si on peut apparenter ça à un effet de mode, ya tellement de site maintenant qui utilise les différentes librairies et langage dans un langage que ça devient naturel. Je remet pas en cause l'utilité de la chose, je dis juste qu'on répare pas forcement une voiture parce qu'on a pris les bons outils.
Je veux dire, ton discours sonne très cool etc. Mais c'est à cause de ça qu'on avance pas et que les systèmes d'infos sont lents... Tu imagines si tout le monde faisait comme toi ? "Oh bien sur je pourrais re-utiliser mySQL mais je ne comprendrais pas tout ce qu'il y a derrière, je vais donc me faire mon propre système de base de données." Je prends un exemple extrème mais tu vois ou je veux en venir ?
Personnellement je préfère partir de ces frameworks et essayer d'être créatif à un niveau supérieur. Et c'est là que ça devient intéressant. Et puis, je suis sur que tu n'es pas idiot et que tu n'as pas besoin de refaire de fond en comble un framework JS pour le comprendre. Pourquoi ne pas essayer d'améliorer l'expérience utilisateur ? Pourquoi ne pas essayer de pousser ces frameworks pour voir ce qu'on peut en tirer ?
Je comprends totalement ton point de vue. Mais pour moi ce n'est pas la bonne façon de faire avancer les choses. Et puis rien ne t'empêche de taper dans ses librairies. C'est l'intérêt de l'opensource, monde auquel tu n'as pas l'air d'appartenir.
Par contre à la lecture de ton commentaire je ne sais pas vraiment si on est sur la même longueur d'onde quand on parle de re-use etc. Donc ne prend pas mal mon commentaire s'il te plait.
Dans tout ce que je dis, je le dis pour un aspect tout à fait personnel, du coding fait maison, pour des projets persos ou autre; pour le domaine professionnel en entreprise où l'utilisation de librairies est plus que recommandée (bien que ce soit des librairies maisons), ça ne concerne pas ça.
T'as vraiment pas l'impression que quand tu utilises des classes, librairies, etc... tu composes plutôt qu'impose ? Tu as pas la sensation d'être l'auteur de ton taff, t'as l'impression d'avoir appuyer sur le bon bouton au bon moment, d'avoir agencer les bonnes chose aux bons endroits; je ne ressent carrément pas cette sensation de fierté d'avoir fait un travail propre et qui va où je lui ai demandé d'aller.
En ce qui concerne l'open source, je trouve ça louable de mettre à disposition ces librairies, je n'ai rien contre l'open-source et bien qu'ayant quelques projets de ci-de la, j'ai même pour projet d'en mettre un (bien que je préfère une license CC que GNU GPL) à disposition.
Après, c'est peut être (surement) parce que je me suis fait tout seul au langage info. que j'ai ça dans les veines de savoir exactement ce que je veux faire et comment je vais le faire; et donc renie un peu ce qui est déjà fait, parce que je pourrais le refaire avec le bonus +1 de compréhension du fonctionnement. Mon discours semble cru, limite anti-sociable, à la limite d'une croisade contre les users de lib mais non, ce n'est que mon point de vue, que vous utilisiez telle lib qu'une autre, je vous aimerais du pareil au même.
Ce que je pourrais rajouter aussi comme argument serait qu'un framework intègre beaucoup de chose. Ces choses, sont-elles vraiment nécessaires à tous les niveaux ? Si tu veux juste manipuler le DOM, pourquoi t'embéter à prendre les effets stylisées avec ? (Bon okay ce n'est que quelques ko en plus, une fourmi...). Mais je ne vois pas que des bons effets dans un framework, chose que ton article semble oublié quand tu en parles.
Je suis dans une optique d'apprentissage plutôt que d'utilisation mais ça je sais que tu l'avais compris.
J'ai d'autres amis de ton point de vue, qui me prenne pour un fou, à refaire de A à Z quelque chose déjà fait et le discours n'abouti pas à la fin. Je ne pense pas paraître cool, ni a me démarquer, c'est juste que j'ai l'impression de voir tout le monde foncer sur ces nouvelles extensions de langage comme s'il s'agissait du messie pour coder mieux et plus rapidement. Là, où moi je vois une perte de l'apprentissage des langages et de se creser la tête pour réussir à faire marcher ce p**** de code qui bug!
Mon intérêt est de comprendre, donc j'ai vite choisis mon camp. Ton discours est valable aussi, je n'ai rien contre tes propos; juste que ça ne correspond pas à l'idée que je m'y fait.
Sympa, ce petit débat. Même si tu voulais avoir des echos sur qui utilise quoi, désolé d'avoir plombé le truc avec mes questions =)
(D'ailleurs, j'utilise actuellement XHRClass et Lightbox v2 (mais là aussi j'ai fait mon propre lightbox avant d'intégrer celui là à mes projets)
Autant pour moi...
Cet article est très intéressant. Parler de JQuery est une action
d'utilité publique pour le web.
Vous pouvez consulter plus d'informations sur le site http://www.webjax.eu
et plus particulièrement la rubrique http://www.webjax.eu/r/14-JQuery-javascript-framework-ajax-library-jquery-j-query-Framework-Javascript-Library-Ajax-asyncronous-web2.0-ria-dom-control-enhancer
qui présente la documentation officielle de Jquery en version française.
Vive le web2.0 et ajax, longue vie aux codeurs :-)