¿ Flutter o NativeScript ?

Dos serios contendientes en la batalla de tecnologías del desarrollo de aplicaciones móviles.

¿ Flutter o Nativescript ?

Primero debo mencionar que tal vez podríamos incluir React Native, Xamarin, Appcelerator, Fuse, Ionic y algunos otros, ya que la batalla de desarrollo de aplicaciones móviles cross platform no es sólo entre ellos, sino que hay muchos otros contendientes, con ventajas y desventajas por supuesto, pero esos otros frameworks los vamos a dejar en el tintero por el momento.

Pues Flutter llegó a su versión 1.0. Flutter es la tecnología de Google que nos permite construir aplicaciones nativas para iOS y Android con un solo código base, llega su versión estable en menos dos años después de haber sido lanzado en mayo del 2017, aunque ya habían dado a conocer el proyecto desde 2015 en el Dart Developer Summit.

Dart es un lenguaje de propósito general de igual forma desarrollado por Google y liberado en 2011, Dart es otro lenguaje de programación orientado a objetos algo similar a Java pero este usa el motor de gráficos Skia.

Skia es una librería gráfica de código libre patrocinada y mantenida por Google, … ¿Google esta en todo?.

Flutter se programa en Dart el cual transpila a JavaScript similar al desarrollo en NativeScript con TypeScript el cual también es transpilado a JavaScript pero Dart puede ser ejecutado directamente en la máquina virtual de Dart, ( la Dart VM ) lo cual abre otras posibilidades como el Dart server- side.

En este punto podríamos decir que JavaScript con NodeJS se metió del lado servidor hace mucho tiempo.

Flutter loves Dart (imagen de Internet, no es mía)

El equipo original de Flutter evaluó muchos lenguajes de programación y escogió Dart porque se ajustaba a la manera como querían construir las interfaces.

Dart permite a Flutter evitar la necesidad de tener una capa de lenguaje declarativo por separado como JSX o XML, o constructores de interfaces visuales separados, porque el layout de programación declarativo de Dart es fácil de leer y visualizar. Y con todo el layout en un solo lenguaje y en un solo lugar, es fácil para Flutter proveer herramientas avanzadas que hacen el layout en un chasquido.

En NativeScript, si hacemos el desarrollo “vanilla” tendremos un archivo XML donde hacemos el layout, aunque es mucho más sencillo que hacerlo programáticamente no dejamos de tener esta capa, si hacemos nuestro proyecto NativeScript basado en Angular pues de igual forma tendremos que ajustar nuestros componentes para dar una salida html/xml es decir ajustarnos a la forma como Angular hace las cosas.

Entonces NativeScript (y si me apuran también ReactJS):

  • Corre JavaScript en una VM
  • Tiene acceso a las APIS de la plataforma y a los componentes UI
  • Ofrecen un nivel de abstracción para ambas plataformas, así como acceso directo a las UI nativas.
  • Proveen alguna forma de marcado para construir y dar estilo a las UIs (como ya mencionamos).

NativeScript llegó a la versión 5.1, lo cual habla de una madurez, ya que tiene más tiempo en el mercado.

Dart es compilado “ahead of time” (AOT) es decir antes de tiempo o por adelantado en código nativo a multiples plataformas. Esto permite a Flutter comunicarse con la plataforma sin pasar por un puente de JavaScript el cual hace un cambio de contexto.

Según la documentación oficial, Flutter esta construido en una forma nueva, completamente diferente comparada a otros frameworks existentes, trabaja más como en motor de juegos que como una framework tradicional de aplicaciones móviles.

En Flutter, las aplicaciones son compuestas por Widgets, que son dibujadas en un lienzo Skia (mencionado anteriormente) y enviado a la plataforma. La plataforma muestra el canvas y envía los eventos de vuelta cuando sean requeridos.

Tu app correr nativamente en la plataforma, compilada Ahead of Time (AOT).

Comenzando desde el nivel de la plataforma, Flutter provee un caparazón (Shell) que hospeda la Dart VM. El caparazón es especifico de la plataforma dando acceso a las APIS de las plataformas nativas y hospedando el lienzo relevante de la plataforma que se esta estableciendo. También existe un API que embebe, si queremos usar Flutter como una librería, en lugar de hospedar una app corriendo.

