sábado, 20 de agosto de 2011

Desarrollo de aplicaciones móviles multiplataforma parte 3/3: Corona y Adobe Air mobile y conclusiones

Última parte de una serie de posts sobre desarrollo de aplicaciones móviles multiplataforma. Post relacionados:

NOTA: Al final del post hay una guía rápida para programadores con prisa, que incluye una tabla de características de todas las herramientas.

Adobe Air mobile: ActionScript

Adobe Air mobile funciona con Flex 4 y soporta las plataformas IOS, Android y BlackBerry Tablet, además de los sistemas de escritorio Windows, Mac y Linux (a través de un runtime). Las aplicaciones de escritorio no son directamente compatibles con las de móvil, pues los controles visuales cambian (en concreto, el sistema de gestión de ventanas), aunque la lógica de negocio se puede compartir igualmente.

Flex 4 utiliza el lenguaje de programación ActionScript, que es (por hacer una comparación) un Javascript compilado, de tipado fuerte y con clases, interfaces, herencia y paquetes muy parecido a Java con el que poder hacer complejos desarrollos. El IDE oficial, Flash Builder 4.5 es un IDE muy potente, pero de pago. Es posible compilar y empaquetar las aplicaciones con el Flex SDK opensource y gratuito (basado en Java), aunque con Flash Builder es mucho más fácil e inmediato, ya que proporciona una gran cantidad de wizards y editores. Los controles visuales usados durante el desarrollo y ejecución no son los originales de cada plataforma, sino que son específicos de Flex 4. Esto tiene su lado bueno y su lado malo: en su ejecución los elementos no van tan “suaves” como si fueran nativos, pero nos garantiza que todas las aplicaciones tendrán exactamente el mismo aspecto y comportamiento.

EDITADO: Erik Camacho me indica en un comentario que la aplicaciones generadas con Adobe Air necesitan que el terminal cuente con procesadores con arquitectura Arm7 que son los de gama alta hoy en día. Curiosamente para iOS los requerimientos son mucho menores y funciona desde el iPhone 3G para arriba (3GS, iPad 1 y 2). La razón es que en Android las aplicaciones corren sobre Air mobile, en iOS dado que Apple prohibe esto, corren sobre CocoaTouch directamente, obvio usando su propio set de Elementos para Interfaz de Usuario.

Se pueden depurar aplicaciones (poner puntos de ruptura, etc) en remoto. Es decir, puedes instalar y ejecutar una aplicación en tu Ipad/Iphone y depurarla desde tu ordenador. Una de las peculiaridades es que es la única herramienta que no requiere ni el Android SDK ni el Xcode para Mac para ejecutar y crear las aplicaciones.

Si quieres algunas aplicaciones hechas con Adobe Air mobile, aquí tienes un listado.

Ventajas:

  1. Multiplataforma móvil y también de escritorio.
  2. ActionScript es un lenguaje muy potente que permite el uso de patrones y estructuras complejas en los desarrollos.
  3. Desarrollo y definición de las vistas “a golpe de ratón” con el editor visual de MXML con Flash Builder. En general, el IDE y Flex 4 están muy avanzados y son muy potentes, y la documentación es realmente muy buena. Se nota que Adobe ha hecho un gran esfuerzo en todo el sistema.
  4. Flash Builder 4.5 no requiere el uso de Xcode ni Mac.
  5. Depuración remota.

Desventajas:

  1. El precio de Flash Builder 4.5. Aunque hay otras herramientas y se puede usar el SDK gratuito.
  2. No funciona en todos los Android, solo en los de gama alta que tengan arquitectura Arm7. Consulta el listado de dispositivos certificados por Adobe Air mobile.
  3. Rendimiento regular, renderización no muy suave en IOS. Las aplicaciones Air de escritorio consumen mucha CPU, sobre todo en Mac (aunque siguen trabajando en ello).
  4. Aspecto no nativo (aunque homogéneo entre todas las plataformas).

Ansca Corona: Lua

