Cada empresa tiene un sitio web o una aplicación móvil nativa, o incluso ambas. Sin embargo, los sitios web tienen una funcionalidad limitada y el desarrollo de aplicaciones nativas requiere una inversión significativa. Entonces, ¿dónde está el punto medio dorado? La respuesta son las aplicaciones web progresivas (PWA). Cuestan menos que las aplicaciones nativas, pero admiten funciones como notificaciones automáticas, modo fuera de línea y otras.
Esta publicación explicará qué representan los sitios web PWA, sus principales beneficios y qué tecnología utilizar para convertir un sitio web normal en una aplicación web progresiva.
El significado de las aplicaciones web progresivas (PWA)
Las aplicaciones web progresivas son uno de los tipos de arquitectura de aplicaciones web que los desarrolladores utilizan para implementar los lados cliente y servidor del producto. Ellos soporte para sitios web que ofrecen una experiencia indistinguible de las aplicaciones nativas.
Se pueden instalar como aplicaciones móviles nativas, funcionar sin conexión, interactuar con la cámara del dispositivo o recibir notificaciones push. Además, las PWA ofrecen una distribución mucho mejor que las tiendas de aplicaciones y no se llevan ni una pizca de sus ingresos.
Cuando las aplicaciones web progresivas aparecieron por primera vez en 2015, estaban disponibles en Android. Posteriormente, en 2018 fueron accedidos por usuarios de iOS.
Alex Russell, desarrollador de software de Google, quien introdujo el término PWA, dice: Las PWA son simplemente sitios web que toman todas las vitaminas adecuadas.
Las aplicaciones web progresivas están escritas para ejecutarse en diferentes navegadores, por lo que los programadores usan HTML, CSS y JavaScript para crear PWA. Si los usuarios abren PWA en un navegador de escritorio, se verá como un sitio web tradicional. Pero en el navegador móvil, experimentarán funciones de aplicaciones nativas.
¿Cómo funcionan las PWA?
Cuando los usuarios están en un sitio web de PWA, encuentran una ventana emergente que solicita instalar la aplicación en su teléfono inteligente. Después de que el usuario instala la PWA, el ícono de la aplicación aparece en la pantalla de inicio. Cuando un usuario abre una aplicación web progresiva, el navegador abrirá una nueva ventana en lugar de una nueva pestaña.
Una vez instalada, las PWA crean un caché del sitio web. Esto contribuye a una mayor velocidad y disponibilidad fuera de línea.
Al usar PWA en Android, los usuarios pueden experimentar casi todas las funciones nativas de la aplicación, incluidos pagos, NFC, autenticación de huellas dactilares, reconocimiento de voz y más.
Sin embargo, se requieren API adicionales para que las funciones del dispositivo estén disponibles en PWA (por ejemplo, API NFC, API Bluetooth, API de geolocalización, etc.). Además, si decide colocar la PWA en Google Play, necesitará PWAConstructor.
Sin embargo, la situación difiere ligeramente para los usuarios de iOS. Apple se centra más en el desarrollo de aplicaciones nativas que en aplicaciones progresivas. Esto no significa que las PWA no se ejecuten en iOS; sólo hay algunas limitaciones. Por ejemplo, Safari (el navegador de Apple) no admite las notificaciones automáticas de PWA.
Beneficios principales de las PWA:
- Se pueden agregar a la pantalla de inicio sin mercados de aplicaciones.
- Rápido, trabaja en modo fuera de línea, admite notificaciones automáticas.
- Disponibilidad de sincronización en segundo plano cuando el usuario interactúa con la aplicación.
- No utilizan URL para proporcionar una experiencia de pantalla completa.
- Servido vía HTTPS para garantizar la seguridad de los datos privados.
Cómo las empresas pueden beneficiarse de las PWA
Uno de los principales beneficios de las PWA es su precio. Entonces, incluso si ya tiene un sitio web, dedicará menos tiempo y dinero a convertirlo en una aplicación web progresiva.
Analicemos las otras ventajas de las PWA:
- Se puede instalar sin Google Play o App Store. No es necesario publicar las aplicaciones web progresivas en los mercados de aplicaciones. Por lo tanto, no necesita esperar su aprobación para promocionar su producto entre los clientes o lanzar una nueva versión. Además, no es necesario pagar una tarifa del 30% a los mercados.
- Rápido de desarrollar. No es necesario crear aplicaciones para diferentes plataformas ni ajustar el código nativo (si desea crear una aplicación basada en Flutter). Las PWA funcionan en iOS y Android, interactúan con varios dispositivos y muchas funciones de las aplicaciones móviles nativas se pueden implementar en Android.
- Notificaciones push. Por ejemplo, al utilizar Google Duo PWA, una aplicación de videollamadas, los usuarios pueden recibir un mensaje para aprobar la llamada cuando sus amigos los llaman a través de Duo. Las notificaciones push funcionan para Windows, macOS (excepto Safari), Linux y ChromeOS.
- Más fácil de publicar actualizaciones. Los usuarios no necesitan actualizar la aplicación cada vez que se lanza una nueva versión. Siempre hay soluciones actualizadas disponibles. Las PWA permiten a las empresas lidiar con la fragmentación del software cuando algunos usuarios usan la versión anterior del producto mientras que otros usan la nueva. Anteriormente, los ingenieros de software tenían que mantener la versión anterior de las aplicaciones para evitar perder una gran cantidad de clientes hasta que lanzaran la actualización.
Empresas como Starbucks, Uber, Tinder, Forbes, Pinterest ya tenía ganado de la implementación de PWA. Por ejemplo, Starbucks duplicó el número de usuarios activos diarios. Los pedidos en computadoras de escritorio son casi los mismos que en aplicaciones móviles. Pinterest ha observado un aumento del 40% en el tiempo dedicado a la página web. Tinder reduce el tiempo de carga de 11 a 4,69 segundos.
Herramientas necesarias para crear una aplicación web progresiva
Las aplicaciones web progresivas no requieren marcos particulares ni ninguna otra herramienta de desarrollo. PWA es una tecnología que se puede implementar después de completar algunos requisitos del proyecto.
Para convertir un sitio web tradicional en una aplicación web progresiva, deberá agregar un archivo manifest.json y un trabajador de servicio.
Trabajador del servicio
El Trabajador del servicio es una técnica de PWA que se utiliza para el almacenamiento en caché de recursos y notificaciones automáticas. Es un mediador programable entre su aplicación web y el mundo real que le brinda control sobre las consultas de la red.
Por ejemplo, puede administrar el comportamiento de almacenamiento en caché de las consultas, manejar notificaciones automáticas, habilitar el modo fuera de línea y la sincronización en segundo plano.
mensajes push
Dado que los archivos de los trabajadores del servicio se ejecutan por separado del navegador principal, no dependen de la aplicación conectada. Es por eso que los usuarios pueden recibir notificaciones de un servidor cuando la aplicación web está fuera de línea.
Modo offline
El trabajador del servidor posee los recursos de la aplicación, lo que permite recuperar datos cuando los usuarios están desconectados. El servidor actualiza el contenido dinámico (imágenes, videos, historial de pagos, etc.) cuando se renueva la conexión a Internet. Las acciones de los usuarios en la página se retrasan hasta que la conexión sea estable.
Digamos que un usuario quiere enviar un mensaje a través de PWA Messenger. El sitio web todavía está funcionando; se puede acceder a un historial de mensajes. Pero necesitan Wi-Fi para completar la acción: enviar y recibir un mensaje.
Sincronizaciones en segundo plano
Cuando los usuarios cuentan con un sitio web y conectividad a Internet, pueden realizar diferentes acciones como enviar mensajes o realizar una transacción. Lo cual ya sabes.
El problema es cuando los usuarios no tienen conexión a Internet. En este caso, todavía tiene acceso a la aplicación, pero no puede seguir trabajando con ella. El trabajador del servicio almacena la información mientras los clientes están desconectados.
Aquí se muestra una imagen de cómo las aplicaciones web progresivas interactúan con los trabajadores del servidor.
Archivo de manifiesto
Manifiesto implica un archivo JSON que determina los parámetros de la PWA principal.
Con el manifiesto, los ingenieros de software pueden controlar lo siguiente:
- Cómo se lanzan las aplicaciones web progresivas
- La forma en que se muestra la aplicación a los usuarios (diseño de la aplicación)
- ¿Se puede agregar la aplicación a la pantalla de inicio del móvil?
La siguiente imagen muestra lo que las PWA pueden hacer con el archivo de manifiesto.
Resumiendo
Como puede ver, las aplicaciones web progresivas aportan importantes ventajas a todas las empresas basadas en servicios debido a su usabilidad y costo. Son fáciles de diseñar y, por tanto, económicos. Aunque estas soluciones de software tienen algunas restricciones de funciones, especialmente para los usuarios de iOS, siguen siendo una buena opción para empezar o ampliar su sitio web actual.
