Introdução ao Progressive Web App PWA

Rogério Marques

20 agosto 2018 - 09:00 | Atualizado em 29 março 2023 - 17:40

Mulher em frente a computador utilziando celular

Juntamente com o avanço da tecnologia, o aumento de dados é cada vez mais notável nas aplicações, fazendo com que os dispositivos necessitem de um maior espaço para os armazenamentos deles. Como solução desse problema que vem aumentando nos últimos anos, criaram o PWA.

O Progressive Web App (PWA) é o mais recente recurso da Web que oferece uma experiência de usuário semelhante a um aplicativo. Assim como os aplicativos da web de hoje, os PWAs tentam criar uma experiência do usuário semelhante à dos aplicativos nativos, em grande parte. Eles podem ser melhor descritos como a compilação de tecnologias mais recentes, API da Web e conceitos de design que podem fornecer uma experiência de aplicativo na Web para dispositivos móveis.

Mas para ser um PWA é necessário atender alguns quesitos como:

  • Funcionar para todos os usuários independente do navegador escolhido;
  • Ser responsivo e se adaptar a qualquer tipo de tela, tanto de desktop, celular ou tablet;
  • Estar sempre atualizado, pelo fato do app estar hospedado em um servidor online;
  • Facilitar o reengajamento dos usuários por meio de pushnotifications (“alertas de celulares”);
  • Funcionar offline ou em conexão a internet de baixa qualidade;
  • Ser facilmente compartilhado via URL e não ter uma instalação complexa;
  • Utilizar o modelo app-shell* para fornecer uma navegação e interação igual a de um aplicativo nativo;
  • Ser seguro e utilizar HTTPS para evitar espionagem e garantir que o conteúdo não tenha sido adulterado.

Segundo Addy Osmani, uma arquitetura de app-shell (ou shell de aplicativo) é uma forma de se criar um Progressive Web App que carrega de forma confiável e instantânea na tela do usuário, muito parecido com o que se vê em aplicativos nativos. O “shell” de um aplicativo é o HTML, o CSS e o JavaScript mínimos necessários para se gerar a interface do usuário e, quando armazenados em cache off-line, podem oferecer desempenho instantâneo e confiável a usuários quando voltam a acessar. Isso significa que o shell dos aplicativos não é carregado pela rede sempre que o usuário acessa. Apenas o conteúdo estritamente necessário é buscado na rede.

O PWA pegou todos os ingredientes necessários para que possa se comportar como um aplicativo baixado da App Store / Play Store. Ele se inicia como uma página da web normal e, conforme o usuário explore a página, ele recebe um alerta “adicionar à tela inicial”. Se for aceito, o usuário tem a opção de ocultar os controles da interface do navegador e a aplicação parecerá com um aplicativo.

Uma pesquisa realizada pela Google concluiu que os usuários não gostam de baixar o aplicativo de todos os sites que visitam. 50% deles não baixam nenhum app por mês. O PWA reduz as etapas entre a descoberta do aplicativo e a colocação na tela inicial, eliminando o problema de instalação de um app. Além disso, mais de 40% dos usuários saem de sites que levam mais de três segundos para carregar. Ele então acaba sendo uma solução para essa demora enfrentada pelos usuários.

PWAs possuem algumas características como:

  • ser confiável,
  • carrega-se instantaneamente, mesmo em condições de rede instável,
  • responde rapidamente às interações do usuário com animações suaves,
  • faz com que o usuário sinta-se em um aplicativo natural do dispositivo, com uma experiência imersiva.

Por fim, podemos concluir que essa tecnologia ainda está apenas começando e futuramente irá representar uma grande parte do desenvolvimento de novas aplicações com foco em dispositivos móveis.

Recomendados para você

Mulher trabalhando em uma mesa com várias paletas de cores
O que é a psicologia das cores? ...
Homem trabalhando em um copmputador
Preparando um ambiente para Testes Automatizados com Cucumber e Java ...
Pessoa utilziando computador exibindo códigos olhando para a tela sorrindo
Principais e melhores blogs de TI e Software ...