El martes Chiyana en su artículo nos habló sobre React. El framework que revolucionó la web.  Es por ello que hoy quiero hablar de Flutter, otro framework Open Source para desarrollar y desplegar aplicaciones.

¿Qué es Flutter?

Flutter es el framework Open Source desarrollado por Google para crear aplicaciones nativas de alta calidad iOS, Android, Desktop o web, todo ello en un tiempo récord. Flutter te permite desarrollar aplicaciones nativas con rendimientos fantásticos. Que se hace evidente con funciones como Hot Reload, con la que puedes hacer cambios en el código y ver el resultado en el emulador en tiempo real, mientras la app sigue en marcha.

Flutter puede ayudarte a crear aplicaciones con un buen resultado de UI y UX en un tiempo récord con beneficios tales como:

  • Desarrollo de alta velocidad: Con Hot Reload en milisegundos puedes dar vida a tu aplicación. Con Flutter tienes a tu alcance un amplio conjunto de widgets totalmente personalizables para construir interfaces nativas en minutos.
  • Diseños adaptados y flexibles: Flutter rápidamente libera funciones con un enfoque claro en las experiencias nativas del usuario final, te permite adaptarte a cada escenario con facilidad. La arquitectura en capas te permite una personalización completa, lo que resulta en una renderización increíblemente rápida, diseños adaptados y flexibles.
  • Rendimiento nativo: Los widgets de Flutter incorporan todas las diferencias críticas de cada plataforma. Algunas como el scrolling, navegación, iconos y fuentes para proporcionar un completo rendimiento nativo en cada plataforma, ya sea iOS o Android.

Desde el lanzamiento alfa en 2017, Google brinda, con la ayuda de la comunidad múltiples funciones nativas. Como soporte de lector de pantalla y otras funciones de accesibilidad, texto de derecha a izquierda, multi idioma, compatibilidad con nuevos dispositivos como iPhone X e iOS 12 y mucho más.

A diferencia de otros frameworks similares, como Ionic, una aplicación Flutter compilada no contiene ningún código interpretado o WebView, al igual que React Native. Todo el código se compila a binario de forma nativa para la plataforma en la que se está desarrollando. Todo esto es posible gracias a Dart, el lenguaje utilizado por Flutter.

Ejemplo de APP Reflectly, desarrollada en Flutter.

¿Qué es Dart?

Dart (originalmente llamado Dash) es un lenguaje de programación open source, desarrollado por Google. A diferencia de JavaScript, Dart es un lenguaje basado en clases que puede compilar Just in Time (JIT) o Ahead of Time (AOT). El objetivo de Dart no es reemplazar JavaScript como el principal lenguaje de programación web, sino ofrecer una alternativa más moderna. El espíritu de Dart puede verse reflejado en las declaraciones de Lars Bak, desarrollador en Google, que define a Dart como un “lenguaje estructurado pero flexible para programación Web”.

Si has programado con lenguajes como C #, Java o incluso Javascript, la sintaxis de Dart debería serte familiar. Aquí te dejo un enlace para profundizar en Dart.

¿Como funciona Flutter?

Para entender como funciona Flutter, necesitamos echar un vistazo a su arquitectura:

Framework

La capa superior consiste en el framework. Esta capa está escrita únicamente en Dart y contiene bibliotecas de Animación, Colores, Renderización y Widgets, los bloques de construcción centrales de cada UI de Flutter. Las bibliotecas de Material y Cupertino también están incorporadas en esta capa.

El código de tu aplicación Flutter desarrollado se encuentra en la parte superior de esta capa y generalmente utiliza widgets de Material o Cupertino para Android o iOS.  Aunque si hay algo que no esté incluido en estas bibliotecas, puedes simplemente pasar a una capa inferior de los widgets para desarrollar tu mismo el widget, sin límites.

Motor

Debajo del framework se encuentra el motor de Flutter, escrito principalmente en C/C++, contiene tres bibliotecas principales:

  1. Skia: un motor gráfico open source utilizado por Google Chrome, Android, Chrome Os, entre otros.
  2. Dart runtime
  3. Text: motor utilizado para renderizar y diseñar las pantallas.

