# Progressive Web Apps: Por uma web mais appficada

- Link: https://josivandroavelar.com.br/progressive-web-apps-por-uma-web-mais-appficada/
- Published: 2020-01-25T22:37:32-03:00
- Author: Josivandro Avelar

É cada vez maior a frequência com a qual as pessoas utilizam os smartphones para
acessar a Internet; seja se informando, se comunicando, postando algo nas suas mídias
sociais, enfim, tomando o espaço que um belo dia já foi do computador.

O desenvolvimento de sites acompanha tudo isso, e vai se adaptando aos novos tempos.
Não para menos, a 612 Comunicação está testando um sistema chamado **Progressive
Web Apps** (PWA, em inglês Aplicativos Progressivos para a Web) em seus sites-mestres.

Mas aí você se pergunta: o que danado é isso? Simples: é um, digamos assim, meio-
termo entre um site da web e um aplicativo móvel. Você não precisa nem ir para a
loja de aplicativos como a App Store ou o Google Play para instalar o “app”: você
aciona um atalho e ele transforma-se num aplicativo móvel híbrido, com o uso de 
recursos do navegador.

Vamos explicar melhor como funciona a tecnologia e como ela funciona no mesmo princípio
dos aplicativos lite, que já mostramos anteriormente aqui no #site612; economia 
e otimização de espaço e rapidez no processo e experiência do usuário.

#### **O seu conteúdo ao seu alcance, sem precisar de muito**

Essa alternativa é apresentada para sites de conteúdo, que não teriam para quê desenvolver
um aplicativo mobile que muito provavelmente o usuário não iria se interessar em
acessar todas as vezes que precisar procurar algo especificamente nele. Tudo o que
ele não quer no momento, e não é para menos em tempos de crise e em momentos que
você não quer trocar de celular agora, é encher o celular de memória.

Aqui combinamos a tecnologia PWA com o AMP, aquele que torna as páginas mais leves
e com menos tempo de carregamento, dando uma agilidade maior ao usuário independente
de que tipo de conexão ele vá ter naquele momento.

Talvez você se lembre de um post que foi ao ar aqui no #site612, onde [falamos de aplicativos lite](https://612comunicacao.com.br/aplicativos-lite-e-android-go-o-mercado-se-adapta-ao-armazenamento-do-seu-celular/).
Falamos na ocasião sobre a preocupação com o espaço dos aparelhos celulares dos 
usuários, a qual tem sido uma constante para as empresas de tecnologia. O mercado
se adapta ao armazenamento do seu celular: se tiver que enxugar recursos para não
perder público, assim o fará.

E essa também é a lógica dos Progressive Web Apps: se for necessário, não precisa
criar um aplicativo só para replicar tudo aquilo que você vai ler no site, se você
pode ter o conteúdo do site “appficado”. Aliás, um dos aplicativos mencionados naquele
post, o [Twitter Lite](https://play.google.com/store/apps/details?id=com.twitter.android.lite),
é um PWA. Tanto faz se você baixar de uma loja de aplicativos ou adicionar o atalho;
é a mesma coisa. Só por aí temos um entendimento rápido do que é um PWA.

![Imagem de quatro celulares com telas do Twitter, em fundo azul.](https://i0.wp.
com/josivandroavelar.com.br/wp-content/uploads/2020/01/twitter.png?resize=768%2C543&
ssl=1)

 O Twitter Lite é um Progressive Web App. O app baixado no Google Play e o atalho
que você adiciona na versão web são a mesma coisa.

Um dos sites que eu “appfiquei” foi justamente o do [Blog Josivandro Avelar](https://josivandroavelar.com.br/),
através dos recursos AMP for WP e PWA for WP, estes dos mesmos desenvolvedores. 
E ele vai além; você não só adiciona o atalho na sua tela inicial, como ele adiciona
o atalho na gaveta de apps, como se aquilo fosse mesmo um aplicativo móvel.

Quando o usuário acessa a [página inicial do site na versão AMP](https://josivandroavelar.com.br/amp),
abre-se uma aba na parte de baixo do mesmo convidando o usuário a adicionar o atalho
na tela inicial de seu aparelho. Ele deve clicar nessa aba e aceitar a adição do
atalho, que além de ir para a tela inicial, vai para a gaveta de apps.

Ao abrir o atalho adicionado, é exibida uma _Splash Screen_, que é a tela de início
do app, aquela que você vê no momento em que abre o aplicativo e antes dele ser 
exibido de fato para uso.

O que vai aparecer para o usuário é a mesma versão AMP da página inicial do site
que ele acessou lá atrás para adicionar o atalho, convertida em usabilidade de aplicativo.
Todas as páginas e posts serão abertas a partir do Android WebView, que para quem
não sabe o que é, é o componente do sistema do Google Chrome que permite que as 
páginas externas sejam abertas dentro dos apps, sem necessidade de “chamar” o Google
Chrome, ou seja, sem abrir uma nova janela, por tabela saindo do aplicativo.

Como ele é o próprio site adaptado para a usabilidade de um aplicativo, tendo este
a necessidade do Google Chrome, eu economizo espaço de memória interna do celular,
bem como ele aproveita os próprios dados do Google Chrome.

#### Realidade no Android, engatinhando no iOS

Enquanto no Android a funcionalidade de suporte aos Progressive Web Apps já é uma
realidade, no iOS o PWA ainda engatinha.

Só a partir do iOS 11.3 é que essa funcionalidade foi aplicada aos poucos e sem 
alarde, visto que não parece ser um interesse da Apple pelo menos nesse momento,
e até porque esse nunca seja o foco dela. O recurso está disponível apenas em seu
navegador nativo, o Safari.

**“Appficando” a Web**

Como dito, a “appficação” da Web é uma tendência que veio para ficar, não tem volta.
Muitos sites estão sendo desenvolvidos justamente sob o conceito de _mobile first_,
onde o foco é como ele será visto nos dispositivos móveis, e daí para os desktops,
sendo a prioridade total de conteúdo mobile.

E vai além de apenas adaptar um layout para o mobile. É oferecer a experiência para
o usuário de estar usando um aplicativo que ele gostaria de baixar, mas ao mesmo
tempo não quer por achar que vai ocupar espaço em sua memória.

É o mesmo conceito aplicado aos aplicativos lite, quando falamos que grande parte
dos celulares possuem 1 GB de memória ou 8 GB de armazenamento em média.

E que seria lógico para o mercado encontrar meios para que nenhum público fique 
de fora das campanhas mobile só porque os celulares do seu público-alvo não aguentam.

A web está cada vez mais mobile. E nada mais lógico do que se adaptar ao novo conceito.

**“Appficação” nos sites da 612 Comunicação**

O processo de testes começou aqui mesmo no [#site612](https://612comunicacao.com.br/),
no [Blog Josivandro Avelar](https://josivandroavelar.com.br/), no [Ônibus Paraibanos](https://onibusparaibanos.com/)
e no [OCD Holding](https://ocdholding.com.br/).

Quando aparecer neles uma aba convidando a adicionar o atalho na página inicial,
é só aceitar e deixar o Chrome trabalhar. Feito isso, os atalhos aparecem tanto 
na sua tela inicial quanto na gaveta de apps.

É como ter um aplicativo, sem precisar de tanto, e tendo já feito o investimento
no site.

_Este texto sobre Progressive Web Apps fui eu que escrevi lá no [site da 612 Comunicação](https://612comunicacao.com.br/progressive-web-apps-por-uma-web-mais-appficada/).
Quis trazer para cá._

### _Relacionado_