8 ventajas de Flutter en comparaci贸n con React Native

El desarrollo m贸vil no depende cada vez m谩s del desarrollo nativo, sino del uso de marcos que ayudan a crear aplicaciones para m煤ltiples plataformas a la vez. Hoy quiero decir algunas palabras sobre Flutter, que gradualmente est谩 comenzando a ganar el mercado de React Native. Detalles - debajo del corte.



Cuando comienza el proyecto para desarrollar una aplicaci贸n m贸vil, es necesario tomar una decisi贸n sobre qu茅 plataforma programaremos. A menudo, esta pregunta est谩 influenciada por el propio cliente, que quiere ver el software creado de forma nativa para cada plataforma o, por el contrario, quiere ahorrar dinero y pide desarrollarse en React Native.

En el sitio web del proyecto puede descubrir que Flutter est谩 utilizando activamente no solo Google, sino tambi茅n algunas otras compa帽铆as. Por ejemplo, Flutter ha escrito la nueva aplicaci贸n The New York Times, as铆 como las versiones m贸viles de eBay y Aliexpress. Pero, en general, la lista no parece muy impresionante, ya que incluye no m谩s de 20 empresas.
imagen
Sin embargo, la experiencia de los desarrolladores de nuestra empresa muestra que, en algunos casos, Flutter es mejor y m谩s conveniente para crear aplicaciones m贸viles. La mente colectiva de Neti totaliz贸 8 m谩s de este marco m谩s joven.

Actuaci贸n


Las aplicaciones desarrolladas por Flutter se ejecutan mucho m谩s r谩pido que con React Native. Las ventajas de velocidad se logran a trav茅s de nuestro propio motor y el uso de otro lenguaje de programaci贸n. A diferencia de React Native, que funciona con puentes y el lenguaje Java Script, Flutter le permite resolver r谩pidamente problemas de aplicaciones, especialmente aquellos relacionados con la interfaz de usuario. Los compiladores nativos ya est谩n integrados en el marco, y el c贸digo escrito en Dart se convierte en instrucciones nativas para procesadores ARM.

Por cierto, los chicos de InVerita llevaron a cabo interesantes pruebas comparativas. Su art铆culo sobre Medium compar贸 el rendimiento de las aplicaciones terminadas en dispositivos iPhone 6 y Xiaomi Redmi Note 5 reales.

imagen

Como puede ver, la prueba de Gauss en iOS se ejecuta en Flutter incluso m谩s r谩pido que en Swift, 隆y RN muestra un retraso de 20 veces!

imagen

En el caso de Android, Flutter requiere un 20% m谩s de tiempo para completar la prueba que Java y Kotlin, pero a煤n funciona 15 veces m谩s r谩pido que RN.

Tama帽o de la aplicaci贸n


Como resultado del p谩rrafo anterior, las aplicaciones creadas sobre la base de Flutter y escritas en Dart contienen menos componentes intermedios. La compilaci贸n de instrucciones ARM nativas le permite almacenar nada m谩s. Como resultado, los binarios de la aplicaci贸n ocupan hasta dos veces menos espacio en la unidad del dispositivo que cuando se desarrollan en React Native.

Animaci贸n r谩pida


En cierto sentido, esta ventaja se deduce de la anterior. Decidimos usar Flutter para aplicaciones que tienen mucha animaci贸n incorporada. El hecho es que Flutter demuestra de manera estable 60 FPS, lo que significa que los usuarios no tienen que mirar la imagen temblorosa, como suele ser el caso con React Native.

Lenguaje de Programaci贸n Mecanografiado


La base de Flutter es Dart, un lenguaje de programaci贸n mecanografiado que ya es popular entre los entusiastas. En Dart, la codificaci贸n se convierte en programaci贸n orientada a objetos ... y aqu铆, por supuesto, podr铆amos recordar TypeScript y argumentar que tambi茅n est谩 escrito. Pero, por desgracia, en 煤ltima instancia, se transcompila y todav铆a se convierte en JavaScript sin tipo. Es decir, todas las ventajas de TS permanecen en el nivel de conveniencia del codificador y no afectan el rendimiento. Dart, por el contrario, se escribe de forma nativa. El lenguaje de programaci贸n se desarrolla activamente, con el apoyo de la comunidad. Puede escribir mucho m谩s c贸digo estructural en Dart, lo que significa que puede crear aplicaciones m谩s complejas y estructuras jer谩rquicas.

