Hablemos un poco de Flutter y React Native: ¿Cuál es mejor?

 

Flutter y React Native son dos frameworks populares para crear aplicaciones móviles multiplataforma. Ambos ofrecen ventajas únicas y tienen algunas diferencias. Como toda tecnología, el saber cual utilizar depende de muchos factores, normalmente entre ellos destacan los requerimientos del cliente, la cuestión económica, el tipo de desarrollo que se hará y también la experiencia que tenga el equipo de desarrollo.

En esta entrada del Blog, me permito presentar una visión comparativa muy, muy personal sobre unos puntos muy particulares entre Flutter y React Native. Esta comparación la hice porque estoy aprendiendo Flutter, y antes de aprender sobre tecnología multiplataforma (ya se algo de Low-Code y No-Code), me gusta ver la opción que me convenga más en cuánto a facilidad de aprendizaje, pero principalmente con respecto a actualizaciones y respaldo de alguna comunidad o empresa grande. Esto se debe a que quiero utilizar una tecnología que me pueda garantizar que las librerías y componentes salgan pronto para no tener problema cuando exista alguna actualización nativa (del iOS o Android OS) y necesite actualizar mis aplicaciones. Las categorías consideradas para esta comparación son: lenguaje de programación, diseño de interfaz de usuario, rendimiento, desarrollo rápido, respaldo de una comunidad, integración con módulos o funciones nativas, popularidad, ambiente de desarrollo En el entendido de que me encuentro aprendiendo Flutter, y he desarrollado cosas más en web y en escritorio, es decir, no soy un programador o desarrollador de aplicaciones móviles profesionales. Veamos mi opinión al respecto de estas categorías (este carácter especial representa un punto a favor: 👍):

1. Lenguaje de programación:

• Flutter: Desarrollado por el gran Google, este utiliza el lenguaje de programación Dart. Compila a código nativo ARM (arquitectura común para dispositivos móviles, ya ARM64), proporcionando un alto rendimiento. Dart fue creado exclusivamente para ser utilizado con Flutter, fue pensado y concebido para Flutter en su totalidad. 👍
• React Native: Desarrollado por Facebook, utiliza JavaScript y permite a los desarrolladores utilizar librerías y componentes de la amplia comunidad de JavaScript.

2. Diseño de interfaz de usuario:

• Flutter: Ofrece gran conjunto de widgets personalizables y proporciona un control pixel-perfect (concepto utilizado por diseñadores digitales: diseñar logrando la perfección) sobre la interfaz de usuario. No depende de componentes nativos. Flutter utiliza Skia, un motor gráfico 2D de alto rendimiento para representar elementos visuales en la pantalla nativa. En esencia, opera como un motor de videojuegos, donde renderiza elementos gráficos en un lienzo de Skia y luego lo presenta en la plataforma nativa. Esta plataforma exhibe el lienzo y, si es necesario, envía eventos a la aplicación correspondiente. 👍
• React Native: Utiliza componentes nativos, proporcionando un aspecto más nativo. Sin embargo, la personalización podría ser limitada en comparación con Flutter.

3. Rendimiento:

• Flutter: Compila a código nativo ARM, lo que se traduce en un alto rendimiento. Es conocido por sus animaciones suaves y renderizado rápido. 👍
• React Native: Utiliza un puente para comunicarse con los módulos nativos, lo que puede introducir cierta sobrecarga de rendimiento, aunque generalmente es lo suficientemente rápido para la mayoría de las aplicaciones, difícilmente se notaría esto, salvo una aplicación bastante robusta y con muchas, muchas peticiones.

4. Desarrollo rápido:

• Flutter: Ofrece una función de "recarga en caliente" (Hot Reload) que permite a los desarrolladores ver cambios inmediatos en la aplicación a medida que escriben código, es decir, sin necesidad de detener el emulador y volverlo a abrir para ver los cambios (algunos cambios), lo que acelera el desarrollo. 👍
• React Native: También ofrece una función de "recarga en caliente" para un desarrollo rápido, pero podría tener tiempos de compilación ligeramente más largos en comparación con Flutter.

5. Respaldo de una comunidad:

• Flutter: Tiene una comunidad en crecimiento, con librerías de funciones y plugins disponibles en pub.dev. Salen widgets nuevos, se publica el de la semana, el más usado, etc. Esta muy activa su comunidad.
• React Native: Tiene una comunidad más grande y bien establecida, con un gran número de librerías y componentes de terceros disponibles siempre a través de npm (Node Package Manager). Tiene más tiempo en el mercado. 👍

6. Integración con módulos nativos o funciones nativas:

