Alternativas para desarrollar aplicaciones móviles multiplataforma

A la hora de afrontar el desarrollo de una aplicación móvil es normal que no queramos restringirlo a una única plataforma para tener la máxima presencia posible, y es común querer desarrollarla al menos para las dos plataformas principales: iOS y Android. Si además pudiéramos tenerlas en otras plataformas secundarias como Windows Phone o Blackberry, sería excepcional.

El problema es el de siempre: sistemas operativos diferentes con lenguajes de programación diferentes y SDKs diferentes que nos obligan a desarrollar una versión distinta para cada plataforma y que implican una curva de aprendizaje bastante empinada. En estos casos es inevitable hacerse la pregunta de oro: ¿No podría desarrollar una única app que pudiese ejecutarse en cualquier sistema operativo? o al menos en las plataformas principales.

En este post veremos las estrategias que actualmente se usan para el desarrollo multiplataforma: Web App (HTML5), aplicaciones híbridas y aplicaciones pseudo-nativas o compiladas. Veremos cada una de ellas explicando las ventajas e inconvenientes que nos podemos encontrar en cada estrategia. También veremos qué frameworks o librerías podremos usar en cada aproximación.

Aplicaciones HTML5

Gracias a los avances y APIs introducidas con HTML5 existe un gran número de aplicaciones que pueden implementarse haciendo uso únicamente de las APIs HTML5, JavaScript y CSS. Es la tecnología multiplataforma por excelencia ya que todo sistema operativo móvil cuenta con un navegador web, normalmente basado en WebKit lo que asegura una implementación rezonablemente estándar de las APIs HTML5. Incluso Microsoft en sus últimas versiones de Internet Explorer está mejorando el soporte a estas plataformas.

Aunque podríamos incluir en esta estrategia a cualquier web tradicional que haga uso una plantilla adaptativa (responsive), para aplicaciones móviles es recomendable hacer uso de frameworks que ofrezcan componentes de interfaz de usuario especializados para móviles y que se asemejen a los componentes que normalmente ofrecen los SDK nativos para componer las vistas de nuestra aplicación: Vistas, transiciones entre vistas, vistas de navegación, listados de selección, barras de herramientas, componentes de formulario, carruseles de fotos, botones, etc.

Para trabajar con este tipo de framework utilizaremos JavaScript o alguna de sus variantes compiladas como CoffeScript o TypeScript. Suelen estar basados en algún patrón como el de Modelo Vista controlador (MVC) o el Modelo Vista VistaModelo (MVVM) y la idea que persiguen es que toda la arquitectura de la aplicación se monte en el lado del cliente y únicamente se utilice el servidor para la recuperación de datos, normalmente usando JSON.

Ventajas

• Únicamente necesitamos saber HTML, JavaScript y CSS para abordar cualquier plataforma
• Máxima reutilización de código, ya que es la misma app para todos los dispositivos
• Mayor número de plataformas soportadas

Desventajas

• No podremos acceder a APIs nativas de cada plataforma o cualquier funcionalidad a la que no pueda acceder el navegador, como por ejemplo las notificaciones Push.
• El rendimiento es menor que en las aplicaciones nativas, pues es el navegador web quien realmente está ejecutando la aplicación
• Limitaciones de almacenamiento típicos de HTML5, donde normalmente tendremos acceso a 5MB que en muchas aplicaciones no será suficiente.
• Capacidad de funcionamiento offline limitada

Para desarrollarlas podríamos dos opciones:

1. Usar cualquier framework JavaScript de frontend, como Backbone.js, Angular, React, Ember.js, … junto a algún framework CSS como Ratchet o TopCoat.
2. Usar un frameworks que dispongan de un catálogo de componentes especializados en interfaces móviles, como podrían ser Ionic Framework, Onsen UI, Framework7 o Sencha Touch.

La primera opción suele estar más enfocada a aplicaciones web adaptativas que deban funcionar en sobremesa y en dispositivo móvil. La segunda opción suele usarse más en aplicaciones únicamente enfocadas a dispositivos móviles y probablemente candidatas a ser encapsuladas como aplicaciones híbridas.

Aplicaciones Híbridas

Son aplicaciones HTML5 que encapsulamos en una aplicación nativa. Siguen la misma filosofía que las aplicaciones HTML5 vistas anteriormente pero en vez de ejecutarse en el navegador del dispositivo lo hacen en un componente nativo WebView.

Estas tecnologías no solo se encargan de montar el componente WebView y cargar dentro nuestra aplicación, sino que nos ofrecerá mecanismos para comunicar nuestra aplicación JavaScript con la parte nativa, y así poder ofrecer funcionalidades que dentro de un navegador no podríamos ofrecer, ya que potencialmente podremos acceder cualquier API nativa que nos ofrezca cada SDK. Funcionalidades como las notificaciones Push, las compras dentro de la aplicación o el acceso a los contactos harán uso de este mecanismo para que podamos integrarlas dentro de nuestra aplicación JavaScript.

Ventajas

• Al ser una aplicación instalable, podremos publicarla en las tiendas de aplicaciones de cada plataforma
• Podremos acceder a las APIs nativas desde nuestra aplicación JavaScript, ya sea porque estén soportadas por la plataforma o porque podamos desarrollar un plugin para acceder a ellas
• Existen plugins ya desarrollados para acceder a las APIs más importantes, ya sean plugins oficiales o desarrollados por la comunidad

Desventajas

