PWA
O Chinaski pode apresentar seu site construído como um Progressive Web App instalável. Ativar PWA (desligado por padrão, Settings → PWA) faz o gerador estático produzir três artefatos extras por idioma: um web app manifest, um service worker e uma página de fallback offline.
O manifest
manifest.json é gerado por idioma a partir das suas configurações:
- Nome e nome curto: o nome do site, com o nome curto por padrão igual a ele (truncado a cerca de 16 caracteres). Ambos configuráveis.
- Descrição: sua tagline.
- Start URL e escopo: por idioma (o prefixo do idioma, ou o subdomínio por idioma no modo de URL subdomain).
- Modo de exibição: standalone (padrão), minimal-ui, fullscreen ou browser.
- Cores de tema e fundo: usadas pelo chrome do navegador e pela splash screen.
- Ícones: os ícones de instalação 192 e 512 vêm do seu upload de favicon (incluindo uma variante maskable). Sem favicon definido, não há ícones no manifest; defina um, a menos que você não pretenda expor um app instalável.
O service worker
Gerado por idioma com o timestamp do build embutido como versão do cache: cada rebuild produz um cache novo e aposenta os antigos automaticamente.
- Precache na instalação: a home page, a página offline, o manifest, a raiz do blog, a página de busca, a URL de cada página e post daquele idioma, mais fontes empacotadas, buscadas individualmente para que um arquivo ausente não aborte a instalação.
- Estratégia de runtime: navegações de página são network-first (conteúdo fresco quando online, cópia cacheada ao conectar, e então a página offline); apenas requisições same-origin são interceptadas; o tráfego cross-origin passa intocado; POSTs de formulário têm seu próprio caminho dedicado de fallback.
- Um worker novo assume rapidamente (skipWaiting + claiming clients).
Como a versão do cache do worker muda a cada build, atualizações publicadas substituem o cache obsoleto automaticamente: os leitores recebem o conteúdo novo na próxima visita, em vez de ficarem presos a um snapshot antigo.
A página offline
offline.html é gerada a partir dos próprios templates do site, com o header, o footer, os contatos da organização, o tratamento RTL e seu título e mensagem offline configurados (Settings → PWA). É o destino quando um visitante pede uma página que não está nem fresca offline nem cacheada.
Configurações de relance
| Configuração | Propósito | Padrão |
|---|---|---|
| Enable PWA | Gera manifest, service worker e página offline na hora do build | off |
| Short name | Rótulo do ícone da tela inicial (~16 caracteres) | nome do site |
| Theme color | Cor do chrome do navegador | #6A0DAD |
| Background color | Cor de fundo da splash screen | #FFF8DC |
| Display mode | standalone / minimal-ui / fullscreen / browser | standalone |
| Offline title / message | Conteúdo da página de fallback offline | a partir da tagline |
Notas operacionais
- Mudanças nas configurações de PWA disparam um rebuild, como de costume.
- Os exemplos de reverse proxy distribuídos servem
/sw.jscom um header no-cache. Isso é deliberado: permite que um service worker recém-construído substitua o anterior prontamente, enquanto todo o resto dos assets mantém seu cache longo. - Cada idioma recebe seu próprio conjunto completo de PWA (manifest próprio, worker próprio, página offline própria), consistente com o modelo de URL por idioma.