Progressive web app

Progressive Web App (PWA) é um termo usado para denotar um conjunto de processos de desenvolvimento de software. Ao contrário dos tradicionais aplicativos, um Progressive Web App pode ser visto como uma evolução híbrida entre as páginas da web regulares (ou sites) e um aplicativo móvel. Este novo modelo de aplicação combina recursos oferecidos pelos mais modernos navegadores, com as vantagens de uso de um celular.

Logo PWA

Visão geral

Desde 2005, a Internet foi evoluindo rapidamente: a partir de sites estáticos para páginas web dinâmicas, através de Ajax e responsive web design.

Web Dinâmica e Responsiva

As tecnologias de desenvolvimento da web mudaram, do HTML estático a documentos dinâmicos PHP, ASP.NET, Ajax e vários outras linguagens e scripts que rodam do lado do servidor e outras baseadas em dispositivos.

Ao final, o RWD (Responsive Web Design) evoluiu devido à mudança das funcionalidades introduzidas no HTML5, CSS3 e JavaScript. Esta poderosa combinação de marcação, folhas de estilo e scripts habilitaram interações personalizadas com elementos de página, renderização de vídeos sem o Adobe Flash Player, jogar jogos - todos estes no dispositivo cliente (não servidor).

Navegadores de Internet

Estas alterações não teriam afetado a nova forma de navegar na web sem alterações significativas feitas nos navegadores.

Dispositivos móveis

Em 2007 a Apple lançou o iPhone, pioneiro na popularização dos smartphones com uma tela sensível ao toque, embora outras empresas já tivessem oferecido smartphones semelhantes usando os sistemas operacionais Symbian (Nokia, Motorola, Sony Ericsson, Benq entre outros) e Linux (Motorola e Palm). A ideia de ter um dispositivo prático que permita navegar na Web, bem como uma grande variedade de funções e aplicações nativas ganhou mercado em relativamente pouco tempo.

Melhores experiências em dispositivos móveis 

Uma melhor experiência de usuário é uma das principais razões por trás da popularidade de aplicativos nativos. Estes executam como um pacote de aplicação do sistema considerando que aplicativos web tradicionais são carregados em tempo de execução num navegador. O navegador também atua como uma abstração entre o hardware do sistema e de aplicativos da web. Embalando os recursos e o acesso direto ao hardware, os aplicativos nativos executam mais rapidamente.

Outra categoria de aplicativos chamado "aplicativo híbrido" cai entre as características dos nativos e web apps.

Aplicativos híbridos imitam os aplicativos móveis nativos, sendo assim precisam de uma loja de aplicativos para download, necessitam de instalação e consumem espaço em disco, bem como nas telas iniciais de dispositivos móveis.

Aplicações hibrida parcialmente executado em navegadores de dispositivos móveis, mas de alguma forma eles não manter os princípios partilhados da web, tais como:

• Eles não têm uma URL que não estejam vinculados. Se nada é incapaz de vincular na web, ele nunca se torna parte da web.
• Marcação de estilo e torná-los acessíveis para os seres humanos, bem como motores de busca
• Interface do usuário a riqueza e os recursos do sistema como um adicional de núcleo funcional
• Código aberto, por natureza, tão livre para implementar e usar

Muitos tentaram fechar a brecha entre o móvel e a web experiências, mas descartou a existência de um ou dois aspectos do sistema de valores comuns, descritos acima.

História

Em 2015, designer Frances Berriman e o engenheiro do Google Chrome Alex Russell cunhou o termo "Progressivo Web Apps" para descrever novas funcionalidades suportadas pelos navegadores modernos, incluindo Work Services Web e App Manifests, que permitem que os usuários a atualização de aplicativos web para ser a primeira classe de aplicativos no seu nativo do sistema operacional.

Características

Segundo o Google Developers, um Progressive Web App é:

• Progressivo - Funciona para qualquer usuário, independentemente do navegador escolhido, pois é criado com aprimoramento progressivo como princípio fundamental.
• Responsivo - Se adequa a qualquer formato: desktop, celular, tablet ou o que for inventado a seguir.
• Independente de conectividade - Aprimorado com service workers para trabalhar off-line ou em redes de baixa qualidade.
• Semelhante a aplicativos - Parece com aplicativos para os usuários, com interações e navegação de estilo de aplicativos, pois é compilado no modelo de shell de aplicativo.
• Atual - Sempre atualizado graças ao processo de atualização do service worker.
• Seguro - Fornecido via HTTPS para evitar invasões e garantir que o conteúdo não seja adulterado.
• Descobrível - Pode ser identificado como "aplicativo" graças aos manifestos W3C e ao escopo de registro do service worker, que permitem que os mecanismos de pesquisa os encontrem.
• Reenvolvente - Facilita o reengajamento com recursos como notificações push.
• Instalável - Permite que os usuários "guardem" os aplicativos mais úteis em suas telas iniciais sem precisar acessar uma loja de aplicativos.
• Linkável - Compartilha facilmente por URL, não requer instalação complexa.
• Exemplo - Aqui você pode conferir o exemplo de uma Progressive Web App bem completa.

