Qué es una PWA

Una PWA es, en esencia, una aplicación web construida con HTML, CSS y JavaScript que incorpora tres tecnologías clave: Service Workers, Web App Manifest y HTTPS obligatorio. Estas tecnologías permiten que la aplicación se comporte como una app nativa sin necesidad de compilación ni distribución a través de tiendas.

El Service Worker actúa como un proxy entre la aplicación y la red. Intercepta peticiones, gestiona la caché y permite que la app funcione sin conexión. El Web App Manifest es un archivo JSON que define el nombre, icono, colores y modo de visualización cuando el usuario instala la PWA en su dispositivo.

Una de las características más distintivas de las PWAs es la instalabilidad. Cuando un usuario visita una PWA que cumple ciertos criterios (HTTPS, Service Worker registrado, Manifest válido), el navegador puede ofrecer automáticamente un prompt de instalación. Al instalarse, la PWA aparece como un icono en la pantalla de inicio y se ejecuta en su propia ventana, sin la barra de direcciones del navegador.

Esta experiencia es prácticamente indistinguible de una app nativa para el usuario promedio. La PWA se lanza a pantalla completa, tiene splash screen propio, aparece en el listado de apps del dispositivo y puede recibir notificaciones push (con soporte completo en Android y parcial en iOS desde la versión 16.4).

El soporte offline es lo que transforma una web en una PWA real. Mediante estrategias de caché como Cache First, Network First o Stale While Revalidate, el Service Worker decide cuándo servir recursos desde la caché local y cuándo intentar obtenerlos de la red.

Para aplicaciones de contenido (catálogos, noticias, documentación), la estrategia habitual es cachear el contenido estático en la instalación y actualizar los datos dinámicos cuando hay conexión. Herramientas como Workbox (de Google) simplifican enormemente la implementación de estas estrategias.

Las PWAs eliminan la mayor barrera de entrada de las apps nativas: la instalación desde una tienda. Los usuarios acceden directamente desde una URL y pueden instalar la app con un solo toque. Esto reduce drásticamente la fricción y aumenta la tasa de adopción.

Además, las actualizaciones son instantáneas (sin esperar revisiones de la tienda), el peso es mucho menor que una app nativa (Starbucks: 233 KB la PWA vs 148 MB la app nativa), y la indexación en buscadores es posible porque el contenido sigue siendo web.

Las PWAs no son la solución perfecta para todos los casos. En iOS, Apple ha sido históricamente restrictiva con las capacidades de las PWAs: las notificaciones push solo están disponibles desde iOS 16.4, no hay acceso a Bluetooth ni NFC, y los Service Workers se eliminan tras dos semanas de inactividad.

Tampoco son ideales para apps que requieren alto rendimiento gráfico (juegos 3D), acceso profundo al hardware (salud, IoT industrial) o integraciones complejas con el sistema operativo. Además, al no estar en las tiendas, pierden el canal de descubrimiento orgánico que ofrecen App Store y Google Play.

Las PWAs son especialmente adecuadas para proyectos donde el canal web es el principal punto de contacto con el usuario y se necesita añadir capacidades móviles sin el coste de una app nativa. E-commerce, medios de comunicación, SaaS, catálogos de producto y herramientas internas son los casos de uso más habituales.

Si tu producto ya tiene una web funcional, convertirla en PWA puede ser un paso natural con inversión relativamente baja. Si necesitas presencia en tiendas, acceso completo a APIs nativas o rendimiento intensivo en GPU, un enfoque híbrido o nativo será más adecuado.

El ecosistema para desarrollar PWAs está maduro. Frameworks como Next.js, Nuxt y Angular incluyen soporte para PWA mediante plugins o configuraciones integradas. Workbox, mantenido por Google, es el estándar de facto para gestionar Service Workers y estrategias de caché.

Para testing, Lighthouse (integrado en Chrome DevTools) audita automáticamente la conformidad de tu PWA. PWABuilder de Microsoft permite empaquetar PWAs para la Microsoft Store y Google Play. Herramientas como Capacitor permiten añadir APIs nativas a una PWA cuando sea necesario.