Actualizaciones Flutter Web Setiembre 2019

Eduardo Coto
20 septiembre, 2019

. . .

Hola a todos, esta es una traducción del artículo originalmente escrito por Fun with Flutter en su perfil de medium.

Como habrás escuchado, la rama separada de Flutter-Web se ha fusionado en el repositorio principal de Flutter. Esto significa que ya no necesitas hacer importaciónes especiales para tus proyectos de Flutter-Web. Esto también significa que puedes importar paquetes desde la tienda pub en tus aplicaciones como normalmente lo haces.

Aunque no te emociones demasiado, al momento de escribir, esto es solamente disponible en el canal dev y master de Flutter — así que necesitas cambiarte a esos canales y probar el manejo de Flutter Web. Además necesitaras habilitar Flutter Web.

flutter config --enable-web

Para más información sobre su canal actual y cómo cambiar y actualizar canales ver Canales Flutter.

Para obtener una visión general completa e información actualizada sobre cómo habilitar Flutter Web, sugiero que visites la página de inicio de Flutter Web .

El proceso de convertir mi aplicación de Flutter Web al repositorio principal de Flutter fue bastante suave. Implicó cambiar algunas importaciones en el archivo pubspec.yaml, y cambiar o eliminar todas las dependencias específicas de Flutter-Web. Ahora se parece a las dependencias normales del pubspec.yaml que hemos llegado a amar. Si quieres ver un ejemplo, puedes echar un vistaso al archivo pubspec.yaml en el sitio de FunWith.

Ejecutando

flutter create su_nombre_proyecto

Puedes lanzar tú aplicación de depuración en Chrome, ejecutando:

flutter run -d chrome

Todas las opciones anteriores están disponibles en Visual Studio Code y supongo que en Android Studio(no lo uso). Es decir mientras ejecutas tu aplicación desde el IDE debería abrir el navegador como una opción para iniciar. Ejecutando la aplicación en modo depuración requerirá Chrome. Sin embargo, cuando construyes básicamente estás generando archivos HTML y JavaScript, lo que significa que se puede alojar como normalmente alojarías un sitio web estático y se ejecutará en cualquier dispositivo/plataforma/navegador. El rendimiento puede variar — en el momento de escribir, observé mejor rendimiento en Chrome.

En los últimos día que convertí la aplicación FunWith al repositorio principal, agregé autenticación Firebase, cambiando código, intenté agregar paquetes, hacer huso de elementos nativos HTML, y publicar una versión de lanzamiento, me encontré con muchos problemas. Algunos que eran específicos de la plataforma, algunos trabajos creativos necesarios, algunos que fueron corregidos por el equipo de Flutter y obviamente uno o dos por mi.

El punto es, proceder con precaución. Dicho todo esto, Flutter Web es SUPER INCREIBLE.

En los últimos meses, he visto muchas mejoras en el rendimiento de mi aplicación(ver el video de YouTube al principio, donde ejecuto a travez de las diferentes iteraciones de mi aplicación hasta este punto). Especialmente ahora que puedes crear versiones de lanzamiento de su aplicación Flutter Web, ejecutando:

flutter build web --release

Además de eso, el navegador ahora reconoce su ratón cuando se posiciona sobre los elementos, y puedes usar la rueda de desplazamiento del ratón para desplazarse en Flutter Web.

Estaré haciendo más publicaciones de Flutter Web a medida que agrege características; también estaré creando un par de publicaciones en el blog y videos explicando mi actual implementación, como incorporar Firebase y algunos trabajos que solían agregar cierta funcionalidad(enlaces, tabulaciones). Note que dependiendo de cuándo leas esto, el entorno podría se completamente diferente — como Flutter Web esta madurando y agregando más características, podría ser diferente en el futuro. Siempre busca la información más actualizada.

Si quieres ver un sitio web hecho en Flutter Web, sientase libre de revisar el sitio web Fun with Flutter. El código es también de código abierto, si estás interezado puedes encontrarlo aquí.

Por último, pero no menos importante, ahora crea una cuenta en el sitio (usa Firebase como back-end). ¡Si te registras, el sitio te revelará el canal de YouTube Flutter que actualmente disfruto más! Los firmantes de reserva anticipada también serán recompensados con descuentos en material futuro y otros artículos. Dependiendo de cuándo lea esto, es posible que ya haya otras cosas interesantes en el sitio. Así que ve a verlo de todos modos 🙂

8

Deja un comentario

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

Comunidades en Español