Flutter
Flutter es el kit de interfaz de código abierto de Google para apps móviles, web y escritorio con Dart. Cómo funciona, errores y pruebas del backend.
¿Qué es Flutter?
Flutter es el kit de herramientas de interfaz de código abierto de Google para crear aplicaciones móviles, web y de escritorio a partir de una sola base de código escrita en el lenguaje Dart. En lugar de envolver los controles nativos del sistema, Flutter dibuja su propia interfaz con su propio motor de renderizado, y todo lo que ves está hecho de widgets. Un único proyecto puede apuntar a Android, iOS, Windows, macOS, Linux y la web.
Cómo funciona Flutter
Dart y compilación
Durante el desarrollo, las aplicaciones Flutter se ejecutan en una máquina virtual, lo que da recarga en caliente con estado: cambias el código y ves el resultado sin recompilar todo. En las versiones de lanzamiento, Flutter compila Dart directamente a código máquina (Intel x64 o ARM). En la web, Dart se compila a JavaScript o WebAssembly. La lista actual de plataformas y versiones de sistema compatibles está en la página de plataformas compatibles de Flutter y cambia entre versiones.
Widgets
Un widget es una descripción inmutable de una parte de la interfaz de usuario. Compones widgets pequeños en un árbol: un botón está en una columna, que está en un scaffold, que está en la aplicación. Cuando cambia el estado, Flutter reconstruye los widgets afectados, así que la pantalla es una función de tu estado. Flutter tiene su propia implementación de cada control de interfaz en lugar de usar los del sistema.
Renderizado con Impeller
El motor de Flutter, escrito en su mayor parte en C++, rasteriza cada fotograma. Impeller es su renderizador y compila los shaders al construir el motor, de modo que no se compilan mientras la aplicación se ejecuta. Según la documentación de Flutter para la versión 3.47, Impeller es el único renderizador compatible en iOS, está activado por defecto en Android API 29 y posteriores (los dispositivos más antiguos recurren a OpenGL) y está activado por defecto en macOS, Linux y Windows. Flutter en la web sigue usando Skia.
Ejemplo
Un equipo de reparto de comida crea una aplicación. La lista de restaurantes es un ListView de widgets de tarjeta alimentado por un endpoint REST. Al tocar una tarjeta se abre la pantalla de detalle. El mismo código Dart se publica en App Store, Google Play y una compilación web, y las partes específicas de cada plataforma, como las notificaciones push, se gestionan con plugins.
Errores comunes
- Probar solo en un emulador rápido o en un móvil de gama alta. Los saltos de fotogramas aparecen en hardware antiguo, así que prueba en un dispositivo modesto.
- Reconstruir subárboles grandes de widgets en cada cambio de estado. Mantén el estado cerca de los widgets que lo usan.
- Llamar al backend desde muchas pantallas sin caché ni paginación, de modo que cada navegación lance peticiones lentas. Consulta la paginación de API.
- Entender "una sola base de código" como "sin trabajo por plataforma". Los permisos, las normas de las tiendas, las notificaciones push y el comportamiento web siguen variando según la plataforma.
Flutter, pruebas de carga y monitorización
La fluidez de Flutter en pantalla es un asunto del cliente y se revisa con las herramientas de perfilado de Flutter en dispositivos reales. Lo que la aplicación suele esperar es el backend. Cada pantalla que carga datos llama a un endpoint de API, y una latencia alta ahí se percibe como una aplicación lenta. LoadFocus no perfila la interfaz de Flutter, pero sí puede probar los servicios que hay detrás. Usa las pruebas de carga para ver cómo se comportan esos endpoints cuando muchos usuarios abren la aplicación a la vez, y la monitorización de APIs para comprobarlos las 24 horas y recibir una alerta cuando uno falle o se ralentice. Dos lecturas prácticas: medir los tiempos de carga de una app móvil con pruebas de carga en la nube y optimizar el rendimiento de las API móviles. Si comparas herramientas, consulta React Native y Expo.
Preguntas frecuentes (FAQ)
¿Qué lenguaje usa Flutter?
Flutter usa Dart. Dart es orientado a objetos, y las aplicaciones Flutter se compilan a código máquina nativo en las versiones de lanzamiento, o a JavaScript o WebAssembly para la web.
¿Qué plataformas admite Flutter?
Android, iOS, Windows, macOS, Linux y la web. Las versiones de sistema y los navegadores compatibles cambian en cada versión, así que consulta la página de plataformas compatibles de la documentación de Flutter.
¿Es Flutter lo mismo que React Native?
No. Ambos crean aplicaciones multiplataforma, pero Flutter dibuja su propia interfaz con su propio motor y usa Dart, mientras que React Native usa JavaScript y renderiza con componentes de interfaz nativos.
¿Cómo pruebo el backend de una aplicación Flutter?
El backend es una API HTTP normal, así que puedes probar su carga y monitorizar sus endpoints con las mismas herramientas que usarías con cualquier otro cliente. Mide el tiempo de respuesta y la tasa de errores, no solo que la aplicación arranque.
Términos relacionados
Herramientas LoadFocus relacionadas
Lleva este concepto a la práctica con LoadFocus, la misma plataforma que potencia todo lo que acabas de leer.