Excelente documentaci贸n


Para aquellos que quieren lidiar con la nueva plataforma en Internet, hay tutoriales en video, las posibilidades para trabajar con c贸digo en l铆nea est谩n pensadas. La comunidad dirigida por Google ha desarrollado instrucciones y gu铆as integrales. Adem谩s, la red incluso tiene una receta lista para cambiar de React Native a Flutter. Puedes verlo aqu铆 . Por supuesto, tambi茅n hay documentaci贸n para React Native, pero a menudo es in煤til debido a descripciones como "removeClippedSubviews - Esto puede mejorar el rendimiento de desplazamiento para listas grandes". La comunidad de Flutter tiene un enfoque mucho m谩s serio de la documentaci贸n.

IU de uniformidad


La conocida ventaja de React Native es la capacidad de llevar a cabo el desarrollo de varias plataformas a la vez. Sin embargo, nadie garantiza que sin finalizar con un archivo obtendr谩 de inmediato la misma interfaz. Una aplicaci贸n escrita en Flutter, por el contrario, se ve y funciona igual en iOS y Android. Nuestros programadores nunca han reescrito el c贸digo para que la aplicaci贸n funcione en iOS al igual que en Android. En el caso de React Native, todo es diferente. Dichas mejoras deben hacerse con envidiable regularidad.

Soporte para una gran cantidad de plataformas.


Flutter ya es compatible con Android, iOS y Web. A juzgar por las discusiones en la comunidad, el soporte para MacOS, ChromeOS y Windows estar谩 disponible muy pronto. Y, lo m谩s interesante, Flutter ya es compatible con la futura plataforma Google Fuchsia. Por lo tanto, cualquier desarrollo puede ser portado inmediatamente al nuevo sistema operativo.

Herramientas de desarrollo


Lo 煤ltimo que quiero se帽alar es el DevTools desarrollado. Flutter cuenta con un buen ecosistema de herramientas para desarrolladores. Puedes verlos aqu铆 . Por cierto, Facebook est谩 tratando de hacer algo similar, pero hasta donde podemos ver, RN solo tiene una versi贸n beta de DevTools hasta ahora, y por funcionalidad no llegan a las contrapartes de Flutter.

Ejemplo de c贸digo


Por ejemplo, a continuaci贸n se muestra el c贸digo "隆Hola, mundo!" para los marcos React Native y Flutter

// React Native
import React from 'react';
import { StyleSheet, Text, View } from 'react-native';

export default class App extends React.Component {
  render() {
    return (
      <View style={styles.container}>
        <Text>Hello world!</Text>
      </View>
    );
  }
}

const styles = StyleSheet.create({
  container: {
    flex: 1,
    backgroundColor: '#fff',
    alignItems: 'center',
    justifyContent: 'center'
  }
})

Y as铆 es como se ver谩 este c贸digo en Flutter

// Flutter
import 'package:flutter/material.dart';

void main() {
  runApp(
    Center(
      child: Text(
        'Hello, world!',
        textDirection: TextDirection.ltr,
      ),
    ),
  );
}

驴Flutter tiene alguna desventaja?


Por supuesto que lo son. Flutter es una plataforma joven. No hay suficientes soluciones preparadas para ello. A modo de comparaci贸n, el mismo React Native ya tiene muchas m谩s plantillas, recetas y opciones de implementaci贸n listas para usar.

Escribir una IU en Flutter lleva m谩s tiempo. Y la escritura misma del c贸digo Dart es m谩s larga. En React Native, una aplicaci贸n se crea como un constructor de componentes web. Flutter todav铆a requiere una programaci贸n completa.

Adem谩s, Flutter requiere habilidades de programaci贸n m谩s profundas. En el caso de React Native, puede confiar el desarrollo a cualquier especialista con conocimiento de Java Script. Con Dart, las cosas son m谩s complicadas, ya que este lenguaje tiene un umbral de entrada m谩s alto que JS. El programador debe tener una formaci贸n m谩s profunda.

Pero al mismo tiempo, las vacantes para desarrolladores en Flutter son a煤n bastante peque帽as. Todav铆a no hay confianza por parte de las empresas rusas en la nueva plataforma. Sin embargo, esto no nos impide llevar a cabo parte del desarrollo de este marco. Y los resultados hasta ahora son m谩s que positivos. Si tiene experiencia desarrollando en Flutter, comparta sus impresiones en los comentarios.

All Articles