• Si necesitamos una funcionalidad nativa y no existe un plugin para ello, tendremos que aprender a desarrollar la parte nativa de cada plataforma
• El rendimiento sigue siendo menor que las aplicaciones nativas, pues aunque nuestra aplicación se ejecuta dentro de un WebView, éste no deja de ser un tipo de navegador más
• Es difícil hacer uso de funcionalidades nativas que impliquen componentes visuales. Por ejemplo, si deseamos acceder a las librerías de mapas nativas, estas se ejecutarán en una vista distinta al WebView y por tanto no estará integrada en el sistema de transiciones de nuestra aplicación. Hacer convivir estos componentes con el WebView algunas veces es complicado.

En esta categoría el framework por excelencia es Apache Cordova. La mayoría de frameworks HTML5 ofrecen opciones de integración con Cordova y la cantidad de plugins disponible es muy grande, tanto oficiales como desarrollados por la comunidad. A día de hoy se puede decir que es un estándar de facto y grandes empresas como Adobe, Intel o Microsoft están ayudando a su desarrollo, pues todos ellos disponen de productos que orbitan sobre Apache Cordova (Adobe con PhoneGap, Intel con su IDE de desarrollo XDK y Microsoft con su cliente de línea de comandos TACO).

 

Aplicaciones pseudo-nativas

Por último, tendríamos frameworks que generan código nativo a partir de código escrito en otro lenguaje como JavaScript, C#, Python, etc. A las aplicaciones que podamos desarrollar con estos frameworks las llamo pseudo-nativas porque realmente estaremos trabajando con componentes nativos y a todos los efectos nuestra aplicación parecerá nativa, pero la desarrollaremos bajo una única capa de abstracción y lenguaje de programación comunes.

Estos frameworks nos sitúan a un nivel más cercano a la plataforma base y realmente no tendremos limitaciones teóricas a la hora de acceder a cualquier librería o componente nativo ofrecido por cada plataforma soportada. Incluso en algunos casos podremos acceder a las APIs nativas de cada plataforma sin necesidad de escribir plugins o similares, directamente desde nuestro código JavaScript o C#.

Ventajas

• Podremos generar aplicaciones con componentes visuales nativos, sin las restricciones de las aplicaciones híbridas
• Estos frameworks son los que más nos pueden acercar al rendimiento nativo

Desventajas

• Suelen enfocarse principalmente a iOS y Android, dejando de lado a otras plataformas como Windows Phone o Blackberry donde se ofrece un soporte muy residual en el mejor de los casos
• Aunque su rendimiento sea similar a las aplicaciones nativas, siempre estarán un paso por detrás ya que siempre existirá la capa intermedia de traducción de código común a código nativo
• La cantidad de código común es menor que en las aplicaciones híbridas, especialmente la parte correspondiente a la interfaz de usuario que es donde más diferencias nos podemos encontrar en cada plataforma
• Si queremos sacar el máximo rendimiento nuestras aplicaciones, necesitaremos conocer más a fondo las APIs nativas de cada plataforma, lo cual puede incrementar la curva de aprendizaje.

Los principales frameworks que podemos situar en esta categoría son los siguientes:

• Xamarin (C#): adquirido por Microsoft tiene soporte para iOS, Android y Windows Phone. Aunque originalmente fue de pago, tras la compra por parte de Microsoft es posible realizar publicar nuestras aplicaciones sin adquirir licencias de pago.
• Appcelerator (JavaScript): de los primeros frameworks en esta categoría, a día de hoy es necesario adquirir licencias para poder publicar aplicaciones. Soporta iOS, Android y Blackberry.
• NativeScript (JavaScript): uno de los frameworks más prometedores pues permite acceso a APIs nativas directamente desde JavaScript. Actualmente soporta iOS y Android aunque están trabajando para poder añadir Windows Phone. Además, podemos hacer uso de Angular 2 para estructurar nuestra aplicación. Completamente Open Source.
• Kivy (Python): su fuerte son las interfaces gráficas, mas orientado a juegos que a aplicaciones tradicionales. Completamente Open Source
• Qt (C++): un clásico en el mundo multiplataforma, también soporta iOS, Android, Windows Phone y Blackberry. Salvo que nuestro proyecto sea Open Source, tendremos que adquirir una licencia para poder publicar nuestras aplicaciones.
• Unity (C# y JavaScript): motor de videojuegos que nos permitirá

Recomendaciones finales

Desde mi punto de vista las aplicaciones HTML5 son las más rápidas de desarrollar, y si ya disponemos de conocimientos en desarrollo web nos será muy fácil hacernos con alguno los frameworks comentados especializados en interfaces móviles. Por otra parte probaría Apache Cordova y al menos ojearía el funcionamiento de los plugins oficiales para poder hacer aplicaciones híbridas que puedan publicarse. Solo con esto tendríamos la posibilidad de abordar un gran número de aplicaciones móviles con resultados altamente competitivos.

Después elegiría un framework del último grupo para poder abordar aquellos proyectos que deban ser nativos, ya sea por rendimiento, por requisitos o por limitaciones que encontremos en las aplicaciones híbridas.

Una vez llegados a ese punto, podremos aventurarnos a profundizar en las APIs y SDK nativos de cada plataforma, pues un mejor conocimiento de ellos nos permitirá mejorar nuestros desarrollos pseudo-nativos o el desarrollo de plugins para las aplicaciones híbridas que realicemos.