Algo notable sucedió camino a las tiendas de aplicaciones: el navegador aprendió silenciosamente a convertirse en un sistema operativo.

En 2025, una Progressive Web App puede instalarse, funcionar sin conexión, enviar notificaciones push (incluso en iOS), capturar enlaces y archivos, mostrar badges en su icono y aparecer en tu conmutador de tareas como cualquier otra app—mientras sigue desplegándose como una carpeta de archivos estáticos detrás de una CDN.

Esta es una guía de campo con opiniones sobre las PWAs ahora mismo—qué es real, qué todavía duele, y dónde tiene sentido reemplazar (o complementar) apps nativas y frameworks SPA pesados.

---

¿Qué es exactamente una PWA en 2025?

Una PWA es simplemente un sitio web con tres ingredientes adicionales:

  1. HTTPS (obligatorio para service workers).
  2. Un Web App Manifest (manifest.webmanifest) que describe nombre, iconos, URL de inicio y modo de ventana (ej. display: "standalone").
  3. Un Service Worker que te da caché offline, interceptación de peticiones, tareas en segundo plano e infraestructura de push.

Cuando estos están presentes y el runtime considera la app "instalable," el navegador ofrece una superficie de instalación y el OS la trata como una ventana de app.

En Windows, Microsoft abraza activamente las PWAs—chrome de ventana nativa, envío a tienda, widgets, acciones de app. En Android, puedes empaquetar una PWA como app de Play Store vía Trusted Web Activity (TWA). En iOS, las PWAs se instalan desde Safari y—después de las controversias DMA del año pasado—siguen siendo soportadas.

---

Dónde brillan las PWAs (y dónde no)

Fortalezas con las que puedes contar

  • Instalabilidad sin guardianes. Los usuarios pueden añadir a pantalla de inicio/escritorio instantáneamente.
  • UX offline-first con tiempos de carga instantáneos. Los service workers habilitan estrategias cache-then-network.
  • Push en todas las plataformas principales. iOS añadió Web Push para web apps instaladas en iOS 16.4.
  • La integración con el OS sigue creciendo. Badges de app, atajos, widgets, captura de enlaces.
  • Impacto empresarial probado. Twitter Lite, Starbucks, Uber mostraron ganancias de engagement.

Limitaciones que debes considerar en tu diseño

  • Brechas y políticas de Safari. Background Sync no está soportado en Safari; algunas APIs son solo Chromium.
  • El almacenamiento está gestionado por cuota y puede ser eliminado. Trata el almacenamiento del navegador como caché.
  • Sin listado en App Store de iOS como PWA. Windows y Play Store son más amigables.
  • Fatiga de push y notificaciones. Chrome ahora deshabilita automáticamente las notificaciones ignoradas.

---

El patrón PWA + HTMX

Esa combinación resulta elegante:

  • HTMX maneja la interactividad intercambiando fragmentos renderizados en servidor.
  • El service worker intercepta esas solicitudes de fragmentos, sirviendo respuestas cacheadas instantáneamente cuando está offline.
  • Resultado: mantienes la simplicidad, SEO y accesibilidad del HTML renderizado en servidor, pero con velocidad y resiliencia similares a una app.

---

Arquitectura que puedes enviar este trimestre

Piensa en capas:

  1. Contrato de origen: URLs predecibles para documentos y fragmentos.
  2. Política de caché: pre-almacenar el shell de la app; cachear en tiempo de ejecución HTML, JSON y media.
  3. Revalidación: ETag/Last-Modified y SWR para mantener el contenido fresco.
  4. Resiliencia: escrituras idempotentes, colas de sincronización.
  5. Capacidades progresivas: push, insignias, gestores de archivos y URLs.

Manifest mínimo

{
  "name": "Acme Reader",
  "short_name": "Acme",
  "start_url": "/?source=pwa",
  "display": "standalone",
  "background_color": "#0b0b0c",
  "theme_color": "#0b0b0c",
  "icons": [
    {"src": "/icons/icon-192.png", "sizes": "192x192", "type": "image/png"},
    {"src": "/icons/icon-512.png", "sizes": "512x512", "type": "image/png"}
  ]
}

Service Worker: Workbox en tres rutas

// sw.js
import {precacheAndRoute} from 'workbox-precaching';
import {registerRoute} from 'workbox-routing';
import {StaleWhileRevalidate, NetworkFirst, CacheFirst} from 'workbox-strategies';


precacheAndRoute(self.__WB_MANIFEST || []);



// 1) Documentos HTML: primer paint rápido, luego actualizar silenciosamente.
registerRoute(
  ({request}) => request.destination === 'document',
  new NetworkFirst({ cacheName: 'html', networkTimeoutSeconds: 3 })
);



// 2) Fragmentos HTMX/JSON: stale-while-revalidate mantiene la UI ágil.
registerRoute(
  ({request, url}) =>
    request.destination === '' &&
    (url.pathname.startsWith('/fragment/') || url.pathname.endsWith('.json')),
  new StaleWhileRevalidate({ cacheName: 'data' })
);



// 3) Assets estáticos: cache-first.
registerRoute(
  ({request}) => ['style','script','font','image'].includes(request.destination),
  new CacheFirst({ cacheName: 'assets' })
);

---

Dónde desplegar PWAs

  • La web abierta (siempre).
  • Microsoft Store: empaquetado con un clic vía PWABuilder.
  • Google Play: empaquetar con TWA (Bubblewrap CLI).

---

Barra de calidad: Qué aspecto tiene lo "bueno"

  • Instalable: Manifest + SW válidos; iconos reales; display: standalone.
  • Vitals: LCP, INP, CLS en verde.
  • Resiliencia: UX offline para recorridos principales.
  • Higiene de recursos: URLs versionadas para assets; limpieza de caché SW en activación.

---

Consejos prácticos de "no hacer" que ahorran meses

  • No pre-cachees el mundo. Pre-cachea el shell y rutas críticas; deja que el caché de runtime aprenda el resto.
  • No confíes en el almacenamiento del navegador para estado canónico. Trátalo como caché.
  • No abuses de las notificaciones push. Chrome literalmente deshabilita las notificaciones ignoradas ahora.
  • No asumas que las tareas en segundo plano existen. Los usuarios de Safari también son personas.

---

Cuándo elegir una PWA sobre nativo o SPA pesado

Elige PWA para:
  • Apps centradas en contenido (noticias, documentos, referencia, aprendizaje) donde offline y navegación rápida importan más que APIs profundas del dispositivo.
  • Apps transaccionales con periféricos simples (formularios, checkout, programación).
  • Herramientas de campo e internas donde dominan Windows y Android.
Quizás no:
  • Apps muy dependientes de sensores, Bluetooth de baja latencia o geofencing en segundo plano.

---

Verificación de realidad 2025

  • Las PWAs son de primera clase en Windows y Android (empaquetado para tienda, superficies del OS).
  • En iOS son usables y útiles, con push e instalación—pero aún limitadas por las políticas de background y APIs de WebKit.
  • La superficie de capacidades sigue creciendo (insignias, gestores de archivos y URLs, widgets).

Y sí, todo esto combina hermosamente con una mentalidad HTMX: mientras menos framework envíes, más pueden ayudarte la red y el navegador.

---

Cierre

En 2025, una PWA es una aplicación cuyo código fuente puedes ver. Es instalable, resiliente y respetuosa con el dispositivo y la atención del usuario. Funciona bien con HTML renderizado en servidor (HTMX), y hereda distribución global y SEO de la web abierta.

El navegador se convirtió en tu runtime multiplataforma. No tuviste que pedir permiso.

Ahora la tarea es diseñar como si esa libertad importara.