Tecnologias

Progressive Web Apps são uma melhoria da tecnologia web existente. Eles não exigem agregação ou distribuição. A publicação de um PWA é igual a qualquer outro aplicativo da web.

Técnico de linha de base critérios para um site ser considerado um Progressivo Aplicativo da Web, os navegadores foram descritos por Russell num post de acompanhamento:

• Se originam a partir de um Seguro de Origem. Servido por TLS e verde cadeado apresenta (não ativa conteúdo misto).
• Carregar enquanto estiver offline (mesmo se apenas um personalizado de página off-line). Por implicação, isto significa que a Progressiva Web Apps exigem Trabalhadores do Serviço.
• Referência a um Web App Manifesto com, pelo menos, as seguintes propriedades:
  • nome
  • short_name
  • start_url
  • display (com um valor de fullscreen, standalone ou em minimal-ui)
• Um ícone de, pelo menos, 512×512 grande em formato PNG. E. g.: "ícones": [ { "src": "/images/icon-512.png", "tamanhos": "512x512", "type": "image/png" } ]

Manifesto

É um W3C especificação para definir JSON baseado no manifesto para fornecer aos desenvolvedores um local centralizado para colocar os metadados associados a um aplicativo da web, incluindo

• O nome do aplicativo web
• Links para o aplicativo da web ou ícones de objetos de imagem
• A URL preferencial para iniciar ou abrir a aplicação web
• O aplicativo da web de configuração de dados para um número de características
• Declaração para orientação padrão do aplicativo web
• Permite definir o modo de exibição (tela cheia, padrão e interface mínima)

Por definição e manipulação de metadados para a web ficheiro de manifesto, os desenvolvedores permitem que os agentes do utilizador para criar perfeita nativo-como as experiências através da Progressiva Web App.

Trabalhadores Do Serviço

Aplicativos móveis nativos são ricos em experiências e desempenho, pois eles têm o conteúdo necessário, os componentes e recursos estão prontos para o dispositivo cliente. Devido a mobile app processo de instalação e o preço que eles pagam por ele, como o disco ocupação do espaço, sem atualizações em tempo real, e sem a visibilidade nos motores de pesquisa.

Considerando que aplicativos web tradicionais estão sofrendo confiável de conectividade e carregamento de restrições.

Para superar tudo, o Trabalho de Serviço projetado com o Web Trabalhador contexto oferece facilidade de carregamento de experiências.

Tecnicamente, o Trabalhador de Serviço fornecer um script de rede de proxy do navegador web para gerir o web/solicitações HTTP por meio de programação. Os Trabalhadores do Serviço ficar entre a rede e o dispositivo, para complementar o conteúdo. Eles conseguem usar o mecanismo de cache, de forma eficiente e livre de erros durante o modo offline.

Propriedades dos Trabalhadores do Serviço

1. Desencadear e manter-se vivo pelo relacionamento com os acontecimentos, não por documentos
2. De natureza genérica
3. Orientado a eventos com tempo limite de script contextos e em execução na origem
4. Natural e com pontos de extremidade para uma ampla gama de serviços de tempo de execução
5. Ter um estado
6. Com um script de URL
7. Contendo registro
8. Atribuída a ID ou UUID
9. Com eventos de ciclo de vida
10. Tem recurso de script mapa
11. Pode pular de espera para as bandeiras

Benefícios dos Trabalhadores do Serviço

• Capaz de lidar com a notificação de envio facilmente
• Sincronizar os dados de fundo
• Capazes de responder às solicitações de recursos originam-se em outro lugar
• Receber atualizações de forma centralizada

Aplicação Shell De Arquitetura

Para carregar o aplicativo de layout e conteúdo rapidamente, o serviço de trabalhadores guarde sempre os componentes para a "Interface de Usuário Básica" do RWD aplicativo web. A Interface de Usuário Básica de termos como o "Shell" do aplicativo.

O Shell oferece um primeiro quadro estático, um layout ou arquitetura para carregar conteúdo, progressivamente, bem como dinamicamente. Tecnicamente, o Shell é um pacote de código armazenado localmente na cache do browser do dispositivo móvel. Assim, o Shell pode manter a Progressiva Web App, os usuários envolvidos durante o carregamento do conteúdo ocorrendo com diferentes graus de conectividade da web.

O verdadeiro poder de uma progressiva web apps é manter-nos utilizando a excelência das tecnologias web, mas sair do guia, embora com ótimas experiências móveis.

É verdade que, no presente, a Progressiva Web Apps são apenas para o navegador Chrome, mas pode ser para todos os browsers, em futuro próximo.