Hummingbird vs Angular Dart

¡Me alegro de que lo preguntes! Vamos a tratar de entender qué son las Aplicaciones de Página Única, qué son las Aplicaciones Web Progresivas, y ver los resultados esperados de Angular y Hummingbird. Esto nos ayudará a entender los problemas que pretenden resolver.

SPAs vs PWAs

Aplicaciones de una sola página

Una aplicación de una sola página (SPA) es una aplicación o sitio web que interactúa con el usuario reescribiendo dinámicamente la página actual en lugar de cargar páginas nuevas enteras desde un servidor. – Wikipedia

El carácter #cuando se incluye en las URLs, en lugar de provocar la recarga de la página, provocará alguna interacción dentro de la misma. Las SPAs hacen uso de esta característica del navegador.

Por ejemplo, en Wikipedia, si hacemos clic en un título del índice, en lugar de recargarse la página, el navegador nos lleva a esa sección de la página.

• Ir a https://www.wikiwand.com/en/Single-page_application#/Ajax
• Cambiar Ajax por Websockets y pulsar enter.
• ¿Se recargará la página? No. Simplemente cambiará la configuración

Las APS están llevando esto al siguiente nivel. Toda la aplicación y todas sus pantallas funcionan desde una única página utilizando las URLs basadas en #para todas sus funcionalidades.

Las PWAs

Las Progressive Web Apps son experiencias de usuario que tienen el alcance de la web, y son fiables, rápidas y atractivas

– developers.google.com

Las PWAs son sitios web (pueden ser sitios web normales, o apps de una sola página) que están optimizados de una manera determinada para que

• Funcionen de forma fiable tanto fuera de línea como con Internet no fiable (Lie-Fi)
• Son rápidas, optimizadas para un alto rendimiento percibido
• Engaging – Feel like a native application and no less.

¿Qué hace AngularDart?
AngularDart o Angular en general es un framework para escribir SPAs. Proporciona a los desarrolladores una forma de escribir las SPAs con características como:

• Bidirectional Data Binding
• Routing
• Templating
• Directives

Y mucho más. La interfaz de usuario real se sigue escribiendo con HTML + CSS. Angular simplemente proporciona todo lo demás que permite a los desarrolladores web desarrollar sus SPAs. El punto principal es:

• Angular Dart no es un UI Framework
• Las apps de Angular Dart pueden o no ser PWAs

¿Qué son entonces los Angular Web Components?
Son un montón de componentes de material design proporcionados por el paquete angular_components que actúan como plantillas con las que construir aplicaciones.

• No están soportados en Internet Explorer
• Siguen estando escritos en HTML + CSS + Dart

¿Qué hará Hummingbird?
Hasta ahora son sólo especulaciones. Su objetivo será convertir cualquier aplicación de Flutter en una PWA. Podría ser o no una SPA(lo más probable es que lo sea). Sin embargo, tratará de hacer todo lo que hace flutter.

Con él podríamos utilizar el Flutter UI Framework, utilizar todas las características del SDK de flutter como los widgets de gestión de estados y todo… y con un solo clic, producir una PWA junto a las aplicaciones de Android e iOS que ya tenemos!

Hay muchos desafíos en el camino, pero si Google se da cuenta de esto, será el ser todo de los SDK.

El estado de las All-Dart Apps

Intentemos entender la diferencia entre las combinaciones Flutter + AngularDart y Flutter + Hummingbird si fuéramos a escribir un conjunto de aplicaciones all-dart de aplicaciones para web y nativas.

EL PRESENTE: Flutter + Angular Dart
Para escribir una aplicación de este tipo necesitaremos:

• Escribir un paquete core que contenga toda la lógica de negocio, asegurando que no tenga dependencias de angular o flutter, y que todas esas dependencias le sean inyectadas desde el exterior
• Escribir la PWA de Angular suscribiendo al core para todas las funcionalidades
  * UI con HTML + CSS o componiendo componentes de angular
  * Routing, gestión de estados con la forma de hacer las cosas de Angular
• Escribir una aplicación de Flutter suscribiendo al mismo núcleo para todas las funcionalidades
  * UI con el framework de UI de flutter
  * Enrutamiento, gestión de estados, etc. con la forma de hacer las cosas de flutter
• Compilar a iOS y Android desde el proyecto de flutter
• Compilar a Web desde el proyecto de Angular

¿Se reduce la cantidad de trabajo al compartir el código?
Aunque compartir código definitivamente reduce la «cantidad de código», en mi experiencia no ha reducido realmente la cantidad de trabajo que hay que hacer. Me obliga a ser mucho más reflexivo a través del proceso.

¿Cuáles son los beneficios entonces?

• El código es más limpio y la arquitectura es mejor
• Me veo obligado, y es más fácil para mí mantener la paridad de características a través de las plataformas ahora.

EL FUTURO: Flutter + Hummingbird
Para escribir una aplicación de este tipo necesitaremos:

• Escribir una aplicación flutter
  * UI con el framework flutter
  * Enrutamiento, gestión de estados, etc a la manera flutte
• Compilar en tres plataformas diferentes
• Hecho.

¿Es menos trabajo?
¡Claro que sí!

Conclusión

Ahí está. Un desglose de lo que sabemos sobre flutter, angular dart, hummingbird y compartir código entre ellos.

Si estás desarrollando algo ahora mismo…
Apuesta por flutter + angular dart. No es tan fácil como el sueño del colibrí, pero sigue siendo el mejor camino a seguir.

El colibrí por ahora es un sueño lejano. Un proyecto que definitivamente debemos esperar en llegar a buen término algún día y apoyar con todos nuestros esfuerzos, pero Dilli abhi door hai (ese futuro es lejano).