React Native

Introducción

React Native es una tecnología para el desarrollo de aplicaciones Cross-Platform de código abierto desarrollada por Facebook. Su peculiaridad a nivel productivo se basa en la portabilidad del código, el cual será válido casi en su totalidad para ambas plataformas.

Su modelo se basa en el MVC (Modelo Vista Controlador), y es mantenida por la empresa y la comunidad de desarrolladores.

Clasificación

Podríamos considerar este framework como híbrido, pero dada su arquitectura se separa drásticamente de las plataformas híbridas que apoyan su ejecución sobre el motor web del sistema, y a la par se acerca al concepto de Xamarin en cuanto a la construcción de llamadas a componentes nativos se refiere.

Lo entenderemos así como una tecnología cross-platform nativa en el mismo campo que el producto de Microsoft (adquirido en 2006).

Detalles técnicos

Como hemos comentado, a diferencia de derivados de Apache Cordova como PhoneGap (comprado por Adobe, aunque siga existiendo como producto aparte) y sus posteriores conjugaciones como IONIC, React Native se acopla directamente con componentes del sistema a través de una pasarela que invoca a los mismos de forma nativa.

Por tanto, renderiza componentes nativos del sistema (y no vistas Web), haciendo indistinguible la diferencia entre una app desarrollada con este framework que usando el kit oficial XCode/ObjC/Swift para iOS o AndroidStudio/Java/Kotlin para Android.

Lenguaje

Las aplicaciones se desarrollan en JSX, un lenguaje extendido de JavaScript de tipado estático que nos permite hacer uso de un sistema de nomenclatura por etiquetas similar a XML. El objetivo de la inclusión de este lenguaje en la plataforma es aportar un desarrollo sencillo, seguro y rápido de aprender.

Estructura del Framework

El grueso de nuestro proyecto se aloja en un fichero de extensión js con código JSX. Este código se convierte en tiempo de compilación en código JavaScript a través de un compilador llamado "Transpiler", un convertidor S2S (source-to-source) que traducirá el código original a JavaScript puro.

Este paso necesario se realiza para que la lógica sea ejecutada en el motor JavaScript que provee el sistema, lugar donde es interpretado y realizará las acciones necesarias.

Este código no puede tener acceso por sí mismo a los componentes del sistema, por lo que utiliza una pasarela que en el caso de que el target sea iOS estará desarrollada en C++ y en la opción Android, en Java.

La pasarela hace la petición de componentes nativos al sistema y renderiza los objetos, ejecuta eventos, transiciones, animaciones y cualquier componente que pueda necesitar la app.

Comparación con Xamarin

Anteriormente mencionado, ponemos React Native junto a Xamarin como la tecnología más próxima en estructura y concepto.

En tiempo de desarrollo

Xamarin trabaja esencialmente en modo AOT (Ahead Of Time) de forma obligatoria en modo iOS debido a que el código C# debe ser obligatoriamente compilado por MSIL (Microsoft Intermediate Language) en modo AOT para generar el código máquina, que después será empaquetado en una app que se ejecutará en el sistema. Sin embargo, si utilizamos Java, MSIL puede compilar el código con el compilador JIT, pudiendo utilizar el modo vista de cambios en tiempo real.

React Native por su parte, recurre a un lenguaje interpretado como es JSX->JavaScript, que no requiere compilación previa, y el cual puede correr en ambos sistemas en modo JIT. En este sentido este framework presenta una clara ventaja sobre Xamarin pro la rapidez de visualizado de los cambios que vamos efectuando.

En tiempo de ejecución / Rendimiento

Sin embargo, el código compilado en AOT es mucho más rápido que el interpretado, lo que aporta una clara ventaja a la combinación Xamarin/C#.

En tiempo de diseño

Xamarin, hace uso de Forms, que entre otras cosas aporta claras ventajas de diseño por muchas razones, pero una clara es la posibilidad de heredar el modo AutoLayout en la parte iOS. Al fin y al cabo esta metodología de diseño fue heredada por Apple después de que Microsoft la creara y la utilizara durante años.

React Native ha asimilado un subconjunto de funciones CSS para colocar los componentes en la pantalla como método de ordenación. Aunque es algo muy cercano a la metodología Android, incluso Google ha incluido como principal método Layout la ordenación por constraints de diseño, similar a AutoLayout.

En cuanto a recursos

Xamarin posee un kit de desarrollo oficial que forma parte de VisualStudio, que si bien es gratuito para uso individual, hay que adquirir licencia para el desarrollo en ámbito empresarial.

React Native es totalmente gratuito en cualquier ámbito, y además está totalmente desligado de un IDE concreto, pudiendo utilizar la opción donde el programador se encuentre más cómodo (Sublime Text, VSCode, Atom...) con el interpretador de sintaxis adecuado.

Atendiendo sin embargo a recursos entendido como lugares de búsqueda documental para resolver dudas o problemas, Xamarin cuenta con una mayor presencia en los principales sitios especializados en comunidades de desarrollo.

Sin embargo si analizamos recursos como aspecto humano, hay multitud de desarrolladores habituados a usar React.js, el framework original que se usa en web, por lo que no encontrarán muchos problemas a la hora de

Conclusión

Aunque es muy pronto para concluir una opción como claramente mejor por la juventud de React Native respecto a Xamarin, pero es muy cierto que React Native está gustando mucho en los últimos meses, y la presencia de grandes empresas como Tesla, Facebook, Airbnb, Bloomberg, Uber, Microsoft (Skype), son argumentos muy válidos para pensar en dar viabilidad al desarrollo de esta plataforma.