PWA Manifest

Web App Manifest es un archivo JSON estandarizado por el W3C que define cómo un sitio web debe comportarse cuando se instala como aplicación en un dispositivo móvil o escritorio. Junto con Service Workers y las Web APIs modernas, forma la tríada técnica de las Progressive Web Apps (PWA).

El archivo manifest.json se referencia en el HTML mediante una etiqueta <link rel="manifest" href="/manifest.json"> y define propiedades clave: nombre corto y largo de la app, iconos en múltiples tamaños (mínimo 192px y 512px para satisfacer los requisitos de instalabilidad), colores de tema y fondo, start_url (URL de inicio al abrir la app), y modo de pantalla (standalone, fullscreen, minimal-ui).

La implementación completa de una PWA requiere tres elementos simultáneos: (1) manifest.json técnicamente correcto, (2) Service Worker registrado que gestiona la caché e intercepta pediciones de red, y (3) servido desde HTTPS. Sin los tres, los navegadores no mostrarán el banner de "Instalar app".

Los casos de uso principales en ecommerce son cuatro: (1) Acceso directo desde el escritorio/teclado del móvil sin abrir navegador, reduciendo la fricción de recompra; (2) notificaciones push en Android/desktop para abandono de carrito o rebajas (competencia directa con apps nativas); (3) funcionamiento offline para catálogo o páginas cacheadas; (4) experiencia fullscreen sin barra de navegación.

El formato standalone es el más usado en ecommerce: la app se abre en una ventana independiente sin cromo del navegador, dando sensación de app nativa. El formato minimal-ui mantiene la barra de navegación mínima (botón atrás/adelante), útil para portales de contenido.

La limitación más importante es el soporte en iOS: Apple implementa PWA mínimamente en Safari; sin push notifications hasta iOS 16.4 (2023), sin acceso a la cámara/micrófono, y sin badges en el icono. Adicionalmente, iOS limita la caché de Service Worker a 50MB y puede eliminarla tras 7 días sin actividad.

¿Qué es PWA Manifest?

PWA Manifest (Web App Manifest) es un archivo JSON estándar del W3C que define cómo una Progressive Web App (PWA) se presenta al usuario cuando se instala en un dispositivo: nombre, iconos, colores, orientación, URL de inicio y modo de visualización. Las PWAs son aplicaciones web que combinan la accesibilidad del navegador con la experiencia de una app nativa: instalación en la pantalla de inicio, funcionamiento offline mediante Service Workers, push notifications y rendimiento optimizado. El concepto de PWA fue acuñado por Alex Russell y Frances Berriman de Google en 2015, y el Web App Manifest se estandarizó como especificación del W3C. Las PWAs son adoptadas por grandes ecommerce como Alibaba (conversión +76%), Flipkart (tiempo en site de 70s a 3.5 min), Starbucks y Pinterest, demostrando mejoras medibles en engagement y conversión móvil.

Origen y estándar web

Las PWAs surgieron como respuesta a las limitaciones de las apps nativas: altos costes de desarrollo, dependencia de app stores, instalación con fricción y actualizaciones manuales. Google promovió el concepto desde 2015 con Chrome y Android, seguido por Microsoft con Edge y Windows, y Apple con Safari en iOS (aunque con soporte más limitado). El Web App Manifest forma parte de un trío de tecnologías que definen una PWA: el Manifest (identidad y presentación), los Service Workers (cache, offline, push notifications) y HTTPS (seguridad obligatoria). La especificación W3C requiere como mínimo name o short_name, start_url, display (standalone, fullscreen o minimal-ui) e icons con versiones de 192px y 512px. Desde 2020, los principales navegadores (Chrome, Edge, Firefox, Safari) soportan la instalación de PWAs, aunque iOS tiene restricciones en push notifications que Apple relajó parcialmente en iOS 16.4.

Funcionalidades técnicas de PWA

