Avantages et inconvénients des trois frameworks MVVM : vue, angulaire et avalon_Others

Le contenu principal de cet article est résumé en faisant référence à la documentation officielle :

Vue.js

Vue.js @You Yuxi est une bibliothèque pour créer des interfaces Web interactives. Il s'agit d'un MVVM simplifié. D'un point de vue technique, Vue.js se concentre sur la couche ViewModel des modèles MVVM. Il connecte la couche Vue et la couche Modèle via une liaison de données bidirectionnelle. L'encapsulation DOM réelle et le format de sortie sont résumés dans des directives et des filtres. Par rapport à d'autres bibliothèques, Vue.js est une petite mais belle bibliothèque. L'objectif principal de l'auteur est de produire des composants de liaison de données réfléchissants et de vue composable via une API aussi simple que possible.

Avantages :

Simple : la documentation officielle est très claire et plus facile à apprendre qu'Angular.
Rapide : mettez à jour le DOM en mode batch asynchrone.
Composition : Composez votre application avec des composants découplés et réutilisables.
Compact : ~ 18 Ko min + gzip, et aucune dépendance.
Puissant : expressions et propriétés calculées sans déclarer de dépendances.
Compatible avec les modules : il peut être installé via NPM, Bower ou Duo. Il n'oblige pas tout votre code à suivre les différentes réglementations d'Angular et les scénarios d'utilisation sont plus flexibles.

Inconvénients :

Nouveau-né : Vue.js est un nouveau projet, version 0.10.0 Release Candidate publiée le 20 mars 2014. La dernière version sur github est la version 0.11.4, qui n'est pas aussi mature qu'angular.
L'impact n'est pas très grand : je l'ai recherché sur Google et j'ai découvert que la diversité ou la richesse de Vue.js est inférieure à celle de certaines autres bibliothèques bien connues.
Ne prend pas en charge IE8 : Haha, mais AngularJS 1.3 a également abandonné le support d'IE8, mais l'avalon du professeur @ Stu Zhengmei prend en charge IE6+, donc beaucoup d'efforts devraient être faits pour l'optimiser. Ce n'est pas bon pour les projets qui doivent prendre en charge IE8, mais c'est aussi une tendance dans le développement web front-end. Les versions inférieures d'IE devraient se retirer du stade de l'histoire en changeant notre pensée front-end, plutôt que de s'y conformer. qui utilisent des versions plus anciennes. Les personnes qui ne mettent pas à niveau. Le professeur @玉博 a dit quelque chose, et je pense que c'est très bien. « De nos jours, la prise en charge d'IE6 et 7 n'est plus une fonctionnalité, mais c'est dommage. Nous travaillons dur pour promouvoir Alipay afin qu'il ne prenne pas en charge IE6 et 7. Nous attendons avec impatience. à d'autres frères qui nous rejoignent." ".

AngularJS

AngularJS est très populaire ces derniers temps et compte de nombreux adeptes. Framework MVW JavaScript super-héroïque
La déclaration officielle est très simple : « Une technologie côté client entièrement écrite en JavaScript. Utilisée en conjonction avec d'autres technologies Web établies de longue date (HTML, CSS et JavaScript) pour rendre le développement d'applications Web plus simple et plus rapide que jamais. » Lorsque vous l'apprendrez, je pense que vous serez attiré par ses nombreux nouveaux effets spéciaux.

Avantages :

