Una aplicación web progresiva (PWA) es un sitio web construido con tecnologías web estándar que se comporta como una app de plataforma: se puede instalar, se abre en su propia ventana con un icono y puede funcionar sin conexión. MDN la define como «una aplicación construida con tecnologías de la plataforma web, pero que ofrece una experiencia de usuario como la de una app de plataforma» (MDN, diciembre de 2025). Dos archivos hacen casi todo el trabajo: un manifiesto de aplicación web, que describe la app, y, para el uso sin conexión, un service worker.
Qué es una aplicación web progresiva
Una PWA es una aplicación web que conserva las propiedades de un sitio web y añade algunas de una app nativa. Según MDN, de los sitios web conserva una sola base de código para todos los sistemas operativos y el acceso directo desde la web. De las apps de plataforma toma la instalación (desde una tienda de apps o directamente desde la web), el lanzamiento como app independiente con icono, el funcionamiento sin conexión y en segundo plano, el uso a pantalla completa sin la interfaz del navegador y la integración con el sistema operativo, como los destinos para compartir.
Una PWA es un sitio normal más dos características técnicas:
- el manifiesto de aplicación web, un archivo JSON que el navegador lee para conocer el nombre de la app, sus iconos y la forma de abrirla;
- un service worker, un script que controla las páginas de la app y, en palabras de MDN, puede obtener recursos del servidor y añadirlos a una caché local.
Web.dev describe la misma idea: una PWA usa la mejora progresiva para ofrecer una experiencia más fiable y más integrada, y se puede instalar (web.dev, septiembre de 2024).
Qué hace que una PWA sea instalable
Es el navegador quien decide si una app es instalable, y los criterios cambian de un navegador a otro. Para los navegadores basados en Chromium (Chrome, Samsung Internet, Edge), MDN enumera estos requisitos (MDN, Making PWAs installable, octubre de 2026):
| Requisito | Detalle |
|---|---|
| HTTPS | Se sirve por https, o desde localhost o 127.0.0.1 durante el desarrollo |
name o short_name en el manifiesto |
Al menos uno |
icons en el manifiesto |
Debe incluir un icono de 192 px y otro de 512 px |
start_url en el manifiesto |
Obligatorio |
display o display_override en el manifiesto |
Obligatorio; Chrome acepta fullscreen, standalone, minimal-ui o window-controls-overlay |
prefer_related_applications |
Debe ser false o no estar presente |
Chrome también espera a que haya interacción antes de disparar el evento beforeinstallprompt: el usuario debe haber hecho clic o tocado la página al menos una vez y haberla visto durante al menos 30 segundos (web.dev, septiembre de 2024).
El service worker no está en la lista. MDN dice que no es un requisito para ser instalable, aunque muchas PWA lo usan para el uso sin conexión. Un manifiesto mínimo que cumple la tabla tiene este aspecto:
{
"name": "My PWA",
"short_name": "MyPWA",
"start_url": "/",
"display": "standalone",
"icons": [
{ "src": "/icons/192.png", "type": "image/png", "sizes": "192x192" },
{ "src": "/icons/512.png", "type": "image/png", "sizes": "512x512" }
]
}Enlázalo desde cada página con <link rel="manifest" href="/manifest.webmanifest">.
Cómo funciona una PWA sin conexión
Un service worker hace posible el uso sin conexión al interceptar las peticiones de red y responder desde una caché. Regístralo desde tu página y luego gestiona el evento fetch en el worker. Este es el patrón «caché primero» de MDN, abreviado:
// en la página
if ('serviceWorker' in navigator) {
navigator.serviceWorker.register('/service-worker.js');
}// service-worker.js
self.addEventListener('fetch', (event) => {
event.respondWith(
caches.match(event.request).then((cached) => cached || fetch(event.request))
);
});Ese esquema sirve desde la caché y, si no hay nada, recurre a la red, pero nunca llena la caché; el ejemplo completo de MDN añade el paso de escritura y una página de respaldo. MDN también señala que «caché primero» es más propenso a devolver una respuesta obsoleta, mientras que «red primero» recurre a la caché cuando el dispositivo está sin conexión, y que la mejor estrategia depende de la app. Los service workers tienen un soporte Baseline muy extendido (desde octubre de 2020, con Chrome 45, Firefox 44 y Safari 11.1 como primeras versiones, según web-features 3.44.0).
En qué se diferencian iOS y Android
Android e iOS instalan PWA, pero se diferencian en el cómo y en algunas funciones. A octubre de 2026, según MDN, Apple y web-features:
| Plataforma y navegador | Comportamiento de instalación |
|---|---|
| Chrome en Android | Se instala como WebAPK en dispositivos con Google Mobile Services; sin ellos, añade un acceso directo con el distintivo del navegador |
| Samsung Internet | Instala las PWA como WebAPK, con una entrada en el lanzador de apps y en el selector de apps |
| Firefox en escritorio | No instala PWA desde un manifiesto |
| Safari en iOS | Desde el menú Compartir; desde iOS 16.4 también desde Chrome, Edge, Firefox y Orion |
| Safari en macOS | Añadir al Dock (macOS Sonoma, Safari 17) para cualquier sitio, con o sin manifiesto |
Tres detalles de iOS son importantes para los desarrolladores:
beforeinstallpromptno está disponible en iOS, según MDN, así que no puedes mostrar tu propio botón de instalación. Explica en la interfaz los pasos del menú Compartir; web.dev señala que los diseñadores suelen añadir este tipo de pantallas.- Desde iOS 26, «todos los sitios web añadidos a la pantalla de inicio se abren como una aplicación web» por defecto, y el usuario puede desactivar «Abrir como aplicación web» aunque el sitio tenga un manifiesto (blog de WebKit, 9 de junio de 2025).
- Las notificaciones push web en iOS y iPadOS están disponibles para las aplicaciones web de la pantalla de inicio desde iOS 16.4. Un sitio cuenta como aplicación web de la pantalla de inicio cuando su manifiesto define
displaycomostandaloneofullscreen, y la solicitud de permiso debe venir de un gesto del usuario (blog de WebKit, 16 de febrero de 2023). Web-features incluye Push como Baseline recientemente disponible desde marzo de 2023 y ampliamente disponible desde septiembre de 2025, con Safari 16 y Safari en iOS 16.4 como primeras versiones.
Los detalles de «Añadir a la pantalla de inicio» cambian con cada versión de iOS, así que revisa la versión que das soporte.
Ejemplos de PWA
La guía de PWA de web.dev recoge empresas que informan de resultados tras lanzar una PWA; las cifras son de las propias empresas, recopiladas por web.dev (septiembre de 2024, web.dev):
| Empresa | Resultado informado |
|---|---|
| Hulu | El 96% de los usuarios de la app anterior adoptó la PWA en cinco meses |
| JD.ID | Tasa de conversión móvil un 53% más alta |
| Clipchamp | Retención de usuarios un 9% más alta que la de los usuarios de la app de escritorio |
| Gravit Designer | Los usuarios de la PWA son un 24% más activos |
Son resultados que esas empresas comunican para sus propios productos.
PWA o app nativa
Una regla práctica: elige una PWA cuando importen más una sola base de código web y la distribución desde la web; elige una app nativa cuando necesites funciones de la plataforma que la web no ofrece. MDN señala que la distribución a través de tiendas de apps también es posible para una PWA, así que las dos opciones no se excluyen. Si publicas una app nativa junto a tu sitio, los enlaces pueden abrirla directamente; la configuración está en enlaces universales y App Links de Android.
Cómo probar una PWA en el móvil
Prueba una PWA en tres pasadas: DevTools para los archivos, un móvil real para la instalación y una vista de tamaño móvil para el diseño.
- DevTools: en el panel Application de Chrome DevTools, el apartado Manifest muestra los campos e iconos de la app, y una sección Installability describe el error si algo falla. El apartado Service Workers tiene una casilla Offline que pone DevTools en modo sin conexión (Chrome for Developers). Las pruebas de PWA de Lighthouse están obsoletas (página actualizada en abril de 2024), así que usa el panel Application.
- Un móvil real: instala la app desde el navegador, pon el teléfono en modo avión y ábrela desde el icono. Hazlo en iOS y en Android, porque el flujo de instalación y el comportamiento de las notificaciones son distintos.
- Tamaños de móvil: revisa las páginas con anchos de móvil como en cualquier sitio móvil, con la guía para hacer un sitio web apto para móviles y la lista de comprobación para pruebas de sitios móviles; para iOS sin dispositivo, consulta probar en un iPhone sin tener un iPhone.
Mobile View Extension recarga la pestaña actual con el user agent, el tamaño de pantalla y la relación de píxeles de un teléfono, así que es una forma rápida de ver las páginas de tu PWA en tamaños de móvil. No puede instalar una PWA ni ejecutar service workers y el modo independiente como lo hace un teléfono: usa el motor de Chrome de escritorio, con entrada de ratón, y no muestra el comportamiento de la pantalla de inicio. Usa un móvil para las pruebas de instalación y de uso sin conexión. La velocidad se trata aparte en la guía de prueba de velocidad en móviles.
Preguntas frecuentes
¿Qué es una PWA en términos sencillos?
Una PWA es un sitio web que se puede instalar en un dispositivo y usar como una app. Está hecha con tecnologías web normales, y un manifiesto y un service worker aportan el comportamiento instalado y sin conexión.
¿Qué requisitos tiene una PWA?
Para instalarla en navegadores Chromium: HTTPS, un manifiesto con nombre, un icono de 192 px y otro de 512 px, start_url y display, y prefer_related_applications sin valor true. Un service worker no es obligatorio para ser instalable, pero lo necesitas para el uso sin conexión.
¿Funcionan las PWA en el iPhone?
Sí. Desde iOS 16.4 se pueden instalar desde el menú Compartir de Safari, Chrome, Edge, Firefox y Orion, y las aplicaciones web de la pantalla de inicio pueden recibir notificaciones push web. En iOS no existe beforeinstallprompt, así que los usuarios instalan la app desde el menú Compartir.
¿Puede una PWA funcionar sin conexión?
Sí, cuando un service worker guarda en caché las páginas y los archivos que necesita. Sin service worker, la app se puede instalar en navegadores Chromium, pero no tiene gestión propia del uso sin conexión.