Corona es un framework para el desarrollo de juegos y aplicaciones gráficas para Iphone/Android. Se desarrolla en Lua y no tiene IDE, aunque si viene con un interprete-emulador y varios ejemplos de juegos bastante espectaculares. No estoy seguro de si hace falta el Android SDK o el Xcode para Mac al construir aplicaciones, pues la versión de prueba no me permitía hacer el build. El precio de la licencia es $199/año para solo una plataforma, o $349/año si es para IOS/Android juntas. Aquí puedes ver el showcase de aplicaciones y algunos videos bastante impresionantes.

Ventajas:

  1. Motor gráfico y físico ideal para juegos.
  2. Lua es un lenguaje bastante sencillo.
  3. Buena documentación, ejemplos y plantillas.

Desventajas:

  1. El precio de la licencia anual.
  2. Aunque se puede usar para cualquier cosa, realmente es ideal para aplicaciones gráficas y juegos al incluir motor físico.

Mis conclusiones

DISCLAIMER: A partir de aquí, todo lo escrito es mi opinión personal y, como tal, puede no coincidir con la de nadie. Así que, ¡no te pongas furioso si lees algo con lo que no estás de acuerdo! siempre puedes escribir un comentario explicando tu propia visión. Sobre mí, decir que tengo experiencia con Flex 3, conozco ActionScript y llevo años (muchos) con Java, HTML y JavaScript, así que es posible que para mi sea una buena elección Adobe Air, mientras que para otras personas no lo será nunca. De todas formas, lo justifico y lo explico detalladamente. Bueno, allá vamos:

Lenguajes

Empezamos hablando sobre el lenguaje de cada una de estas herramientas. Tenemos ActionScript, JavaScript y Lua. Sobre Lua no diré nada: no lo conozco, y dado que Corona está especialmente diseñado para hacer juegos, si tuviera que hacer uno, aprendería Lua y usaría Corona sin pensarlo. Por lo que he visto de Lua, es orientado a objetos (herencia basada en prototipos), imperativo pero con rasgos funcionales y de tipado dinámico y débil, así que concluyo que es muy parecido a Javascript, por lo que no debería haber problemas en hacerse con él en poco tiempo. Pero si no tengo que hacer juegos o una aplicación gráfica, no me molestaría en probar Lua.

Si tengo que elegir entre ActionScript y JavaScript como lenguaje de programación, me quedo con ActionScript. Los dos comparten la misma sintaxis, pues provienen de ECMAScript ¿Diferencias? JavaScript es tipado dinámico débil, y ActionScript es tipado estático fuerte. Los dos son orientados a objetos, pero la herencia en JavaScript está basada en prototipos y la de ActionScript está basada en clases. ¿Todo esto en qué concluye? pues que JavaScript es un lenguaje fantástico y me encanta, pero a la hora de desarrollar una gran aplicación con muchos componentes es más difícil (en mi opinión) estructurarla con JavaScript que con ActionScript, debido a su herencia basada en clases principalmente. Con Javascript tengo que usar trucos y patrones para simular namespaces y otras cosas que ActionScript me da directamente. Por esta razón, mi preferido es Flex frente a Appcelerator y PhoneGap, que usan exclusivamente JavaScript.

Maquetación y layaout

Sobre el sistema de maquetación y diseño de vistas. Appcelerator y Corona no tienen, hay que codificar y colocar los componentes a mano, así que cero puntos para ellos. PhoneGap es HTML5/CSS3 y Flex tiene MXML y su herramienta Flash Builder con un editor visual muy potente. Aquí sobre gustos los colores, pero yo lo tengo claro: prefiero MXML pues su sistema de componentes está especialmente pensado para crear aplicaciones RIA, mientras que HTML5 no deja de ser una evolución más de HTML y está orientado a la creación de documentos. Aunque la creación de RIAs en HTML es perfectamente posible, no deja de ser complicada, pues consiste en un repertorio de trucos con enlaces, formularios, Ajax con los que manipular del DOM y requiere bastante pericia. En este sentido, la jerarquía de componentes de Flex 4, Spark, es imbatible, además de que cada MXML se compila y se transforma en código ActionScript, por lo que nunca tendremos un MXML mal formado, cosa que si puede suceder en HTML. De nuevo, me quedo con Flex 4 primero, y PhoneGap después.

