Les Frameworks JavaScript

Un article pour vous parler des frameworks JavaScript. Cela bouge pas mal dans ce secteur, je voulais donc faire un tour d’horizon des différents frameworks existants. Précision : je n’ai actuellement pas eu à en utiliser dans le cadre de projets, je n’ai donc pas de retour d’expérience à vous proposer. Il s’agit d’un état des lieux de l’existant pour connaître le marché, et ainsi pouvoir éventuellement intégrer ces frameworks dans de futurs choix techniques.

AngularJS

Frameworks Javascript - Angular JS
AngularJS est un framework javascript respectant le pattern MVC. Une de ses particularités est qu’il fait un binding bi-directionnel entre la vue et le modèle. Si une donnée est modifiée, la vue est mise à jour. Cela a pour effet de réduire considérablement les évènements, les manipulations de DOM et les multiples appels Ajax, choses classiques par exemple en jQuery. Cela présente un autre avantage : il y a une vraie séparation et la vue et le contrôleur ce qui en terme de maintenance et de testabilité est un gros plus.
Pour des premiers exemples basiques de code AngularJS, histoire de voir à quoi cela ressemble vous pouvez aller voir ce lien :
http://hugeen.wordpress.com/2013/02/02/mes-premiers-pas-avec-angularjs/
Un autre tuto sur le sujet : http://briantford.com/blog/huuuuuge-angular-apps.html
Site officiel : http://angularjs.org/

BackboneJS

Frameworks Javascript - BackBoneBackbone est plus léger et plus simple. Cela le rend plus facile à apprendre et appréhender, mais son niveau d’abstraction est plus faible. Il n’est également pas réellement MVC. Mais de la même manière, vous allez lier des vues à des modèles et éviter les appels Ajax dans tous les sens et le code spaghetti. De quoi faire une application single-page performante et facile à maintenir.
Pour voir des exemples de code BackboneJS, vous pouvez vous rendre à cette adresse :
http://documentcloud.github.io/backbone/docs/backbone.html
ou à cette adresse http://www.atinux.fr/2011/10/31/backbone-js-tutoriels-et-demo/
Vous pouvez trouver également un tutoriel sur Developpez.com : http://javascript.developpez.com/tutoriels/javascript/backbone-tutorial-13/
Site officiel : http://backbonejs.org/

EmberJS

Frameworks Javascript - Ember

Autre gros acteur avec les deux précédemment cités de ce secteur des framework MVC côté client, il arrive en ce début 2013 à maturité, après de nombreuses versions béta et quelques changements d’organisation en cours de route. Actuellement, il est en version 1.0 RC3. On retrouve dans l’organisation une certaine similarité avec Backbone et Angular, à savoir un routeur, une application, un modèle et une vue liée à ce dernier via un binding qui permet l’actualisation des données affichées. A noter le projet à part entière « Ember-data », qui est une couche en développement qui pourra se rajouter à EmberJs et qui est un ORM côté javascript. Il se charge donc de la communication avec le serveur (CRUD) et de la persistance des données.
Un tuto : http://blog.excilys.com/2013/01/09/introduction-a-ember-js/
Site officiel : http://emberjs.com/

Spine JS

spine-jsSpine semble un peu à part dans le monde des framework javascript. Déjà, il est écrit en CoffeeScript, langage non interprétable qui se compile en Javascript en sortie. Il semble également plus structurant. Entre Spine et Backbone, un développeur a fait son choix et nous l’explique, c’est instructif :
http://destroytoday.com/blog/reasons-for-spinejs/
A voir en pratique.
Site officiel : http://spinejs.com/

Dojo

dojoToolkitLogoApparu en 2008, c’est le premier qui a commencé à rationaliser les développements javascript. C’est maintenant un framework très important, comportant de nombreux modules à greffer au framework de base. Cela semble donc très puissant, mais peut être un peu plus compliqué d’accès.
Site officiel : http://dojotoolkit.org/

Flight

flight twitterAssez récent, il s’agit d’un framework Javascript créé et utilisé par Twitter. Il permet de créer des composants indépendants qui vont pouvoir interagir via des évènements.
Une présentation sur la ferme du web : http://www.lafermeduweb.net/billet/flight-le-framework-javascript-de-twitter-1514.html

Tour d’horizon

Quelques sites ont fait un tour d’horizon relativement exhaustif des frameworks Javascript. Il y a notamment le projet TodoMVC qui se propose de coder une liste de tâches (ToDo liste) dans les différents framework :
http://todomvc.com/
L’avatange est double :
– cela permet de comparer le code de chacun des frameworks sur un projet identique
– cela permet d’avoir une meilleure idée du nombre de framework javascript sur le marché
A noter également cet excellent article (en anglais) qui permet de se poser pas mal de questions au moment du choix du Framework MVC :
http://coding.smashingmagazine.com/2012/07/27/journey-through-the-javascript-mvc-jungle/

Autre outils javascript

En plus des frameworks Javascript, d’autres outils ou librairies ont fait leur apparition, et semblent mériter qu’on y regarde plus près.

Require.js : permet d’organiser son code Javascript, de gérer les dépendances entre les différentes librairies utilisées dans un projet, de gérer les variables globales, bref de rendre le tout un peu plus carré.
Voici deux tutos pour avoir une meilleure idée de ce que fait Require.js et de la manière dont l’utiliser :
http://chez-syl.fr/2012/12/requirejs-api-javascript-du-futur/
http://pullrequest.org/2012/01/04/requirejs.html
Site officiel : http://requirejs.org/

Chart.js : librairie Javascript permettant de faire facilement des graphiques dynamiques et pros.
Site officiel : http://www.chartjs.org/

Conclusion

Il semblerait qu’AngularJS tienne la corde en ce moment (mais comme dit précédemment, pour l’instant je n’ai pas de retour d’expérience et il faut parfois se méfier des effets de mode). Je pense que si j’avais un projet à démarrer, je regarderai en premier lieu ce framework pour voir de plus près ce que cela donne. Peut-être l’objet d’un futur article ?
Si de votre côté vous avez du vécu sur l’un ou l’autre de ces frameworks, n’hésitez pas à laisser un mot en commentaire pour alimenter le débat.

Un commentaire sur « Les Frameworks JavaScript »

Laisser un commentaire