Desarrollo de Apps 11 julio, 2022

React Native se utiliza para crear aplicaciones híbridas que pueden funcionar en cualquier sistema móvil (similar a las Apps nativas). Podríamos definirlo como un marco para aplicaciones móviles que se usa para desarrollar Apps para iOS, Web y UWP (Windows). Con este artículo podréis conocer las principales características, funcionalidades, ventajas y desventajas que ofrece este software. Además nuestro desarrollador Front Tech Lead Oscar nos dará su opinión acerca de esta tecnología mobile.

React Native; un framework para desarrollar Apps híbridas

Existen varias maneras de desarrollar una App móvil. Entre ellas encontramos las Apps Nativas y las Apps híbridas o multiplataforma. La primera, consiste en un software que se produce a medida y que esta diseñado para operar en un dispositivo o plataforma en particular. Por tanto, si escogiésemos crear una App que funcione tanto para dispositivos Android, como para iOS, deberíamos usar el sistema operativo en cuestión por tal de que funcionen correctamente en cada software.

Con el incesante aumento de demanda de Apps, ha aumentado a su vez la competencia y la necesidad de crear una manera de trabajar simple. Con ello surgieron las Apps híbridas con una única base de código para todas las plataformas. Esto significa que los desarrolladores únicamente necesitan escribir el código una vez y ejecutarlo donde sea necesario. Esta tipología de Apps soluciona el problema típico de crear una App para Android y iOS, sin tener dos proyectos separados en dos lenguajes de programación.

Se desarrollan con herramientas de terceros normalmente basadas en los lenguajes de web (HTML, CSS y JavaScript), aunque existen otras herramientas alternativas. React Native forma parte de uno de los tres frameworks más conocidos (Ionic, Flutter y React Native) para el desarrollo de aplicaciones híbridas.

En resumen, React Native es una aplicación híbrida, a pesar de que funcione tanto en plataformas de Android como iOS.

Os dejamos un artículo dónde se expone de manera más específica las principales diferencias entre las Apps Nativas y las Apps híbridas.

Un software creado por Meta

React Native es un marco para Apps de código abierto creado en 2015 por Meta (también conocido anteriormente como Facebook). Con el término código abierto, nos referimos a un código de un programa que se distribuye de manera libre (e incluso de manera gratuita) y que puede ser usado y modificado por los usuarios sin ninguna restricción. Resulta muy útil para los desarrolladores ya que permite poner ciertas restricciones de uso y licencias siempre con el fin de proteger la integridad del código.

Es importante aclarar que React Native permite crear Apps nativas a partir de una misma base de código escrito en JavaScript y React. Esto significa que podemos crear Apps nativas para iOS y Android usando la popular librería de JavaScript React. Por lo que realmente es un lenguaje de web pero adaptado y cambiado para que en lugar de ser ejecutados en el navegador, puedan usarse directamente sobre los dispositivos móviles con diferente software.

La solución que aporta es un diseño de pantallas con componentes JSX al estilo HTML pero cuyo resultado será un componente nativo.

Por ejemplo, una etiqueta <TEXT> en la pantalla, se transformará en un elemento nativo TextView de Android o en un elemento UITextView de iOS según la plataforma para que hayamos realizado la compilación. De esta forma tendremos el beneficio de un desarrollo común pero manteniendo un alto rendimiento similar a las aplicaciones nativas.  

React Native permite crear Apps móviles usando React, pero no el mismo para la web, sino enfocado a Apps. Esto significa que en el proceso de desarollo puedes usar muchos conceptos de React como componentes y más, pero ya no estarás usando elementos HTML, si no, que ahora los utilizarás con elementos de interfaces móviles nativas.

Ventajas y desventajas

En cuanto a las ventajas que ofrece React Native encontramos:

1. Desarrollo más rápido y barato de las Apps:

React Native ofrece elementos que aceleran considerablemente el proceso de desarrollo, cómo componentes para texto, imagen, animaciones, enlaces etc. Además gracias al Hot Reloading actualiza la aplicación en ejecución e incorpora las nuevas versiones de los archivos que has editado. Con todo esto y más, los desarrolladores podrán llevar a cabo la App en un tiempo inferior comparado con el desarrollo de Apps nativas.Las Startups cada vez se encuentran con un creciente número de competencia, es por eso que gracias al desarrollo más rápido de una App híbrida podrá lanzar la App móvil en ambas plataformas lo antes posible.

Por otra parte el coste de crear una App híbrida con React Native resulta más barato. Esto es debido a que el desarrollador solo necesita compilar una aplicación una sola vez en JavaScript. En cambio, un enfoque nativo requiere la creación de dos aplicaciones con dos softwares diferentes; una para iOS y otra para Android. Por tanto, es necesario un equipo más amplio y que cuente con los desarrolladores de cada tecnología y más inversión de tiempo, de ahí el precio más elevado.

2. Uso del conocido lenguaje JavaScript
Tamaño de las diferentes comunidades de lenguajes de programación durante primer trimestre de 2022 – SlashData State of the Developer Nation 2022nd Edition

Según los datos de SlashData State of the Developer Nation 22nd Edition, el lenguaje de programación más usado en 155 países es JavaScript, y se estima que hay más de 31 millones de desarrolladores activos en el mundo. Esto se traduce en que la mayoría de desarrolladores no dudan en escoger React Native para programar ya que está escrito en JavaScript.

3. Código abierto

Como ya hemos mencionado con anterioridad, React Native permite a los desarrolladores usar sus bibliotecas y marcos de trabajo de forma gratuita y con fácil acceso. Por lo que con una simple descarga ya podrás empezar a programar.

4. Similar al rendimiento nativo

React Native desempeña un papel importante durante las mejoras de rendimiento realizadas a través de módulos y controles nativos. La interfaz de usuario que proporciona React Native parece y se siente nativa debido a sus interacciones de JavaScript con el entorno nativo.

5. Multiplataforma sin problemas

Los componentes de React envuelven el código nativo existente e interactúan con las API nativas a través del paradigma de UI declarativo de React y JavaScript. Esto permite el desarrollo de Apps nativas y puede permitir que los equipos nativos existentes trabajen mucho más rápido. El framework puede comunicarse tanto con códigos de JavaScript como con un código nativo, esto es gracias al Bridge: un puente que permite la interacción entre ambos códigos. Sin este bridge no hay ningún medio por tal de que el código nativo transmita información al código JavaScript y viceversa.

6. Arquitectura modular

Con la Programación Modular. las funciones del programa se pueden dividir en diferentes bloques libres intercambiables: los “módulos”.  Es un procedimiento de software que ofrece un desarrollo flexible y también crea una mejor cooperación entre ellos para recibir actualizaciones. Los desarrolladores de React Native pueden actualizar fácilmente las aplicaciones debido a su intuitiva arquitectura modular. Al igual que los códigos, también puede reutilizar los módulos para API web y móviles.

7. Grandes aplicaciones que han apostado por React Native

La credibilidad y los ejemplos son los que mejor pueden ayudar a escoger entre ambas modalidades de Apps. Algunas redes sociales y marcas conocidas han usado React Native para desarrollar sus Apps, como por ejemplo Facebook, Instagram, Shopify, Discord, Pinterest, Uber Eats, Walmart, Wix, Adidas, Tesla, Slype, etc.

Aunque no todo es de color de rosa, y React-Native también cuenta con sus desventajas:

1. Menor rendimiento

Al no tratarse de Apps nativas, el rendimiento que vamos a tener con las web responsive y las PWA va a ser menor. React Native es excelente para crear aplicaciones simples con imágenes atractivas. Sin embargo, lograr un rendimiento excelente se convierte en un desafío cuando necesita agregar funciones complejas. Por lo tanto, puede que tenga que conformarse con uno de los dos. 

Además la gestión de memoria de React Native no es la mejor, y tampoco sería la plataforma ideal para crear aplicaciones de gran rendimiento.

2. Aplicaciones más pesadas

Las aplicaciones generadas con React-Native ya de base ocupan más espacio que las aplicaciones generadas con otros sistemas, nativos o híbridos, lo cuál implica que pueden tardar más en descargarse, en instalarse y ocupar más espacio en el dispositivo.

3. Esta en fase beta

Actualmente React-Native sigue en su versión 0.69, lo cuál significa que está en Beta. Lo que supone que entre versiones puede haber bastantes diferencias y problemas de compatibilidad. Esto puede conllevar un bloqueo en el desarrollo y que fácilmente el proyecto se quede atascado en una versión obsoleta.

4. Tecnologia atrasada

Los desarrolladores a veces necesitan el apoyo de desarrolladores nativos para implementar ciertas funciones de la aplicación. Si bien los desarrolladores pueden aprovechar las bibliotecas para realizar muchas funciones, no ayudarán mucho cuando se enfrenten a problemas nativos. 

5. Problemas complejos entre distintos dispositivos

Al no desarrollarse de forma nativa, pueden surgir complicaciones a la hora de resolver los desafíos específicos del dispositivo. Por ejemplo, puede ser que la App funcione correctamente en un iPhone X, pero no en un iPhone 12, e igual son Android. Para poder resolver algunos de estos problemas o agregar estos componenetes necesarios se deben usar recursos de terceros. Esto conlleva a que a veces los terceros no tengan la solución y por tanto tendrán que encontrar los propios desarrolladores una manera de resolver el problema por ellos mismos.

La opinión de nuestro experto en desarrollo de Apps híbridas

Contar con una opinión sincera por parte de un profesional puede ayudar a entender y ver la realidad del desarrollo de una App híbrida con React Native. Es por eso, que nuestro Full Stack Oscar nos ha dado su punto de vista acerca de ello:

“React-Native, junto a Flutter y Ionic lidera el desarrollo de aplicaciones híbridas. Cada una de estas herramientas usa una estrategia diferente para conseguir reaprovechar el mismo código para múltiples plataformas, principalmente Android y iOS. React Native intenta que la aplicación final sea lo más parecido a una aplicación nativa, usando de hecho widgets y vistas nativas.

Lo mejor de React-Native es que el resultado final será lo más fiel posible a un desarrollo nativo, pero aprovechando las ventajas del desarrollo híbrido, y además está respaldado por una empresa como Meta (antes Facebook), líder en desarrollo de librerías de código, con lo cuál mantiene un desarrollo y un mantenimiento contínuo. Además aprovecha la gran comunidad que hay detrás de React, el framework web.

No obstante también tiene sus contrapartidas, como el tamaño de la App, donde una App vacía (android) puede ocupar ya 50mb, contra los 10-15mb de ionic o flutter. También una larga cantidad de dependencias, largo tiempo de compilación, y hay que tener en cuenta que su versión actual aún es la 0.69 (Julio 2022), es decir, aún está en beta y por ello hay bastantes cambios entre versiones y puede ser inestable a veces.”

Dependerá del objetivo de cada proyecto decidirse por el desarrollo de una App híbrida o de una App nativa, puesto que ambas tienen sus ventajas y desventajas. Te animamos a que nos contactes y de nuestros expertos te aconsejarán en función de tus necesidades. Escojas lo que escojas, te garantizamos el éxito​​​🚀​

¿Interesado en nuestros servicios?
¡Pídenos un presupuesto!

Pedir presupuesto