Entorno de desarrollo

Lua no tiene. PhoneGap es una plantilla para trabajar con Eclipse para Android; y con Xcode para Iphone, pero nadie te impide crear tu HTML y Javascript con tu editor favorito. Appcelerator tiene Titanium Studio, que es un Eclipse con el que poder probar tus aplicaciones y que, además, detecta errores en el código Javascript, lo cual se agradece muchísimo. Flex tiene Flash Builder, un entorno basado en Eclipse también muy avanzado y potente. Aquí el ganador es Flash Builer, pues Adobe ha invertido mucho tiempo y esfuerzo en crear un IDE realmente adaptado para incrementar la velocidad de desarrollo en Flex, lleno de wizards, editores y con depuración, sin embargo, es de pago y es bastante caro ($699). El resto son gratuitos, así que dejaría como vencedor segundo vencedor a Titanium Studio.

Componentes

Appcelerator y Corona son los únicos que permiten crear controles nativos de cada plataforma. PhoneGap usa los controles de los formularios de HTML y nada más, así que hay que utilizar un framework como jQuery Mobile, Sencha Touch, etc. Y Flex tiene su propio sistema de componentes. Los ganadores son sin duda Appcelerator y Corona por permitir crear controles nativos. Seguido de Flex con su propio sistema que es muy bueno, pero no deja de ser una implementación propia que hace que a la hora de usarlo se note menos fluidez; empatado, para mi gusto, con PhoneGap y sus frameworks externos a gusto del programador.

Rendimiento

Tenemos que tener en cuenta que los móviles son ordenadores en miniatura y, aunque son potentes, hay todavía algunos con procesadores lentos y poca memoria. Por esta razón, Appcelerator, al usar controles nativos, es el que más suavidad proporciona en la interfaz, seguido de PhoneGap, que la simula con HTML5. Por último tenemos a Flex, que aunque es rápido, no tiene la misma suavidad.

Comunidad, documentación, fiabilidad

Appcelerator y PhoneGap son herramientas jóvenes que todavía les falta para estar acabadas: sus apis cambian, están incompletas y a veces fallan y la documentación es regular. Flex lleva muchos años y tiene a Adobe por detrás trabajando duro, y todos sabemos que es un compañía que hace las cosas muy bien. Y la documentación de Adobe es completa. Me quedo con Flex sin duda.

Distribución

Appcelerator y PhoneGap requieren tener un Mac y pelearse con Xcode para crear aplicaciones IOS. Con Android no hay problemas, pues usan el SDK que es Java y es multiplataforma. Flash Builder permite crear directamente aplicaciones para Iphone, Android y BlackBerry Tablet OS sin usar Xcode ni el SDK Android y en solo un par de pasos: elegir el certificado y creas la aplicación. Me quedo con Flash Builder.

Precio

Appcelerator y PhoneGap son gratuitos, solo hay que pagar para el soporte formación. Flash Builder 4.5 Premium cuesta $699, aunque se puede usar la versión de prueba durante 30 días y hay SDK libres. Corona es gratis para desarrollo, pero requiere pagar una licencia anual de $199 o $349 si quieres subir tus aplicaciones al App Store o Market de Android. Si tienes dinero y no te importa pagar (o te lo paga tu empresa), entonces no importa, sino, las únicas opciones son Appcelerator y PhoneGap.

Vale muy bien, ¿pero cuál elijo?

Yo lo tengo claro. Suponiendo que no voy a hacer un juego (solo Corona) y que quiero hacer una aplicación solo para Iphone y Android (si quiero Symbian, WebOS, WP7 me tengo que ir PhoneGap), primero miraría que características del móvil que necesito usar y ver en que medida están soportadas por cada una de las herramientas en la documentación.