Vue dynamique : je n'ai jamais pensé que js puisse étendre les attributs du HTML de cette manière, mais AngularJs l'a fait. Il ajoute de nombreuses fonctions d'extensibilité à notre HTML statique, et c'est comme si le HTML prenait vie.
Parfait : il s'agit d'un framework MVW frontal relativement complet, comprenant des modèles, la liaison de données bidirectionnelle, le routage, la modularisation, les services, l'injection de dépendances et d'autres fonctions. Les modèles sont puissants et riches, déclaratifs et dotés d'une multitude d'Angular. instructions. .
Maintenance Google : AngularJS est maintenu par Google. Il dispose sans aucun doute d'un backend puissant. Il présente des avantages évidents par rapport à Vue.js et avalon en termes de promotion et de maintenance. La communauté est également très active et peut bien promouvoir son développement.
AngularJS & Ionic : Ionic : Advanced HTML5 Hybrid Mobile App Framework, ces deux-là sont de bons amis. Ionic utilise AngularJS pour créer un framework le plus adapté au développement d'applications riches et puissantes. La dernière fois, Yu Zhihu a répondu à une question connexe sur le développement d'applications Web. Quel framework et quelle plate-forme d'applications packagées offrent les meilleures performances et efficacité ? - La réponse de Tang Wei, les détails peuvent être trouvés ici.

Inconvénients :

Large et complet : il est difficile d'apprendre. Pour moi, la courbe d'apprentissage est très tortueuse et difficile à comprendre.
Annuler et réécrire : il y a quelque temps, je suis allé voir la communauté et j'ai découvert qu'AngularJS 2.0 renverserait et réécrirait les deux frameworks précédents. Ce sont essentiellement deux frameworks. Cela signifie qu'après la sortie de la version 2.0, vous en avez besoin. pour repartir de zéro, mais j'ai aussi dit Revenez, /article/79637.htmCet article explique très bien les changements dans AngularJS2.0.
Il ne prend pas en charge IE8 ou version antérieure. Il semble que la version 2.0 ne prenne en charge que les terminaux mobiles.

Avalon.js

Avalon.js est un mini framework MVVM simple et facile à utiliser écrit par @ Stu Zhengmei. Il a été publié pour la première fois le 15 septembre 2012. Il a été développé pour résoudre le problème des différentes présentations de vues pour la même logique métier. . Vous pouvez souvent voir des enseignants promouvoir son Avalon.js et publier de nombreux tutoriels, ce qui est sans aucun doute très pratique pour les Chinois qui apprennent Avalon.js.

Avantages

Facile à utiliser, ajoutez une liaison en HTML, définissez ViewModel avec avalon.define en JS, puis appelez la méthode avalon.scan, et ça bougera !
Compatible avec IE6 (autres frameworks MVVM, KnockoutJS(IE6), AngularJS(IE9), EmberJS(IE8), WinJS(IE9)) et avalon.mobile, qui peut fonctionner plus efficacement dans les versions plus récentes de navigateurs tels que IE10
Aucune dépendance, moins de 5000 lignes, moins de 50 Ko après compression
Prend en charge les fonctions de filtre de style de caractère pipe pour faciliter la sortie formatée
La granularité de l'actualisation locale a été affinée en un nœud de texte, un nœud de fonctionnalité
Le nœud à utiliser est lié à la fonction d'actualisation de la vue lors de la première analyse et mis en cache, il n'y a donc pas de place pour que le sélecteur apparaisse.
Rendre le code de manipulation DOM presque éteint
Utilisez un mécanisme de couverture superposée de type CSS pour permettre à chaque partition ViewModel de restituer la page alternativement
Lorsqu'un nœud est supprimé, la fonction de rafraîchissement de la vue correspondante est intelligemment déchargée pour économiser de la mémoire
Les données d'exploitation signifient l'exploitation du DOM, et les opérations sur ViewModel seront synchronisées avec View et Model
Livré avec un chargeur de module AMD, éliminant le besoin d'intégration avec d'autres chargeurs.

Inconvénients

1. Le filtrage de tableau n'est pas aussi complet que le filtre angulaire d'Avalon ne peut être utilisé que pour ms-text, ms-html

.

2. Il n'existe pas de document en anglais et la publicité est restreinte

3. Le skin d'OniUI n'est pas assez beau. Beaucoup de gens disent qu'ils doivent coopérer avec boostrap, mais personne dans la communauté n'a pris l'initiative de le faire