Progresive Web Apps ¿Son realmente el futuro?
A finales de 2015, Google hizo público un nuevo e interesante enfoque para el desarrollo de aplicaciones que, según su teoría, anunciaría un cambio con respecto a la funcionalidad limitada y el diseño bloqueado por la plataforma que prevalecía en el sector. Este nuevo método se conoce como «aplicación web progresiva», o PWA (progressive web app).
Ahora veamos la definición de Google:
Las aplicaciones web progresivas brindan una experiencia instalable, similar a una aplicación en computadoras de escritorio y móviles, que se crean y entregan directamente a través de la web. Son aplicaciones web que son rápidas y confiables. Y lo más importante, son aplicaciones web que funcionan en cualquier navegador. Si está creando una aplicación web hoy, ya está en el camino hacia la creación de una aplicación web progresiva.
By Pete LePage
Pete is a Developer Advocate
En estos últimos tiempos, ha habido mucho ruido en torno a los PWAs y muchos expertos afirman que es el futuro del desarrollo web, especialmente en términos de dispositivos móviles. En su esencia, una aplicación web progresiva (PWA) es simplemente una aplicación web que utiliza técnicas web modernas para ofrecer una experiencia similar a una aplicación nativa a los usuarios.
Progressive Web Apps es la nueva moda en la comunidad de desarrollo web. En el pasado, hemos visto el desarrollo web separado para dispositivos de escritorio y móviles. Aunque las aplicaciones nativas todavía están en uso, no hay manera de que se desvanezcan con el tiempo.
Hablando de aplicaciones web progresivas, han sido populares en los últimos años. La popularidad de los PWAs se debe principalmente a la resolución de los problemas que persisten en las aplicaciones nativas y el diseño web sensible.
Se trata de aplicaciones web con mejoras progresivas para implementar funciones como el almacenamiento en caché, la sincronización en segundo plano y las notificaciones push.
A pesar de que las PWAs han existido por más de dos años, la respuesta es bastante poco convincente. Pocas plataformas han adoptado esta filosofía, pero la mayoría no la ha adoptado en realidad en gran medida. Chrome y Mozilla son quizás los mejores navegadores para probar tus PWAs, ya que Apple aún no se ha metido en esto.
PWA – ¿Desplazaran realmente las apps móviles?
Por un lado, tenemos aplicaciones nativas que sin duda son rápidas y eficientes en la mayoría de los casos. Por otro lado, hay sitios web que son un poco lentos y con los problemas de conectividad, sólo empeoran.
El Proyecto de Páginas Móviles Aceleradas (AMP), encabezado por Twitter y Google, se lanzó en 2016 para resolver únicamente estos problemas de conexión lenta. Los PWAs funcionan perfectamente en todos los escenarios posibles. Con una buena conexión, nunca hay un problema. El problema es cuando no tenemos conexión y se nos alerta con una página de error.
Pero esto puede llegar a ser muy molesto si tenemos una conexión lenta. La página parece estar cargando y todo lo que vemos es una pantalla en blanco. Simplemente esperamos, esperamos y esperamos, pero la página nunca parece cargarse. Aquí es donde PWA viene a rescatarnos. Lo mejor de los PWAs, es que obtienes la mejor experiencia de usuario posible en conectividad lenta y sin conectividad. Sí así es.
¿Por qué tiene sentido usar PWA?
Según un estudio, un usuario medio dedica el 80% de su tiempo total a aplicaciones, y en solo tres de ellas (Chrome, Quora y Medium).
Las otras aplicaciones simplemente permanecen inactivas durante la mayor parte de este tiempo consumiendo una parte preciosa de la memoria. Además, cuesta alrededor de diez veces desarrollar una aplicación en lugar de crear un sitio web para la misma. El coste puede ser mucho mayor si planeas desarrollar y mantener bases de código separadas para diferentes plataformas como Android, iOS y la web.
Características de la aplicación nativa que los PWAs pueden usar
1.- Notificaciones push
2.- Pantalla completa
3.- Trabajo offline
4.- La pantalla completa es compatible, lo que le da una sensación más parecida a la de una aplicación.
Los PWAs pueden hacer uso de muchas más de estas características. Los puntos anteriores son sólo para darle una pista de lo que los PWAs son capaces de hacer. Sin embargo, hay algunas características tradicionales que sólo las aplicaciones nativas tienen la capacidad de realizar.
Funciones de la aplicación nativa que los PWAs no pueden usar
1.- Sin acceso o con acceso altamente restrictivo a diferentes sensores de hardware
2.- Alarmas
3.- Acceso al directorio telefónico
4.- Configuración del sistema de modificación
5.- Funcionalidades más especializadas de la cámara
Los PWAs están evolucionando bastante rápido y esperamos ver que estas características entren en acción muy pronto.
2 Componentes Principales de un PWA
Manifiesto de aplicaciones
Es un archivo JSON que define un icono de aplicación, cómo lanzar la aplicación (independiente, a pantalla completa, en el navegador, etc.), y cualquier información relacionada. Se encuentra en la raíz de tu aplicación. Se requiere un enlace a este archivo en cada página que tiene que ser renderizada.
Service Worker
El service worker, es donde ocurre la mayor parte de la magia. No es más que código JavaScript que actúa como proxies programables, y es el único responsable de interceptar y responder a las peticiones de la red. Ya que actúa como un proxy y puede ser fácilmente programable, la aplicación debe ser servida sobre HTTPS para mantener los datos seguros.
Vale la pena notar que el servicio de trabajo, almacena en caché la respuesta real, incluyendo todas las cabeceras HTTP, en lugar de sólo los datos de respuesta. Esto significa que su aplicación puede simplemente hacer peticiones de red y procesar la respuesta sin ningún código específico para manejar la caché.
¿Cómo puedo empezar en el mundo de las PWA?
Lo mejor de empezar es que es bastante más fácil de lo que parece. De hecho, es muy posible escoger un sitio web existente y convertirlo en un PWA. En internet hay muchas herramientas y cursos para comenzar con Progresive Web Apps.
Para muestra un botón, a continuación te dejaremos un enlace de un mini curso que da nuestro amigo el Sr. google y que a nuestro parecer es muy practico para comenzar en el mundo de las PWA
https://developers.google.com/web/fundamentals/codelabs/your-first-pwapp/?hl=es
Comparativa de Costos de PWA vs Apps
Aquí hay una realidad latente, el costo de una PWA vs App no es comparable, así como sus funciones, en Internet hay muchos blogs hablando de este tema pero en realidad falta objetividad en los artículos que he leído y que no voy a mencionar, en base a nuestra experiencia al contratar una PWA lo que esperas prácticamente es un sitio web, con algunas funcionalidades para móvil y cuando quieres contratar una app móvil nativa, contemplas funcionalidad mas especializada y un rendimiento mucho mejor, el código nativo es más rápido que el código web, ya que este se compila y no se interpreta como la web. La relación de costos de una PWA son comparables con una web creada desde 0, no se podría comparar con una app nativa.
Conclusión sobre PWA
Progressive Web App es el futuro del desarrollo web sin ninguna duda. En el futuro, los sitios de comercio electrónico, restaurantes y fuentes de medios pasarán de la aplicación web nativa a la aplicación web progresiva.
Sin embargo, aún en la fase inicial, muchos de los desarrolladores estarían buscando activamente formas de aprovechar al máximo las oportunidades que ofrecen los PWAs. Creemos que las PWA aun les falta mucho por evolucionar para desplazar completamente a las App Nativas, especialmente cuando son app personalizadas para resolver problemas con algoritmos más complejos.
Como en todo sistema lo importante es adaptarse a las necesidades del usuario final, conocer las nuevas tecnologías nos amplia el panorama para poder ofrecer al cliente la mejor relación costo-beneficio, hay algunos que les ira bien una PWA hay otro una App Nativa ó Híbrida en fin la tecnología evoluciona a pasos rápidos y es nuestra obligación como desarrolladores ir a la par.
Muchas gracias por leer este articulo, nos leemos hasta la próxima.