Si no necesito ninguna característica especial o en caso de que esté soportada por todas entonces mediría la complejidad potencial de la aplicación por un lado y por otro la velocidad/suavidad de la interfaz que me gustaría tener. Evaluado esto, usaría Flex si veo que merece la pena perder la suavidad de Appcelerator o PhoneGap con tal de tener una aplicación bien diseñada, robusta y que sé con certeza que usa Apis que no van a fallar. No es que Appcelerator y Phonegap sean un mar de bugs, pero no pueden competir con la fiabilidad y acabado que Adobe ha conseguido con Flex. Si veo que me puedo permitir el lujo de meterme con un diseño peor o simplemente es una aplicación más sencilla, o no me importa usar Apis que pudieran estar incompletas, usaría Appcelerator o PhoneGap. Entre estos dos, tenemos que recordar que PhoneGap es HTML5/CSS con Javascript, y Appelerator es Javascript puro con controles nativos. Así que evaluaría si quiero tener un acabado nativo con Appcelerator a costa de no disponer de un diseño visual, y tener que probar la aplicación siempre en el simulador. Pero si prefiero un diseño visual de las vistas, que además puedo probar en el navegador de mi ordenador, usaría PhoneGap con un framework mobile que además me garantiza que se va a ver exactamente igual en cualquier dispositivo. Y para acabar, me quedo con esta frase de Jano que puso en un comentario en el primer post de la serie:

  • “Al usar estos frameworks multiplataforma hay que tener en cuenta que tu inversión en aprendizaje depende de la suerte de sus respectivos fabricantes, es toda una apuesta.”

Guía rápida para programadores con prisa

Si tienes que elegir una plataforma para YA y no no te quieres leer todos los posts, no te culpo. Aquí pongo una serie dereglas personales que yo aplicaría si tuviera que elegir.

  • Solo usaría Corona exclusivamente para hacer juegos o aplicaciones gráficas.
  • Para alguien que sepa Javascript y no sepa o no quiera aprender Flex ni ActionScript, la opción de Adobe Air/Flex queda descartada.
  • Si tengo prisa o el proyecto es muy simple y elemental, usaría PhoneGap, ya que la interfaz es HTML y me permite maquetar muy rápido usando una plantilla.
  • Si no tengo Mac y quiero desarrollar aplicaciones IOS, usaría Adobe Air ya que es el único que me permite crear aplicaciones IOS sin Mac. Aunque también podría virtualizar un Mac OS, o pediría prestado/compraría un Mac :)
  • Si necesito hacer una aplicación para muchos dispositivos móviles (como Symbian, Palm, WebOS) con la máxima compatibilidad entre ellos, usaría PhoneGap, ya que el uso de HTML5 me garantiza que se verá igual en todos los dispositivos.
  • Si tuviera que hacer una aplicación realmente compleja y grande (de lógica de negocio me refiero), usaría Flex, ya que ActionScript me permite una mejor estructuración de mi código.
  • Si quiero que el rendimiento sea el más rápido, no usaría Flex, sino PhoneGap o Appcelerator. Y si quiero controles nativos, usaría Appcelerator.

Y aquí una tabla-resumen con las características de cada sistema y plataforma (no incluyo todas las de PhoneGap, solo las que he creído más importantes). He coloreado en rojo lo que me parece un punto negativo, en amarillo lo que es neutral y en verde lo positivo. De nuevo, es mi opinión, y puede no coincidir con la de nadie.

Y nada más. Voy a seguir probando todas las herramientas en profundidad y espero acabar haciendo un ejemplo de una aplicación real, más allá del hola mundo, en cada una de ellas. Aunque me consta que ya hay quien lo ha hecho: los chicos de Tidyslice han hecho la misma aplicación para todas estas plataformas y está en un repositorio Github público: litros de a litro. Si quieres que haga un tutorial usando alguna herramienta específica, escríbeme un comentario (¡todo feedback es bienvenido!)

Si todavía te han quedado ganas de leer, aquí pongo algunos enlaces, ¡pero no te acuestes tarde!
Publicado por decheverrisanin en 19:24

No hay comentarios:

Publicar un comentario

Suscribirse a: Enviar comentarios (Atom)