Service Worker

¿Qué es Service Worker?

Service Worker es una API web estándar que permite a los desarrolladores registrar scripts JavaScript que actúan como proxy entre el navegador, la red e Internet. Intercepta peticiones de red, gestiona cachés programáticas y habilita funcionalidades offline, push notifications y sincronización en segundo plano. Es la tecnología fundamental que hace posible las Progressive Web Apps (PWAs).

El concepto fue formalizado por el W3C en 2014 y el término "Progressive Web Apps" fue acuñado en 2015 por Frances Berriman y Alex Russell (Google Chrome). Chrome fue el primer navegador en implementar soporte completo en 2015, seguido de Firefox en 2016 y Safari/Edge en 2018. Según HTTP Archive (2025), el 18,9% de los sitios web implementan Service Workers, un incremento de 10x respecto a 2022. La API es gratuita, open source y forma parte del estándar web — no requiere licencia ni suscripción.

Características principales

• Intercepción de peticiones: actúa como proxy programable entre el navegador y la red, permitiendo modificar requests y responses en tiempo real
• Cache API: control granular sobre qué recursos cachear, cuándo actualizarlos y cuándo eliminarlos — superior al obsoleto AppCache
• Funcionamiento offline: sirve contenido cacheado cuando no hay conexión, fundamental para PWAs en zonas con red inestable
• Push Notifications: recibe notificaciones del servidor incluso cuando la pestaña está cerrada, usando la Push API
• Background Sync: sincroniza datos pendientes cuando se recupera la conexión, evitando pérdida de formularios o acciones
• Ciclo de vida controlado: tres fases (download, install, activate) que permiten versionado y actualización sin interrumpir al usuario
• Ejecución en hilo separado: corre fuera del hilo principal del DOM, sin bloquear la interfaz de usuario
• Estrategias de caching: cache-first, network-first, stale-while-revalidate y cache-only para distintos tipos de recursos
• Precaching: precarga de recursos críticos durante la instalación para disponibilidad inmediata offline

Puntos a favor

• Gratuito y estándar web: no requiere licencia, suscripción ni dependencia de terceros — forma parte de la especificación W3C
• Soporte universal en 2026: Chrome, Firefox, Safari, Edge y todos los navegadores móviles modernos implementan la API completa
• Reduce tiempos de carga hasta un 80% para visitantes recurrentes sirviendo recursos desde caché local en lugar de red
• Habilita PWAs instalables que funcionan offline, con push notifications y acceso desde la pantalla de inicio del dispositivo
• Workbox (Google) simplifica la implementación: usado por el 54% de sitios móviles con Service Worker según HTTP Archive
• Mejora Core Web Vitals (LCP, FID) al servir recursos cacheados instantáneamente, impactando positivamente el SEO

Puntos en contra

• Requiere HTTPS obligatorio en producción — sitios sin certificado SSL no pueden registrar Service Workers
• Sin acceso al DOM: corre en hilo separado, lo que obliga a comunicación asíncrona vía postMessage con la página
• Debugging complejo: los errores en el ciclo de vida (install, activate, fetch) son difíciles de diagnosticar sin herramientas DevTools
• Caché desactualizada puede servir contenido obsoleto si las estrategias de invalidación no están bien implementadas
• Safari tiene limitaciones históricas: borrado automático de caché tras 7 días sin uso del sitio en versiones anteriores a iOS 16.4
• No sustituye a un CDN para contenido dinámico — la caché es local al dispositivo y no reduce latencia del servidor

Precios

Gratuito — Estándar web abierto

• API nativa del navegador sin coste de licencia
• Especificación W3C de libre implementación
• Sin límites de uso, eventos o usuarios

Workbox (Google) — $0

• Librería open source (MIT License) para simplificar Service Workers
• Precaching, runtime caching y estrategias predefinidas
• Integrado en Create React App, Angular CLI y Vue CLI

PWA Builder (Microsoft) — $0

• Herramienta gratuita para generar Service Workers y manifests
• Templates preconfigurados para distintos casos de uso
• Validador de PWA y generador de paquetes para app stores

Integraciones

Chrome DevTools, Firefox DevTools, Safari Web Inspector, Workbox, Angular CLI, Create React App, Vue CLI, Next.js, Nuxt.js, Gatsby, PWA Builder, Lighthouse, Webpack, Vite, Rollup, Firebase Cloud Messaging, OneSignal, Web Push Protocol, Cache Storage API, IndexedDB.

Alternativas a Service Worker

• Workbox: no es alternativa sino abstracción: simplifica la escritura de Service Workers con estrategias de caching predefinidas y precaching automático
• AppCache (obsoleto): API anterior de caching offline, deprecada por todos los navegadores en favor de Service Workers por su inflexibilidad
• Web Workers: ejecutan JavaScript en segundo plano pero no interceptan peticiones de red ni gestionan caché como Service Workers
• SharedWorker: permite compartir un worker entre múltiples pestañas pero sin capacidades de proxy de red ni caching
• Capacitor/Cordova: frameworks para empaquetar web apps como nativas, ofrecen acceso offline vía APIs nativas en lugar de Service Worker

Veredicto

Service Worker es una tecnología fundamental para cualquier ecommerce que quiera ofrecer experiencia PWA con funcionamiento offline, push notifications y tiempos de carga optimizados. No tiene coste y es estándar web. Para implementaciones complejas, Workbox reduce la curva de aprendizaje significativamente. El principal requisito es HTTPS, que en 2026 debería ser universal. Imprescindible para mejorar Core Web Vitals y la experiencia móvil.

Características Principales

• Intercepción de peticiones de red como proxy programable entre navegador y servidor
• Cache API con control granular sobre almacenamiento, actualización y eliminación de recursos
• Funcionamiento offline sirviendo contenido cacheado sin conexión a Internet
• Push Notifications del servidor incluso con la pestaña cerrada vía Push API
• Background Sync para sincronizar datos pendientes al recuperar conexión
• Ciclo de vida controlado con fases download, install y activate para versionado
• Ejecución en hilo separado sin bloquear el DOM ni la interfaz de usuario
• Estrategias de caching: cache-first, network-first, stale-while-revalidate
• Precaching de recursos críticos durante la fase de instalación

Se integra con 20 herramientas