El Service Worker actúa como proxy entre el navegador y la red, interceptando peticiones HTTP para servir contenido cacheado cuando no hay conexión. Las estrategias de caching incluyen cache-first (offline-first), network-first (datos siempre actualizados) y stale-while-revalidate (respuesta rápida con actualización en background). Las push notifications permiten enviar mensajes al usuario incluso con el navegador cerrado, útiles para abandonded cart reminders, actualizaciones de pedido y promociones. El background sync ejecuta tareas pendientes cuando se restaura la conexión: envío de formularios, sincronización de carrito y actualización de datos. El app shell pattern carga la estructura de la interfaz desde cache instantáneamente mientras los datos dinámicos se obtienen de la red, reduciendo el Time to Interactive.

PWA en ecommerce

Las PWAs ecommerce eliminan la fricción de instalación de apps nativas: el usuario añade la tienda a su pantalla de inicio desde el navegador con un tap, sin pasar por Google Play o App Store. El funcionamiento offline permite navegar el catálogo y el carrito sin conexión, sincronizando los datos cuando se restaura la red. Las push notifications de PWA ofrecen un canal de comunicación directo equivalente a las notificaciones de apps nativas. Alibaba reportó un aumento del 76% en conversiones tras implementar PWA. Flipkart triplicó el tiempo de permanencia en el site. Pinterest redujo el tiempo de carga de 23 a 5.6 segundos con PWA, aumentando el engagement un 60%. George.com (Asda) aumentó las conversiones un 31% con su PWA. Estas métricas demuestran el ROI medible de implementar PWA en ecommerce, especialmente en mercados con conexiones móviles lentas.

Implementación y herramientas

La implementación de PWA requiere tres componentes: el manifest.json vinculado en el HTML con una etiqueta link, un Service Worker registrado en JavaScript, y HTTPS obligatorio. Los frameworks modernos incluyen soporte nativo: Next.js con next-pwa, Nuxt.js con @nuxtjs/pwa, Angular con @angular/pwa, y React con create-react-app. Para WordPress, plugins como SuperPWA, PWA for WP y OneSignal generan el manifest y registran el Service Worker automáticamente. Shopify implementa PWA mediante apps como Ampify o Progressify. Los generadores de manifest como Web App Manifest Generator permiten crear el archivo JSON visualmente. Lighthouse de Google audita el cumplimiento de los criterios PWA con un score específico. Workbox (Google) proporciona bibliotecas de Service Worker con estrategias de caching predefinidas.

Modelo de precios

El Web App Manifest y las tecnologías PWA son estándares web abiertos completamente gratuitos: no hay licencia, suscripción ni coste de uso del estándar. Los costes asociados dependen de la implementación: desarrollo custom (2.000-50.000 USD según complejidad), plugins de WordPress (gratuitos como SuperPWA o premium desde 29-99 USD/año), apps de Shopify (10-50 USD/mes), o frameworks que incluyen soporte PWA sin coste adicional. Los servicios de push notifications pueden tener coste: OneSignal es gratuito hasta 10.000 suscriptores, Firebase Cloud Messaging es gratuito ilimitado, y servicios como PushOwl para Shopify cuestan desde 19 USD/mes. La inversión principal es el tiempo de desarrollo y testing, no las tecnologías en sí.

Características Principales

• Web App Manifest JSON: nombre, short_name, iconos (192px, 512px obligatorios)
• Modos de pantalla: standalone, fullscreen, minimal-ui, browser
• start_url configurable con parámetros UTM para tracking de instalaciones
• theme_color y background_color para splash screen de carga
• Service Worker API: caché offline, interceptación de red, background sync
• Push Notifications API (Android Chrome, Firefox, Edge; iOS 16.4+ Safari)
• Install prompt (beforeinstallprompt event) para banner personalizado
• Badging API: contador en icono de app instalada
• Share Target API: recibir contenido compartido desde otras apps
• Protocol Handlers: registrar la PWA como manejador de URLs personalizadas
• Verificable con Lighthouse PWA audit y Chrome DevTools Application panel

Se integra con 14 herramientas