Embebedor

La capa final que nos importa es el embebedor. Esta capa es específica de la plataforma y es donde se configura la superficie para renderizar Flutter.

Arquitectura Web Flutter

Antes de continuar, vale la pena mencionar que la arquitectura Web de Flutter no está integrada a la arquitectura principal.

Llevar Flutter a la Web planteó el interesante desafío de reemplazar el motor Flutter existente, ya que no era compatible con el desarrollo web. Por lo tanto, nació una versión modificada del motor Flutter llamado "flutter_web". A medida que el proyecto se vuelve más estable, eventualmente se fusionará de nuevo en el repositorio principal de Flutter.

¡Pero esto no es un problema! Puedes utilizar el mismo desarrollo cambiando únicamente el compilador a "flutter_web". La API de Flutter principal permanece prácticamente intacta, por lo que es posible exportar la interfaz de usuario desde la aplicación Flutter de Android y iOS a la Web.

¿Por qué Flutter?

Analicemos que hace especial a Flutter:

Accesibilidad y experiencias únicas

El objetivo de Flutter es permitirte crear aplicaciones web para llegar a todos, generando aplicaciones nativas con experiencias enriquecedoras. Las aplicaciones nativas han sido siempre un requisito clave en la gran mayoría de desarrollos de aplicaciones.

Flutter se desarrolla teniendo en cuenta estos requisitos: ¿qué pasaría si pudiera llegar a los usuarios en cualquier dispositivo y brindarles experiencias únicas?

Flutter responde perfectamente a estos requisitos, su objetivo no es Android ni iOS, es dondequiera que existan tus usuarios. Como hemos comentado, Flutter permite desarrollar aplicaciones tanto para dispositivos móviles, web y múltiples sistemas operativos para aplicaciones desktop.

Multiplataforma: Escribe solo una vez y ejecuta en Android, iOS o Web

El desarrollo de aplicaciones multiplataforma conlleva costes muy elevados, asociados normalmente al tiempo de desarrollar la misma aplicación en diferentes plataformas, como Android e iOS.

La necesidad de reconstruir tu aplicación utilizando un nuevo lenguaje de programación es una barrera. Una barrera comprensible, teniendo en cuenta las diferencias entre los ecosistemas de cada plataforma iOS, Android, Desktop o Web. No obstante, una barrera.

¡A menos que uses un SDK como Flutter!, donde tienes un framework de desarrollo único. Te permite crear tu aplicación multiplataforma, para los diferentes sistemas operativos. ¡Y no solo eso!, sino que puedes ejecutarlos de forma completamente nativa.

Bibliotecas

El framework de Flutter proporciona una gran cantidad de recursos para integrar, pero hay ocasiones en que necesitas algo más. Esto no es un problema en absoluto considerando la gran cantidad de bibliotecas extras disponibles para Dart y Flutter.

¿Quién usa Flutter?

Flutter no solo es utilizado por Google, sino que también por muchas grandes empresas y desarrolladores de todo el mundo. Existen grandes aplicaciones con Flutter como Alibaba, Hamilton Musical, Abbey Road Studios, Google Ads, Reflectly, entre muchas otras. Utilizan Flutter para ofrecer aplicaciones nativas con un buen UX y UI asociado a cada ecosistema.

Conclusión

Flutter se ha convertido en excepcional por su simple pero ambicioso objetivo de permitir a los desarrolladores front-end desarrollar aplicaciones nativas que se ejecuten en cualquier dispositivo.

No puedo asegurate que sea el futuro del desarrollo de aplicaciones multiplataformas, pero definitivamente es un gran paso en la dirección correcta. Flutter se centra en la experiencia de usuario (UX y UI) con el objetivo de facilitar la accesibilidad en múltiples plataformas.

¿Utilizas Flutter en tus aplicaciones? ¿Qué tal la experiencia?

Photo by Daniel Korpai on Unsplash

Referencias: