Close
  • Home
  • Servicios
    • Desarrollo a medida
    • Big Data Platform
    • Testing & QA
    • Integraciones complejas
    • Consultoría tecnológica
    • Innovación
  • Agilia Center
    • Cómo trabajamos
    • Sobre nosotros
    • Blog
  • Portfolio
  • Trabaja con nosotros
    • Prácticas de empresa
    • Lista de ofertas
  • Contacto
  • en_GBEN
  • es_ESES
  • Home
  • Servicios
    • Desarrollo a medida
    • Big Data Platform
    • Testing & QA
    • Integraciones complejas
    • Consultoría tecnológica
    • Innovación
  • Agilia Center
    • Cómo trabajamos
    • Sobre nosotros
    • Blog
  • Portfolio
  • Trabaja con nosotros
    • Prácticas de empresa
    • Lista de ofertas
  • Contacto
  • en_GBEN
  • es_ESES

  • Home
  • Servicios
    • Desarrollo a medida
    • Big Data Platform
    • Testing & QA
    • Integraciones complejas
    • Consultoría tecnológica
    • Innovación
  • Agilia Center
    • Cómo trabajamos
    • Sobre nosotros
    • Blog
  • Portfolio
  • Trabaja con nosotros
    • Prácticas de empresa
    • Lista de ofertas
  • Contacto
  • en_GBEN
  • es_ESES

Diseño y desarrollo web

ReactJS vs React Native

Cristian Rodriguez
26 de febrero de 2018

En esta entrada vamos a mostrar dos tecnologías que están irrumpiendo con fuerza en el panorama del desarrollo software, como son ReactJS y React Native. Vamos a ver a lo largo de este entrada que aunque a priori caigamos en comparar React JS con React Native, en realidad, esta comparación no tiene tanto sentido como sería el comparar React Native con otros mobile frameworks.

ReactJs

ReactJS es una librería JavaScript, desarrollada y mantenida por Facebook, enfocada a la visualización. Como React se encarga sólo de la vista de la aplicación dentro de un paradigma Modelo-Vista-Controlador, desde Facebook recomiendan encarecidamente el uso de ReactJS con Flux, que es grosso modo, un patrón de diseño software. Por este motivo, muchas veces vemos en combinación a React JS y Redux. Esta es una librería que implementa este patrón de diseño Flux y que ocupa apenas 2Kb.

ReactJS está fuertemente basado en componentes. Estos componentes son los elementos que constituyen la interfaz del usuario (un botón, un buscador, etc).

Reaccionan (de ahí viene su nombre) tanto a los eventos producidos por el usuario como a los del servidor. Finalmente, estos se repintan a sí mismos cuando ocurre un cambio de estado.

Con cada alteración se modifica un DOM virtual. Este hecho hace que el DOM real solo cambie en las partes que han experimentado alteraciones. Esto se traduce en una mejora del consumo de memoria y el rendimiento con respecto a otros frameworks.

React Native

Antes de entrar en más detalle sobre React Native, hay que tener muy presente la diferencia entre dos tipos de tecnologías de cara al desarrollo de aplicaciones móviles: Cross-platform (o híbridas) y Nativa.

  • Las apps híbridas se desarollan usando HTML5, CSS y JavaScript. Es decir, utilizan el mismo código independientemente de la plataforma en que se ejecutan. Se incrustan dentro de una webview o una Web App.

  • Las apps nativas se desarrollan usando el lenguaje requerido por la plataforma de destino en concreto: Objective-C y Swift para iOS, Java y Kotlin para Android, etc.

Estos dos enfoques  han imperado durante mucho tiempo en el desarrollo mobile. Pero con la irrupción de React Native este enfoque está cambiando. React Native es un mobile framework JavaScript que usa los componentes de ReactJS para construir aplicaciones “nativas” para móviles. Es decir, su desarrollo no es 100% cross-platform. Y es aquí donde radica su importancia frente a otros frameworks mobile y el porqué está revolucionando el desarrollo móvil.

Las vistas las crea de forma nativa. Esto significa que tiene un intérprete que a medida que la app se va ejecutando. Lo lee el HTML de estas vistas y va colocando cada uno de los componentes nativos en su posición.

Por ejemplo, el caso en el que la vista expresa que hay que poner un botón en la pantalla Home.

Cuando la app llegue a esta pantalla React Native creará un botón nativo y lo colocará en su posición correspondiente. Esto le dará una clara ventaja de que todo el frontend. Es decir, todas las interacciones con el usuario serán nativas.

¿Cómo surge React Native?

Con el paradigma existente antes de la llegada de este framework, cada enfoque tenía sus ventajas e inconvenientes:

  • Las apps nativas tienen un aspecto profesional y su rendimiento es considerable. Sin embargo, es necesario conocer cada plataforma a fondo. Son propensas a tener una infinidad de bugs si no se controla el código con exhaustividad. Otro aspecto a tener en cuenta es que al desarrollar en nativo, se tiene la sensación de estar repitiendo el trabajo una y otra vez en cada plataforma.
  • El desarrollo en web App simplifica la programación al utilizar una misma plataforma común. Sin embargo, en muchas ocasiones su aspecto y rendimiento no son tan finos como cabría esperar. También hay que tener en cuenta que estas apps tendrán un acceso muy limitado al hardware y a los APIs nativos[1] (GPS, notificaciones push…). Además, estos sistemas suelen tener entornos de desarrollo y depuración bastante pobres en comparación con los nativos (XCode y Android Studio por ejemplo).

Así pues, React Native nace tras la pregunta que muchísimos desarrolladores se hacen, ¿No sería posible desarrollar una app con el rendimiento nativo pero con los beneficios del desarrollo web? La respuesta rápida es sí, con React Native y su enfoque híbrido: Un rápido desarrollo y una experiencia de usuario nativa.

Conclusiones

En nuestra opinión, React y React Native tienen un futuro bastante prometedor. Gracias a su base construida en JavaScript, poseen una amplia comunidad y podemos encontrarnos muchas librerías que nos simplificarán nuestros desarrollos. Su fuerte respaldo de una gran compañía como es Facebook y el gran rendimiento que ofrecen gracias a su arquitectura, las hace herramientas muy poderosas a tener en cuenta en el desarrollo software.

En el caso particular de React Native,  aunque Ionic sigue en constante crecimiento y cada vez está mejorando más sus prestaciones, el nuevo enfoque que ha aportado React Native al paradigma del desarrollo mobile, ha hecho que le surja un excelente competidor.

Ante la obligada pregunta que el lector seguramente se esté haciendo sobre qué opciones de las presentadas elegir a la hora de desarrollar un proyecto mobile, sentimos que el sentido de la respuesta sea tan amplio: depende del proyecto.  Por poner un ejemplo, si estamos ante un proyecto en el que se deba usar el hardware del dispositivo de forma muy concreta y con poca tolerancia a fallos, entonces deberemos elegir el desarrollo nativo. Pero si hemos de elegir un desarrollo híbrido, y aún no tenemos muy claro de qué framework debemos elegir para nuestro desarrollo, hay que tener en cuenta la dificultad de desarrollar y la curva de aprendizaje que tiene React Native frente a otros frameworks como pueden ser Ionic.

¿Interesado/a en más posts parecidos a este? Echa un vistazo a nuestras últimas entradas sobre diseño y desarrollo web.


ionicjavascriptmobile frameworkreactreact native

Leave A Reply Cancelar la respuesta

Tu dirección de correo electrónico no será publicada. Los campos obligatorios están marcados con *

*

*

Los seis mejores plugins de CRM para WordPress
Previous Article
Bibliotecas Lodash: ¿qué son y en qué consisten?
Next Article

Oficina de Sevilla

Calle Arquitectura
2, Torre 11, 41015, Sevilla.

Oficina de Huelva

Calle Caucho, nº1, Edificio 2000,  2ª, 21110, Aljaraque, Huelva

Teléfono de contacto

+34624809507

Empresa

Sobre nosotros
Política de gestión de la seguridad de la información
Nuestro blog
Trabaja con nosotros
Nuestros proyectos
Contacta con nosotros

Síguenos en nuestras redes sociales

Linkedin
© Copyright 2024
Do you accept our cookies?
We use cookies on our website to provide you with the best experience based on your preferences. By clicking "Accept," you consent to the use of ALL our cookies.
Cookie settings¡Acepto!

Manage consent

Privacy Overview

This website uses cookies to improve your experience while you navigate through the website. Out of these, the cookies that are categorized as necessary are stored on your browser as they are essential for the working of basic functionalities of the website. We also use third-party cookies that help us analyze and understand how you use this website. These cookies will be stored in your browser only with your consent. You also have the option to opt-out of these cookies. But opting out of some of these cookies may affect your browsing experience.
Necessary
Siempre activado
Necessary cookies are absolutely essential for the website to function properly. This category only includes cookies that ensures basic functionalities and security features of the website. These cookies do not store any personal information.
Non-necessary
Any cookies that may not be particularly necessary for the website to function and is used specifically to collect user personal data via analytics, ads, other embedded contents are termed as non-necessary cookies. It is mandatory to procure user consent prior to running these cookies on your website.
GUARDAR Y ACEPTAR
ES
EN ES
Agilia CenterLogo Header Menu
  • Home
  • Servicios
    • Desarrollo a medida
    • Big Data Platform
    • Testing & QA
    • Integraciones complejas
    • Consultoría tecnológica
    • Innovación
  • Agilia Center
    • Cómo trabajamos
    • Sobre nosotros
    • Blog
  • Portfolio
  • Trabaja con nosotros
    • Prácticas de empresa
    • Lista de ofertas
  • Contacto
  • en_GBEN
  • es_ESES