Progressive Web App

Origem: Wikipédia, a enciclopédia livre.
Saltar para a navegação Saltar para a pesquisa
Broom icon.svg
As referências deste artigo necessitam de formatação (desde novembro de 2016). Por favor, utilize fontes apropriadas contendo referência ao título, autor, data e fonte de publicação do trabalho para que o artigo permaneça verificável no futuro.

Progressive Web App (PWA) é um termo usado para denotar uma nova metodologia 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.

Visão geral[editar | editar código-fonte]

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

Web Dinâmica e Responsiva[editar | editar código-fonte]

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.

Eventualmente, 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[editar | editar código-fonte]

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

Dispositivos móveis[editar | editar código-fonte]

Em 2007 a Apple lançou o iPhone, o primeiro smartphone totalmente funcional com uma tela sensível ao toque. Esta ideia de por um preço acessível, ter um dispositivo prático que permita navegar na Web, bem como uma grande variedade de aplicações nativas - espalhou-se instantaneamente.

Melhores experiências em dispositivos móveis [editar | editar código-fonte]

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 em um 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 na telas iniciais de dispositivos móveis.

Hyprid apps 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[editar | editar código-fonte]

Em 2015, designer Frances Berriman e Google Chrome engenheiro Alex Russell[desambiguação necessária] cunhou o termo "Progressivo Web Apps" [3] para descrever novas funcionalidades suportadas pelos navegadores modernos, incluindo Trabalhadores do Serviço Web e App Manifestos, que permitem que os usuários a atualização de aplicativos web para ser a primeira classe de aplicativos em seu nativo do sistema operacional.

Características[editar | editar código-fonte]

De acordo com o Google Developers,[3][4][5][6] 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.

Tecnologias[editar | editar código-fonte]

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 em um post de acompanhamento:[7]

  • 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 autônomo ou em tela cheia)
  • Um ícone de, pelo menos, 144×144 grande em formato png. E. g.: "ícones": [ { "src": "/images/icon-144.png", "tamanhos": "144x144", "type": "image/png" } ]

Manifesto[editar | editar código-fonte]

É um W3C especificação para definir JSONbaseado no manifesto[8] 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 o web app
  • 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

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[editar | editar código-fonte]

Aplicativos móveis nativos são ricos em experiências e desempenho, pois eles tem 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 do Serviço projetado com o Web Trabalhador contexto oferece facilidade de carregamento de experiências.

Tecnicamente, o Serviço de Trabalhadores fornecer um script de rede de proxy do web browser 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 são capazes de 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 se originam em outro lugar
  • Receber centralizado atualizações

Aplicação Shell De Arquitetura[editar | editar código-fonte]

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.

Referências[editar | editar código-fonte]

  1. http://adaptivepath.org/ideas/ajax-new-approach-web-applications/  Em falta ou vazio |título= (ajuda)
  2. http://alistapart.com/article/responsive-web-design  Em falta ou vazio |título= (ajuda)
  3. a b https://infrequently.org/2015/06/progressive-apps-escaping-tabs-without-losing-our-soul/  Em falta ou vazio |título= (ajuda)
  4. Your First Progressive Web App | Web Fundamentals - Google Developers https://developers.google.com/web/fundamentals/getting-started/your-first-progressive-web-app/?hl=en  Em falta ou vazio |título= (ajuda)
  5. https://developers.google.com/web/progressive-web-apps  Em falta ou vazio |título= (ajuda)
  6. «Seu primeiro Progressive Web App  |  Web  |  Google Developers». Google Developers. Consultado em 23 de novembro de 2017.  line feed character character in |titulo= at position 41 (ajuda)
  7. https://infrequently.org/2016/09/what-exactly-makes-something-a-progressive-web-app/  Em falta ou vazio |título= (ajuda)
  8. W3C “Web App Manifest”, Working Draft, retrieved 12 September 2016