progressive apps
TRANSCRIPT
PWAProgressive Web Applications
Jackson VeronezeSoftware Developer
[email protected]://jacksonveroneze.comhttps://br.linkedin.com/in/jacksonveroneze
Autores
Mario MendonçaSoftware Developer
[email protected]://br.linkedin.com/in/mario-mendonca
Aplicações CLI
Aplicações Desktop
Aplicações Web
Aplicações Mobile
Por que gostamos dos aplicativos Mobile?Usamos aplicativos de celular todos os dias, e repetidas vezes ao dia – utilitários, redes sociais, aplicativos de mensagens, tocadores de música.
Não precisa abrir um navegador, digitar uma URL, se autenticar e por aí vai. Basta clicar em um ícone na Home que está tudo pronto.
Além disso, o aplicativo é mais rápido normalmente, trabalha offline e envia notificações.
O que é ruim nas Apps Mobile?Não são facilmente linkáveis, ou seja, não tem como eu enviar um link do Facebook, de uma postagem da Web e você ver no seu telefone.
Não são indexadas pelos mecanismos de busca do Google, o que pode impactar diretamente a visibilidade da sua app, ficando restrita apenas ao marketplace.
Por fim temos a instalação e atualização dos aplicativos, que muitas vezes são muito custosos.
O que é ruim nas Web Mobile Apps?Os websites mobile continuam lentos, pesados, e muitas vezes travam o navegador no meio da navegação.
Facebook e o Google já começaram a preparar iniciativas para driblar esse problema, como o Facebook Instant Articles e o Google Accelerated Mobile Pages.
Mas esse tipo de iniciativa não resolve o problema, apenas o contorna.
Não tem notificações.
Não trabalham offline.
PWA - A Salvação?Ele começa como uma simples aba no Chrome e se torna “progressivamente mais app” à medida em que você engaja e interage com ele. Até chegar ao ponto onde basta você adicionar o Web App à sua página inicial e pronto: ele passa a adquirir funções que antes eram exclusivas de aplicativos nativos: geolocalização, notificações, uso offline, etc..
“É uma aplicação Web com performance, animações, notificações, instalável, trabalhando offline, linkável, indexável e de fácil atualização.”
“Esses aplicativos não são entregues através da App Store, eles são apenas
websites que tomaram a dose certa de vitaminas.”
As vantagens para o usuárioExemplo: O Shopping
Imagine você visitando o shopping pela primeira vez e talvez a única vez. Para efetuar o pagamento do estacionamento você necessita usar o app do shopping. Pensando num app nativo, precisaria ir até a loja de aplicativos do seu SO e instalá-lo. Para utilizar, provavelmente, apenas uma vez.
Agora imagine a mesma situação, porém, para efetuar o pagamento você precisa acessar apenas uma url em seu browser e progressivamente ele vai se tornando um app, sem necessidade de instalação.
CaracterísticasProgressivos: funcionam para todos os usuários, independentemente da escolha de navegador, pois são criados com aprimoramento progressivo como princípio central.
Responsivos: ajustam-se a qualquer formato: computador, dispositivo móvel, tablet ou o que quer que esteja por vir.
Independentes de conectividade: aprimorados para usar service workers para funcionar off-line ou em redes de baixa qualidade.
Semelhantes a um app: o usuário sente que está usando um app, com interações e navegação no mesmo estilo de apps, pois eles são criados no modelo app shell.
Atualizados: sempre atualizados, graças ao processo de atualização do service worker.
CaracterísticasSeguros: veiculados por HTTPS para impedir o rastreamento e assegurar que o conteúdo não foi adulterado.
Detectáveis: são identificáveis como "aplicativos" graças ao escopo de registro do service worker e manifestos W3C, permitindo que mecanismos de pesquisa os encontrem.
Reengajados: facilitam o reengajamento por meio de recursos como notificações push.
Instaláveis: permitem que os usuários "salvem" os apps que consideram mais úteis na sua tela inicial sem a inconveniência de ter que usar uma loja de apps.
Vinculáveis por link: compartilhamento fácil por meio de URL, sem a exigência de instalações complexas.
Criar atalho
Service worker
Status SSL
Heurística de frequência de acessos
Será que a moda pega?
Tecnologicamente falando: não é todo navegador que suporta as tecnologias e frameworks necessários para que um aplicativo web progressivo funcione a 100% de suas capacidades. Mas isso é só uma questão de tempo; toda tecnologia acaba empurrando os limites das plataformas onde ela roda.
Exemploshttps://sergiolopes.github.io/shopping/
https://paperplanes.world/
https://task-list-5944f.firebaseapp.com/
https://pwa.rocks/
Referênciashttp://arquiteturadeinformacao.com/mobile/o-que-sao-progressive-web-apps/
https://codelabs.developers.google.com/codelabs/your-first-pwapp-pt/index.html?index=..%2F..%2Findex#0
http://blog.balta.io/2016/10/10/pwa-por-onde-comecar/
http://hipsters.tech/progressive-web-apps-hipsters-03/