¿Cuáles son las ventajas y desventajas entre los tres marcos MVVM: vue, angular y avalon?

Autor: Tw93

Fuente: Zhihu

Los derechos de autor pertenecen al autor. Comuníquese con el autor para obtener autorización para la reimpresión.

Vue.js

Vue.js @You Yuxi es una biblioteca para crear interfaces web interactivas. Es un MVVM optimizado. Desde una perspectiva técnica, Vue.js se centra en la capa ViewModel de los modelos MVVM. Conecta la capa de Vista y la capa de Modelo a través de un enlace de datos bidireccional. La encapsulación DOM real y el formato de salida se resumen en Directivas y Filtros. En comparación con otras bibliotecas, Vue.js es una biblioteca pequeña pero hermosa. El objetivo principal del autor es producir enlaces de datos reflexivos y componentes de vista componibles a través de una API lo más simple posible.

Ventajas:

Simplicidad: La documentación oficial es muy clara y más fácil de aprender que Angular.

Rápido: Actualiza DOM en procesamiento por lotes asíncrono.

Composición: Combina tus aplicaciones con componentes desacoplados y reutilizables.

Compacto: ~18kb min+gzip y sin dependencias.

Potente: Expresiones y propiedades calculadas sin declarar dependencias.

Compatible con módulos: se puede instalar a través de NPM, Bower o Duo. No obliga a todo el código a seguir las diversas regulaciones de Angular y los escenarios de uso son más flexibles.

Desventajas:

Recién nacido: Vue.js es un proyecto nuevo. La versión 0.10.0 Release Candidate se lanzó el 20 de marzo de 2014. La última versión en github es 0.11. La versión 4 no es tan madura como angular.

El impacto no es muy grande: lo busqué en Google y descubrí que la diversidad o riqueza de Vue.js es menor que la de otras bibliotecas conocidas.

No es compatible con IE8: jaja, pero AngularJS 1.3 también abandonó el soporte para IE8, pero el avalon del profesor @Stu Zhengmei es compatible con IE6+, por lo que se deben hacer muchos esfuerzos para optimizarlo. Esto no es bueno para proyectos que necesitan soportar IE8, pero también es una tendencia en el desarrollo front-end web. Las versiones inferiores de IE deberían retirarse del escenario de la historia cambiando nuestro pensamiento front-end, en lugar de conformarse a ellos. que usan versiones anteriores. Personas que no actualizan. El profesor @玉博 dijo algo y creo que es muy bueno: "En estos días, admitir IE6 y 7 ya no es una característica, sino una pena. Estamos trabajando duro para promover que Alipay no admita IE6 y 7. Esperamos con ansias. para que más hermanos se unan a nosotros." ".

AngularJS

AngularJS es muy popular recientemente y tiene muchos seguidores. Marco MVW de JavaScript superhéroe

La declaración oficial es muy simple: "Tecnología del lado del cliente escrita íntegramente en JavaScript. Utilizada junto con otras tecnologías web de larga data (HTML, CSS y JavaScript), el desarrollo de aplicaciones web es Más fácil que nunca. Cuando lo aprendas, creo que te atraerán sus numerosos efectos especiales nuevos.

Ventajas:

Vista dinámica: nunca pensé que js pudiera extender los atributos de HTML de esta manera, pero AngularJs lo ha hecho. Agrega muchas funciones de extensibilidad a nuestro. HTML estático. Hay una sensación de hacer que el HTML cobre vida.

Perfecto: es un marco MVW front-end relativamente completo, que incluye plantillas, enlace de datos bidireccional, enrutamiento, modularización, servicios, inyección de dependencia y otras funciones. es declarativo. Viene con ricas instrucciones angulares.

Mantenimiento de Google: AngularJS es mantenido por Google. Sin duda, tiene un backend poderoso. Tiene ventajas obvias sobre Vue.js y avalon en términos de promoción y mantenimiento. su desarrollo.

AngularJS e Ionic: Ionic: marco de aplicación móvil híbrido HTML5 avanzado. Estos dos son buenos amigos. Ionic usa AngularJS para crear el marco más adecuado para desarrollar aplicaciones ricas y potentes. La última vez, Yu Zhihu respondió una pregunta relacionada sobre el desarrollo de aplicaciones web. ¿Qué marco y plataforma de aplicaciones empaquetadas tienen el mejor rendimiento y eficiencia? - Respuesta de Tang Wei, los detalles se pueden encontrar aquí.

Desventajas:

Amplio y completo: es difícil de aprender, para mí la curva de aprendizaje es muy tortuosa y difícil de entender.

Anular y reescribir: visité la comunidad hace algún tiempo y descubrí que AngularJS 2.0 anulará y reescribirá los dos marcos anteriores. Son básicamente dos marcos. hasta que salga 2.0 Debes comenzar desde el principio, pero, de nuevo, @ Xu Fei [Traducción] Todo sobre Angular 2.0 · Número 8 · xufei/blog · GitHub Este artículo explica muy bien los cambios en AngularJS2.0.

No es compatible con IE8 o inferior. Parece que 2.0 solo es compatible con terminales móviles. Esperemos hasta su lanzamiento.

Avalon.js

Avalon.js es un mini marco MVVM simple y fácil de usar escrito por el Sr. Situ Zhengmei. Se lanzó por primera vez el 15 de septiembre de 2012 para resolver el problema. misma lógica de negocios. Hay varias vistas desarrolladas para la presentación. A menudo se puede ver a profesores promocionando su Avalon.js y publicando muchos tutoriales, lo que sin duda proporciona una gran comodidad a las personas en China que aprenden Avalon.js.

Ventajas

Fácil de usar, agregue enlace en HTML, defina ViewModel con avalon.define en JS, luego llame al método avalon.scan y ¡se moverá!

Compatible con IE6 (otros marcos MVVM, KnockoutJS(IE6), AngularJS(IE9), EmberJS(IE8), WinJS(IE9)) y avalon.mobile, que puede ejecutarse de manera más eficiente en IE10. la nueva versión del navegador

Sin dependencias, menos de 5000 líneas, menos de 50 KB después de la compresión

Admite la función de filtro de estilo de caracteres de tubería para facilitar la salida formateada

La granularidad de la actualización local se ha refinado a un nodo de texto, nodo característico

El nodo que se operará está vinculado a la función de actualización de vista en el primer escaneo y se almacena en caché, por lo que no hay espacio para que aparezcan selectores. .

Hacer que el código de operación DOM esté casi extinto

Utilizar un mecanismo de cobertura superpuesta similar a CSS para permitir que cada partición de ViewModel represente la página alternativamente

Cuando se elimina el nodo , la función inteligente desinstale la actualización de vista correspondiente para ahorrar memoria

La manipulación de datos significa operar DOM, y las operaciones en ViewModel se sincronizarán con View y Model

Viene con un cargador de módulos AMD , eliminando la necesidad de interactuar con otras integraciones de Loader.

Desventajas

Las desventajas se pueden ver aquí. En comparación con Angular, ¿cuáles son las desventajas de Avalon? - Respuesta de Situ Zhengmei

Finalmente terminé mi respuesta. Todavía hay algunos errores que no encontré y espero que puedas señalarlos.