1. Présentation frameworks JS MV* (25/02/2016)
• But : choix de frameworks adaptés pour développer des applications
HTML5 compatibles web/mobile
• Exclus d’office : Sencha Ext JS (ticket d’entrée minimum de $4,340)
• Retenus :
• AngularJS et Angular 2 (en beta, sortie finale cette année) (Google)
• Ember.JS (société Tilde) (SproutCore 2.0)
• React (Facebook)
• Knockout (développeur Microsoft)
• Dojo Toolkit
• DoneJS
2. Comparatif frameworks JS MV*
Critère /
framework
AngularJS Angular 2 Ember.js Backbone.js React Knockout
Type de
framework
MVW (Model
View
Whatever)
MVW Pure MVC MV + VC V MVVM
Data / CRUD Non Non Oui Non Non Non
Data binding Oui Oui Oui (avec
Handlebars)
Basique (Clef-
Valeur)
Oui Oui
Injection de
dépendance
Oui Oui Oui Non Non Non
Facilité
d’écriture des
tests
+ ? + - + -
Templates Oui Oui Handlebars Underscore Non Oui
Templates
multi-niveaux
Oui Oui ? Non Non Oui
3. Comparatif frameworks JS MV*
Critère /
framework
AngularJS Angular 2 Ember.js Backbone.js React Knockout
I18n Oui En cours Non Non Non Non
Définition de
composants
Oui (nouvelles
balises HTML)
Oui Oui AuraJS /
Backbone UI
Oui Oui
Convention
over
Configuration
Non Non Oui Non Non Non
Taille
(minified)
151kb 1035kb
(beta6)
435kb 69kb 133k 54kb
Taille
(minified+gz)
53,24kb 207kb
(beta6)
90kb 7,3kb 38kb 22kb
Taille
(minified+gz)
avec
dépendances
53,24kb 207kb
(beta6)
136.2kb
(jQuery +
Handlebars)
43.5kb
(jQuery +
Underscore)
20.6kb
(Zepto +
38kb 22kb
4. Comparatif frameworks JS MV*
Critère /
framework
AngularJS Angular 2 Ember.js Backbone.js React Knockout
Deep-linking
(favoris)
Oui Oui Oui Oui Non Non
Routing Oui Oui Oui Oui Non Non
Validation Oui Oui Non Non Non Non
Structuration
du code
+ ? ++ (Structure
MVC à suivre
strictement)
= ? ?
Mobile Non Etudié pour (perfs) - Non React Native Non
Sécurité ++ (doc) ? + ? - -
Debogage + ? ++ - + -
Langages JS JS JS (ES5 / 6) ; TypeScript,
Dart (objets)
JS JS JSX JS
5. Comparatif frameworks JS MV*
Critère /
framework
Dojo Toolkit Donejs
Type de
framework
Librairie MVVM
Data / CRUD Non Non
Data binding Non Oui
Injection de
dépendance
Non Non
Facilité
d’écriture des
tests
+ +
Templates Non Oui
Templates
multi-niveaux
Non ?
6. Comparatif frameworks JS MV*
Critère /
framework
Dojo Toolkit Donejs
i18n Oui Non
Définition de
composants
Non ?
Convention
over
Configuration
Non Non
Taille
(minified)
118kb ?
Taille
(minified+gz)
42,9kb ?
Taille
(minified+gz)
avec
dépendances
42,9kb ?
7. Comparatif frameworks JS MV*
Critère /
framework
Dojo Toolkit Donejs
Routing Oui Oui
Deep-linking Oui Oui
Validation Non Non
Structuration
du code
= ?
Mobile Non Oui
Sécurité - -
Debogage - -
Langages JS JS JS
8. Comparatif frameworks JS MV*
Critère /
framework
Angular Angular 2 Ember.js Backbone.js React Knockout
Compétences
disponibles
x17 comparé à
Ember / React
N/A 1 ? 1 ?
Pérennité + (Google) +++ (Google)
(version 2)
- - +++ (Facebook) -
Compatibilité
autres technos
Doc / aide dispo +++ + ++ + ++ +
Facilité de
montée en
compétences
? ? ? ? ? ?
Scalabilité + +
Performances Annoncé
similaire à React
(DOM : x5
comparé à
Angular)
Gains en temps
de dev
+ + ++ = + +
Coût Open-source Open-source Open-source Open-source Open-source Open-source
9. Comparatif frameworks JS MV*
Critère /
framework
Dojo Toolkit Donejs
Compétences
disponibles
- -
Pérennité - --
Compatibilité
autres technos
? -
Doc / aide
dispo
Assez fouilli -
Facilité de
montée en
compétences
? ?
Scalabilité ? ?
Performances ? ?
Gains en
temps de dev
+ ?
Coût Open-source Open-source
11. Focus sur Angular
• Mobile : Angular Universal pour rendu côté serveur et chargement
initial plus rapide. Ionic et NativeScript pour concevoir des
applications hybrides et natives pour le mobile. Lazy loading. Web
Workers. https://angular.io/features.html
• Support navigateur : IE9+, Android 4.1+, Chrome, Edge, Firefox, Safari
• Angular 2 : Réduire la taille du framework est planifié pour la version
finale
12. Divers
• Dojo Toolkit : librairie utilitaire plutôt qu’un framework. Offre des
composants comme un Datagrid, le support du drag and drop, des
widgets menus, calendriers, boîtes de dialogues.
• Done JS : dépendant de Node.js
