frameworks HTML5 para un enamorado desarrollador de Flex

Question

He estado trabajando como desarrollador de flex por muchos años, creando aplicaciones realmente complejas. Con todo el bombo reciente, estoy interesado en aprender HTML5.

Lo que me gusta de la estructura Flex es que es una pila consistente, coherente y completa para construir RIA. Me gusta que tenga un amplio conjunto de componentes listos para usar, y un marco para extender y construir componentes de aspecto totalmente complejos y muy personalizados &.

¿Hay frameworks similares en el espacio HTML5?

Por la búsqueda que he hecho, veo que hay toneladas de scripts útiles .js que proporcionan componentes ingeniosos, efectos, etc. Sin embargo, no he podido encontrar un marco sólido js con un arquitecto maduro y biblioteca de componentes.

Esto me preocupa que al construir una aplicación compleja, pueda terminar escribiendo un montón de código de plomería para unir componentes dispares.

Sé que HTML5 todavía está en su infancia, por lo que si hay marcos prometedores que debería vigilar, me gustaría saber sobre ellos.

Mi lista de compras de los requisitos marco idóneo sería la siguiente:

• arquitectura de componentes sólidos (incluyendo los eventos del ciclo de vida)
• extensibles
• Los administradores de diseño
• navegador agnóstico
• Compatibilidad con datos de vinculante
• Soporte para complejo Desollamiento
• Abstracción de capas de servicios & protocolos (es decir., SOAP/JSON/servicios XML son todos un tipo de IRemoteService)

Junto con el marco de interfaz de usuario en sí, lo que los marcos existe en el espacio Javascript para

• Arquitecturas MVC. (Similar a Parsley, o Maté en el mundo Flex)
• inyección de dependencias
• Prueba de la unidad

Answer 1

Si usted es un desarrollador de Flex, entonces podría estar interesado en revisar las versiones de escritorio y móvil de Sencha Frameworks (mi empresa): Ext JS para aplicaciones de escritorio y Sencha Touch para aplicaciones móviles/tabletas.

Ext JS se centra en aplicaciones web de escritorio que pueden funcionar hasta IE6, por lo que no hay mucho espacio para ser "HTML5" y aunque podamos (nuestras nuevas características de gráficos utilizan Canvas, SVG o VML dependiendo del navegador en el que se encuentre).

Sencha Touch está enfocado en los navegadores móviles Android, iOS, Blackberry e IE9 (?), Por lo que podemos usar todo el CSS3, almacenamiento local, etc. que pueda sacudir un palo. Si está buscando un caso de prueba de lo que puede hacer cuando comienza con la suposición de un navegador moderno, entonces esto es todo.

Ext JS & Sencha Touch tiene componentes completamente descendentes. La mejor visión general de ambos componentes y diseños es this article que se escribió para Ext JS 2, aunque el modelo de componente y diseño no ha cambiado mucho para Ext JS 3. Los diseños obtienen una reescritura para Ext JS 4, que tendrá su primera versión beta este mes, para hacer que se parezcan más al sistema de diseño CSS3 Flexbox.

La extensibilidad es la consecuencia de tener un modelo de componente adecuado. Ext JS tiene un conjunto de componentes de extensión de usuario que se pueden mezclar y combinar. Un buen ejemplo de un componente profesional después del mercado es Ext Scheduler.. También hay un good tutorial on how to create components.

Enlace de datos: los componentes de la IU están vinculados a las tiendas, por lo que los elementos de la IU múltiple se actualizan con los nuevos datos a medida que cambian. Puede leer el store API reference para tener una idea de cómo funciona.

desollado Complex - Sencha Touch tiene un excellent theming system que está siendo portado a Ext JS 4 - pero Ext JS 3 y 2 son un poco más complicado que el tema debido a los requisitos de compatibilidad IE6 (hay que generar imágenes)

Las capas de servicios se abstraen con data proxy, which is extended for JSON, Http, XML etc.