Shells, también ayuda a proveer la comunicación a los IMEs relevantes (ejemplo el teclado) y a los sistemas de los ciclos de eventos de la aplicación.

Aquí pueden leer más a detalle como trabaja Flutter.

Compilar en código nativo también por supuesto no solo mejora la ejecución si no los tiempos de arranque de la aplicación ya que Dart también puede ser compilado justo a tiempo (JIT) para lograr ciclos de desarrollo excepcionalmente rápidos y flujos de trabajo que cambien la forma actual de trabajo (incluyendo el popular sub-segundo stateful de carga caliente de Flutter).

NativeScript trabaja exponiendo las APIs nativas directamente en JS, despachando las llamadas y convirtiendo los datos al vuelo.

Un poco más a detalle, la tecnología de NativeScript puede ser presentada como una construcción de varias partes — Runtimes, Core Modules, CLI y Plugins, lo cual se ilustra en el siguiente diagrama.

¿Como trabaja NativeScript ? (imagen obtenida de la documentación oficial).

La capa de NativeScript de runtimes nos permite llamar a las APIs en los frameworks de iOS y Android utilizando código JavaScript. Para hacer se utilizan la maquinas virtuales de JavaScript — la de Google V8 para Android y la implementación de WebKit JavaScriptCore distribuida con iOS 7.0+.

Los módulos Core de NativeScript sirven para proveer las abstracciones necesarias para accesar a las plataformas nativas subyacentes, por ejemplo pensemos en el modulo de gestos ( pinch, double tap, scrolls, long presses y flinch en Android en iOs existen otros como swipe), este define una API común en JS que traduce una aplicación el código TypeScript/JavaScript en llamadas a la API s de gestos nativos (gracias a los Runtimes).

Podríamos decir que NativeScript (y ReactJS) son construidos de arriba para abajo, comienza con el requerimiento de JavaScript y luego llenan lo demás.

Al final del día ¿quién se ejecuta mejor ? ¿que tecnología es más eficiente hablando de desempeño ? ¿tamaño? ¿ es significativa la diferencia como para cambiar de tecnología ? Bueno no sé, pero haremos las correspondientes pruebas para contrastar las diferencias en aplicaciones realizadas en ambas plataformas. Tengan paciencia por favor.

Si nos vamos a un panorama más general y tal vez estratégico, Google tiene un as bajo la manga que se llama Fucshia el sistema operativo de Google que se dice que eventualmente reemplazará a Android ( en muchos años pienso yo pero para allá va) y el desarrollo en Flutter será natural o nativo.