• Flutter: Requiere que los desarrolladores escriban código específico de la plataforma (Java/Kotlin para Android y Objective-C/Swift para iOS) para ciertas funcionalidades.
• React Native: Ofrece un puente para comunicarse con módulos nativos, facilitando relativamente la integración de código nativo cuando sea necesario. 👍 

7. Popularidad:

• Flutter: Se volvió famoso muy pronto!!!. Es utilizado para construir aplicaciones por empresas como eBay, Google y Alibaba.  Se utilizó para desarrollar apps como GitConnect.
• React Native: Lleva mucho más tiempo en el mercado que Flutter. Actualmente, es utilizado por muchas empresas internacionalmente conocidas, tales como Facebook (claro incluye Instagram),  Airbnb y Uber. Se utilizó para desarrollar Apps como Shopify, Pinterest, Bloomberg, Walmart y ADIDAS. 👍

8. Ambiente de desarrollo:

• Flutter: Te brinda un ambiente de desarrollo completo conocido popularmente como Flutter DevTools para depuración. 👍
• React Native: Depende de herramientas de terceros para la depuración (debug), pero IDEs (ambientes de desarrollo integrado, por su traducción) populares como Visual Studio Code tienen extensiones para el desarrollo de React Native.

Flutter obtiene 5 de 8 puntos a favor. Creo que de momento seguiré aprendiéndolo para desarrollar aplicaciones móviles multiplataforma, que pueden ser creadas para Widows, Linux y Mac también con el mismo código del proyecto Flutter. Un dato importante para tener en cuenta es que React Native fue lanzado en 29 de mayo de 2013 por Facebook y Flutter 1 se lanzó el 4 de diciembre de 2018, Flutter 2 el 3 de marzo de 2021 y Flutter 3 el pasado 10 de mayo de 2023. En antigüedad y creo madurez React Native lleva ventaja aproximadamente por 3 años, pero es importante mencionar que Flutter ha crecido bastante en tan poco tiempo. Se actualiza mucho, prueba de ello es el reciente Material Design 3 ahora en el año 2023, que sinceramente tiene unos componentes que permiten tener un mejor look & feel en tu interfaz de usuario de tu aplicación móvil.

En resumen, tanto Flutter como React Native son frameworks muy capaces y robustos para el desarrollo de aplicaciones móviles multiplataforma. La elección entre ellos depende de factores como la experiencia del equipo de desarrollo, los requisitos específicos del proyecto y la experiencia de usuario deseada. Claro, también del gusto y tiempo del programador y del tiempo que éste tenga practicando o conociendo "X" o "Y" tecnología. Mientras que Flutter proporciona un mayor control sobre la interfaz de usuario y un alto rendimiento, React Native cuenta con una comunidad más amplia, lo que lo convierte en una opción sólida para muchos tipos de proyectos también. Mientras un proyecto Flutter puede constar de varias, varias megas en tu computadora (espacio en tu disco duro), un proyecto de React Native serán menos.

Finalmente, elegir entre Flutter y React Native para una aplicación, por ejemplo, de punto de venta móvil, depende de varios factores. Ambos frameworks se pueden utilizar para crear una App de punto de venta, pero la decisión debe tener en cuenta los requisitos específicos de tu proyecto, la experiencia del equipo y otras consideraciones. Leí por ahí una opinión que señala que Flutter puede requerir más esfuerzo cuando se integra con periféricos de hardware tales como los lectores de códigos de barras o impresoras de recibos debido a que puede implicar ponerse a teclear código específico de la plataforma destino (iOS o Android), caso contrario de React Native.

Es cuanto.

Si quieres citar este artículo en tu texto, documento, etc. puedes hacerlo de la siguiente forma:

Aguilar-Calderón, J. A. (22 de septiembre de 2023). Hablemos un poco de Flutter y React Native: ¿Cuál es mejor?. ANOVA LAB MX. https://anovalabmx.blogspot.com/2023/09/hablemos-un-poco-de-flutter-y-react.html

Fuentes consultadas:

• https://www.fluttered.io/blog/que-es-flutter
• https://appmaster.io/blog/flutter-vs-react-native-which-one-is-better-for-your-project
• https://blog.back4app.com/es/react-native-vs-flutter-cual-es-mejor-para-aplicaciones-moviles-multiplataforma/
• https://www2.deloitte.com/es/es/pages/technology/articles/google-flutter-framework-rival-react-native-xamarin.html#:~:text=Su%20primera%20versi%C3%B3n%20oficial%20se,abierto%20y%20desarrollado%20por%20Google.
• https://esflutter.dev/showcase
• https://itsallwidgets.com/
• https://esflutter.dev/
• https://reactnative.dev/versions