O que é uma PWA (Progressive Web Application)?

PWA é uma aplicação web que parece e comporta-se como uma aplicação móvel nativa, funcionando no navegador.

Principais características do PWA:

• Confiabilidade: Funciona offline graças aos Service Workers.
• Desempenho: Carrega rapidamente e responde às ações do utilizador.
• Instalabilidade: Os utilizadores podem adicionar a PWA à tela principal do dispositivo.
• Descobribilidade: É indexada pelos motores de busca.
• Atraente: Pode enviar notificações push.
• Responsividade: Adapta-se a qualquer tamanho de ecrã.
• Segurança: Funciona apenas em HTTPS.

Tecnologias utilizadas na PWA:

• Service Workers: Proxy entre o navegador e a rede, permite cachear recursos e trabalhar offline.

  // Exemplo de instalação de Service Worker
  if ('serviceWorker' in navigator) {
    window.addEventListener('load', () => {
      navigator.serviceWorker.register('/service-worker.js')
        .then(registration => {
          console.log('Service Worker registado com escopo:', registration.scope);
        })
        .catch(error => {
          console.log('Erro no registo do Service Worker:', error);
        });
    });
  }
  

• Web App Manifest: Ficheiro JSON com informações sobre a aplicação (nome, ícones, orientação do ecrã, etc.).

  {
    "short_name": "My PWA",
    "name": "A minha PWA de exemplo",
    "icons": [
      {
        "src": "/images/icon-192x192.png",
        "type": "image/png",
        "sizes": "192x192"
      },
      {
        "src": "/images/icon-512x512.png",
        "type": "image/png",
        "sizes": "512x512"
      }
    ],
    "start_url": "/",
    "background_color": "#3367D6",
    "display": "standalone",
    "scope": "/",
    "theme_color": "#3367D6"
  }
  

• HTTPS: Garante uma ligação segura.

Vantagens do PWA:

• Não requer instalação através das lojas de aplicações.
• Ocupa menos espaço no dispositivo.
• É atualizado mais facilmente.
• Está disponível em todas as plataformas com suporte de navegador.

Testes de PWA incluem verificar:

• Funcionalidade em modos online e offline.
• Instalação e funcionamento na tela principal.
• Responsividade em diferentes dispositivos.
• Notificações push.
• Funcionamento do Service Worker e cache.
• O manifesto da aplicação.
• Desempenho.