Sin duda JavaScript es uno de los lenguajes más populares del mundo, Dart no lo creo (el indice TIOBE lo sitúa en el lugar #25), entonces si hay más gente aportando código, resolviendo problemas y en general haciendo la vida del desarrollador más amable tiene futuro asegurado, esto va para cualquiera de los dos lados.

Pero el hecho de que Flutter sea el único SDK para aplicaciones móviles que provea vistas reactivas sin requerir el puente de JavaScript debe ser motivo para prestarle atención y hacer pruebas e intentar el desarrollar en esta tecnología, pero hay algo más revolucionario en Flutter aún, que es la manera como implementa los widgets.

Fucshia el SO de Google creado a partir de Magento, una distribución de Linux.

No podemos perder de vista que la plataforma de servicios en la nube de Google (GCP) es uno de los tres competidores más fuertes al día de hoy en el mercado, junto con Amazon y Microsoft. La integración también será super amable para el desarrollador. Punto para Google.

Progress está desarrollando Kinvey Studio (basado en Kendo UI Builder), lo cual tiene todo el sentido, es una herramienta de desarrollo integral que entrega a su nube, Kinvey. La integración con otros de sus productos como OpenEdge será transparente y también buscan integrar otros sistemas empresariales como SAP, Oracle SalesForce etc. de manera fácil y rápida, el producto aún esta en beta, así que no le podemos dar punto a favor aún.

En México existen muchos clientes con OpenEdge esta deberá ser la manera más rápida y amigable de modernizar sus aplicaciones.

Una de las ventajas de Flutter es que el prototipado es muy rápido y eficiente-por su lado NativeScript tiene algunas herramientas para esto, básicas, como Sidekick o Playground que nos ayudan pero tendremos que esperar a que liberen Kinvey Studio para tener una herramienta con mayor poder.

Ahora, lo primero que vino a mi mente es porque Google no utiliza su poderoso Angular en Flutter. Creo que existen varias razones, en primera Flutter es para desarrollo de aplicaciones móviles, no web, peroooo, siempre hay un pero y para mi sorpresa, si esta contemplado, eventualmente lo hará, en la información publicada en el Flutter Live blog se menciona el proyecto HummingBird, el cual no se ha liberado pero ya pueden hacer pruebas — la idea es sencilla Flutter para Web, toma tu Flutter app y correrla en tu sitio web. Ahi se muestran varios demos de apps en Flutter corriendo en web. aparentemente FlutterLive screen fue una aplicación construida en Flutter y posteriormente compilada para Web.

Hummingbird takes the Dart code that all Flutter applications are written in and then compiles it to JavaScript, which in turn allows the code to run in any modern browser. Developers have always been able to compile Dart to JavaScript,

Existe un proyecto de Angular con Dart, AngularDart, AngularDart es un framework de desarrollo de web apps que se enfoca en la productividad, ejecución y estabilidad. Cientos de ingenieros de Google utilizan AngularDart para construir las sofisticadas apps de misión critica que significan mucho de la la utilidad de Google (como Adwords). AngularDart y los angular_components están tratando de soportar casos de uso digamos “enterprise”, aplicaciones web complejas que se enfocan principalmente en escritorio.

Continuemos.

Flutter ahora permite embeber componentes de vistas, lo cual era un gran inconveniente, es decir ahora componentes nativos de terceras partes pueden ser embebidas en nuestras aplicaciones de Flutter, lo cual no es tan fácil en NativeScript, tener esta capacidad le da muchas más posibilidades a Flutter, en mi opinión esto era un gran obstáculo.

Flutter-Native (Open source prototype) nos permite correr nuestras apps nativamente en Windows, Linux y Mac OSX, aún bajo desarrollo, es un prototipo temprano, ¡pero realmente funciona!. Punto extra para Google, es más este fue un gol de último minuto en tiempos extras.

Si alguien de marketing ve esto, este es un gran argumento. ;-)

En todas estas plataformas utilizando código verdaderamente compilado (*web es transpilado a JavaScript ) lo cual hace una app más rápida. Aquí se veo mucha diferencia, NativeScript solo soporta iOS y Android con el mismo código base, pero podemos estirar esto porque NativeScript soporta web con las técnicas ( code sharing )de compartir código.

Pero nada como agarrar tu app Android o iOS y luego construirla para Linux y ¡boom! eso es todo, o construirla pata web, solo entregando el código JavaScript generado a tu sitio web.

En mi opinión NativeScript y Web deberán ser prioridad en este 2019, hacerlo lo más pronto posible y lo más fácil posible, porque con esto podrían embeber las aplicaciones en un shell de node o chrome lo que podría dar la capacidad de hacer que una app que corra en Windows o en Mac. Y poner todas las palomitas en los checkboxes como Flutter.

NativeScript itself is awesome, but only supports the basics. The plugins can be awesome and support advanced features that the people needs, but the plugins are really really a huge crap shoot. This area could be another thing that differentiates NativeScript from everyone else, especially since you are fending off big players like Facebook and Google. A awesome plugin community with excellent quality and great docs, would be a huge boon for getting more people in the community… Right now, ReactNative has a MUCH, MUCH, MUCH bigger plugin eco-system. And Google is spending money left and right on Flutter… How does NativeScript stay relevant against that?

Personalmente, creo que Flutter llegará a ser un framework bien soportado, versátil, de UI general, por lo cual recomendaría que invirtieran tiempo en el, si su proyecto no es urgente. podrían empezar a hacer algunos desarrollos. Si el proyecto como suele suceder es para el día de ayer, pues yo seguiría usando NativeScript.

| Aquí esta el showcase de algunas apps muy buenas escritas en Flutter |

Actualización 7/mayo/2019

Anunciado en el Google #io19 (mayo de 2019)

Actualización 26/Ago/2019.

De acuerdo.

Cheerleader in chief for KMMX, RPA Enthusiast, DevOps, Technical Writer & International Speaker, Dad & 2 cats.

Cheerleader in chief for KMMX, RPA Enthusiast, DevOps, Technical Writer & International Speaker, Dad & 2 cats.