Definición:
Una aplicación web progresiva, o PWA por las siglas de Progressive Web App, es una aplicación creada con tecnologías web que puede incorporar capacidades asociadas a las aplicaciones instaladas. Se ejecuta a través de un navegador, se distribuye mediante una URL y puede ofrecer instalación, funcionamiento sin conexión, notificaciones u otras integraciones cuando el navegador y el sistema operativo las admiten.
Una PWA no es un formato propiedad de Google ni una categoría definida por una sola tecnología. El término fue difundido en 2015 para describir aplicaciones web que adoptan mejoras progresivas: la experiencia básica debe seguir funcionando y las capacidades adicionales se activan según el entorno disponible.
Tampoco es simplemente una web con diseño móvil. Combina una aplicación web funcional con metadatos, recursos y mecanismos del navegador que permiten presentarla y ejecutarla de forma más integrada en el dispositivo.
Índice de contenidos
Componentes de una PWA
La composición exacta depende de la aplicación y de los criterios del navegador. Estos seis elementos son habituales en una PWA:
- Aplicación web: HTML, CSS, JavaScript y servicios de servidor proporcionan la interfaz y la lógica accesibles desde una URL.
- Conexión segura: la aplicación se sirve mediante HTTPS, salvo excepciones locales de desarrollo, para proteger la comunicación y habilitar APIs sensibles.
- Manifiesto web: un archivo JSON declara datos como el nombre, los iconos, la URL de inicio, los colores y el modo de visualización utilizado al instalarla.
- Service worker: un proceso independiente de la página puede interceptar solicitudes, administrar cachés y habilitar tareas como la disponibilidad sin conexión. Es frecuente, aunque no constituye por sí solo una PWA ni es un requisito idéntico en todos los navegadores.
- Diseño adaptable: la interfaz suele utilizar diseño responsive para ajustarse a distintos tamaños y formas de interacción.
- Mejora progresiva: las funciones no compatibles deben degradarse de manera controlada para conservar el acceso a la funcionalidad esencial.
El manifiesto no convierte automáticamente cualquier sitio en una PWA completa. Los navegadores aplican criterios propios para mostrar una opción de instalación y pueden cambiar la forma de evaluar esos criterios. La documentación de PWA de MDN reúne los estándares y guías principales del entorno web.
Cómo funciona una aplicación web progresiva
La primera visita se realiza como en cualquier sitio o app web. El navegador descarga los recursos necesarios y, si existe un service worker, puede registrarlo para controlar solicitudes posteriores dentro de su alcance. La estrategia definida por la aplicación decide qué recursos consulta en la red, cuáles conserva en caché y qué respuesta ofrece cuando la conexión falla.
Las capacidades más características se pueden agrupar en estas seis funciones:
- Acceso mediante URL: puede abrirse desde un enlace sin pasar previamente por una tienda de aplicaciones.
- Instalación: en entornos compatibles puede añadirse a la pantalla de inicio, al menú de aplicaciones u otra superficie del sistema.
- Ejecución independiente: el manifiesto puede solicitar una ventana sin la interfaz habitual del navegador, aunque sigue utilizando el motor web del dispositivo.
- Caché y desconexión: un service worker puede proporcionar recursos guardados o una experiencia alternativa, pero el alcance sin conexión depende de lo que se haya programado.
- Integración con el dispositivo: algunas PWA pueden utilizar cámara, ubicación, archivos, compartir contenido u otras APIs con permisos y compatibilidad variables.
- Reactivación: funciones como una notificación push o una tarea en segundo plano dependen de la plataforma, del consentimiento y de las restricciones del sistema.
La actualización combina recursos servidos desde la web con el ciclo de vida del service worker y de sus cachés. Por ello, una nueva versión puede no sustituir inmediatamente todos los archivos abiertos por una instancia anterior. La aplicación debe gestionar versiones, activación y datos almacenados para evitar mezclas incoherentes.
PWA, sitio web y aplicación nativa
Las tres categorías pueden compartir interfaz, servicios y objetivos, pero no son equivalentes. Estas cinco diferencias ayudan a delimitarlas:
- Distribución: un sitio y una PWA se publican en la web; una PWA puede además instalarse, mientras que una aplicación nativa suele distribuirse como paquete para una plataforma concreta.
- Ejecución: una PWA utiliza tecnologías y motores web; una aplicación nativa emplea APIs y componentes propios del sistema, aunque también existen soluciones híbridas.
- Capacidades: el acceso de una PWA al dispositivo depende del navegador y del sistema operativo; una aplicación nativa suele disponer de una integración más amplia, sujeta igualmente a permisos.
- Actualización: el contenido web puede renovarse desde el servidor, mientras que partes de una PWA pueden quedar temporalmente en caché; una aplicación nativa sigue el mecanismo de actualización de su distribución.
- Descubrimiento: una PWA conserva URLs que pueden enlazarse y rastrearse. La instalación o la presencia en una tienda no sustituyen la accesibilidad ni la indexabilidad de esas URLs.
Una misma organización puede ofrecer un sitio, una PWA y aplicaciones nativas conectadas a los mismos servicios. La elección depende de las funciones necesarias, los entornos que se deben cubrir, la distribución, el mantenimiento y las limitaciones aceptables.
Ventajas y limitaciones de las PWA
El uso de una base web puede facilitar el acceso desde varios sistemas y evitar que la primera interacción exija una instalación. También permite compartir enlaces y desplegar parte de las actualizaciones desde el servidor. Estas posibilidades no garantizan menor coste, mayor velocidad ni una experiencia equivalente en todos los dispositivos.
La evaluación debe considerar al menos estas cinco limitaciones:
- Compatibilidad: instalación, notificaciones, tareas en segundo plano y APIs del dispositivo varían entre navegadores y sistemas.
- Conectividad: una PWA solo funciona sin conexión para los recursos y operaciones preparados expresamente; los datos remotos pueden seguir siendo necesarios.
- Almacenamiento y caché: las cuotas, la eliminación automática de datos y una estrategia incorrecta pueden producir contenido antiguo o fallos.
- Permisos y privacidad: las funciones sensibles requieren una finalidad clara, consentimiento cuando corresponda y tratamiento adecuado de los datos.
- Medición y calidad: la instalación, el uso recurrente, los errores y el rendimiento necesitan métricas separadas y pruebas en dispositivos reales.
Una PWA puede rastrearse como contenido web si sus páginas son accesibles, renderizables y enlazables. Ser PWA no mejora automáticamente el SEO, del mismo modo que poder instalarse no demuestra uso, retención o satisfacción. Su valor depende de que las capacidades añadidas respondan a necesidades concretas y funcionen de forma fiable en los entornos previstos.
