Hecho con Chinaski

PWA

Chinaski puede presentar tu site construido como una Progressive Web App instalable. Activar PWA (desactivada por defecto, Settings → PWA) hace que el builder estático genere tres artefactos extra por idioma: un web app manifest, un service worker y una página de fallback offline.

El manifest

manifest.json se genera por idioma a partir de tu configuración:

  • Nombre y nombre corto, el nombre del site, con el nombre corto tomándolo por defecto (truncado a unos 16 caracteres). Ambos configurables.
  • Description, tu tagline.
  • Start URL y scope, por idioma (el prefijo de idioma, o el subdominio por idioma en modo de URL por subdominios).
  • Display mode, standalone (por defecto), minimal-ui, fullscreen, o browser.
  • Colores de tema y fondo, usados para el chrome del navegador y la pantalla splash.
  • Icons, los íconos de instalación de 192 y 512 provienen de tu favicon subido (incluida una variante maskable). No tener favicon configurado significa no tener iconos en el manifest, configura uno a menos que no planees exponer una app instalable.

El service worker

Generado por idioma con el timestamp del build horneado como versión de cache, cada rebuild produce una cache nueva y retira las viejas automáticamente.

  • Precache en la instalación: la página de inicio, la página offline, el manifest, la raíz del blog, la página de búsqueda, cada URL de página y post en ese idioma, más las fuentes incluidas en el bundle, se obtienen una por una para que un archivo faltante no aborte la instalación.
  • Estrategia runtime: las navegaciones de página son network-first (contenido fresco cuando hay conexión, copia cacheada al conectar, luego la página offline); solo las peticiones same-origin son interceptadas; el tráfico cross-origin pasa intacto; los POST de formularios tienen su propio camino de fallback dedicado.
  • Un worker nuevo toma el control rápido (skipWaiting + claiming clients).

Como la versión de cache del worker cambia en cada build, las actualizaciones publicadas reemplazan la cache obsoleta automáticamente, los lectores reciben el nuevo contenido en su siguiente visita en lugar de quedar fijos a una instantánea vieja.

La página offline

offline.html se genera a partir de los templates del propio site, con el header, el footer, los contactos de la organización, el manejo RTL, y tu título y mensaje offline configurados (Settings → PWA). Es el destino cuando un visitante pide una página que no es ni fresca offline ni está cacheada.

Settings de un vistazo

Setting Propósito Por defecto
Enable PWA Genera manifest, service worker, página offline en build time off
Short name Etiqueta del ícono de la pantalla de inicio (~16 caracteres) site name
Theme color Color del chrome del navegador #6A0DAD
Background color Fondo de la pantalla splash #FFF8DC
Display mode standalone / minimal-ui / fullscreen / browser standalone
Offline title / message Contenido de la página de fallback offline from tagline

Notas operativas

  • Los cambios en la configuración de PWA disparan un rebuild, como de costumbre.
  • Los ejemplos de reverse proxy incluidos sirven /sw.js con un header no-cache, eso es deliberado: permite que un service worker recién construido reemplace al anterior con prontitud mientras todos los demás assets mantienen su cache larga.
  • Cada idioma recibe su propio conjunto PWA completo (su propio manifest, su propio worker, su propia página offline), consistente con el modelo de URLs por idioma.
Lee este sitio en