Sencha Touch y Ext JS 4 tienen una arquitectura MVC (simple). Ext JS 3 y siguientes no.

Aquí es a good write-up on dependency injection in Ext JS (pero hay que generalizar al tacto)

para las pruebas unitarias, recomendamos Jasmine - que han salido de Pivotal Labs.

Ext JS y Sencha Touch son ampliamente utilizados: Ext JS principalmente para aplicaciones corporativas, pero hay muchas grandes empresas que lo utilizan como Salesforce, Marketo y más para usuarios enfocados externamente. Sencha Touch tiene a nice gallery of apps from our latest dev contest, deberías echarle un vistazo.

Si se preocupan por los útiles, también tenemos una interfaz gráfica de usuario de arrastrar y soltar diseñador y una herramienta de animación CSS3 (este último en vista previa para desarrolladores)

Answer 2

El para HTML 5 puede ser interesante para usted. http://html5boilerplate.com/

No estoy seguro acerca de los frameworks JS para MVC o Dependency, pero para pruebas unitarias Dojo's Harness (debido a nuevas restricciones de usuario no puedo publicar un segundo enlace, pero debería ser fácil de encontrar) es bastante poderoso . Me gustaría echar un vistazo a más cosas de Dojo, ya que hacen un trabajo bastante bueno con JS

Answer 3

Creo que le puede gustar el Sencha Framework que cumple con algunas de las cosas que está buscando.

Answer 4

Sproutcore es un marco de aplicación de JavaScript. Es completamente MVC con una infraestructura de observación/enlace de valor clave que reduce la cantidad de código de plomería que necesita para escribir, si lo usa correctamente.Es compatible con la mayoría de sus requisitos:

"Arquitectura de componentes sólidos (incluidos los eventos del ciclo de vida)": cada vista tiene un montón de eventos de ciclo de vida.

"Extensible" - Sproutcore admite mixins, y tiene su propia 'herencia de conversión de prototipos' a herencia clásica para que sientas que estás creando clases en JS.

"Administradores de diseño": diseña sus propios puntos de vista, dónde están, qué tan grandes son. Existen SplitViews que puede cambiar de tamaño y anidar, pero esta podría ser una área donde SC no cumple con sus requisitos (aunque puede implementar fácilmente cambiar el tamaño de la vista mediante la observación)

"Navegador agnóstico": es bastante agnóstico para el navegador , como cualquier otro marco JS será.

"Soporte para enlace de datos" - infraestructura de enlace muy extensa. Si vincula un campo de vista a un campo de modelo, se actualizará cuando se modifique el modelo.

"Soporte para skinning complejo" - pelado a través de css como cualquier otra aplicación web si no le gusta el tema predeterminado.

"Pruebas unitarias" - SC viene con un arnés de prueba qunit en su lugar. Cuando utiliza la herramienta de línea de comandos de SC para crear una clase (ya sea una M, una V o una C), la herramienta crea un apéndice de prueba para usted.

'HTML5' - una especie de concepto nebuloso para comenzar. SC definitivamente admite generar un manifiesto de aplicación html5 en las herramientas de compilación. Hay marcos disponibles para escribir en el almacenamiento local del navegador. Creo que más capacidades html5 entrarán en funcionamiento en un futuro cercano.

La aplicación NPR en la tienda de aplicaciones de Chrome y esta aplicación sudoku son ambas aplicaciones SC.

Answer 5

estoy en el mismo barco que tú. Todos los frameworks js que encontré requieren una gran cantidad de CSS para que sean la mitad de buenos que el flex nativo. La mayoría de los frameworks js más nuevos se dan por vencidos en los navegadores más antiguos.

La financiación y demostraciones geniales pueden hacer que meteor a largo plazo sea el ganador del framework js.

me gusta la simplicidad de AngularJS

aquí es una buena comparación de algunos de los más populares

http://blog.stevensanderson.com/2012/08/01/rich-javascript-applications-the-seven-frameworks-throne-of-js-2012/