A PWA representa uma nova era para os desenvolvedores de software web. Descubra o significado, o objetivo e a importância da PWA e veja como implementar!
Não é de hoje que o tema “local vs nuvem” está em pauta no mundo da tecnologia.
Com a popularização de conceitos como SaaS, multiplataforma e APIs, muitos desenvolvedores de software passaram a se dedicar à produção de softwares web, que nada mais são do que sites e portais tão complexos e repletos de recursos que se parecem muito com um software instalado na máquina do usuário.
No universo mobile, o conceito é relativamente novo, mas tão disruptivo quanto foi no desktop. Desde sua concepção, as plataformas mobile são dominadas por aplicações nativas de seus sistemas operacionais, distribuídas em App Stores.
Comercialmente interessante para as empresas que desenvolvem os sistemas operacionais mobile, as App Stores foram protegidas por um bom tempo, e de diversas formas. Embora ainda representem grande maioria do mercado, os apps tradicionais começam a dividir a atenção e a home screen do usuário mobile com um poderoso concorrente.
O que é PWA?
PWA, ou Progressive Web Application, é essencialmente um site, página ou portais que promove uma experiência de usuário confiável, rápida e atraente.
- Confiável, pois pode ser acessado e carregado instantaneamente mesmo sem acesso à internet.
- Rápida, porque carrega rápido e responde rapidamente à interações do usuários
- Atraente, pois se parece com um app nativo: é bonito e imersivo.
Esses três pilares representam um novo nível de qualidade de experiência de usuário, e com eles, as Progressive Web Applications conquistam seu espaço na tela inicial dos usuários.
Para entender por quê essas características são tão poderosas, precisamos entender seus significados mais a fundo.
Confiabilidade
Significa que a PWA não te deixa “na mão”. Assim como os app nativos, uma Progressive Web Application também cria um ícone na tela inicial do usuário. Ao acessar esse ícone, a PWA irá carregar instantaneamente, independente da existência de conexão com a internet.
Isso é possível devido aos service workers, serviços javascript que rodam em background no navegador. Um service worker pode funcionar como um proxy que permite controlar o cache do navegador e respostas à requisições. Deixando os recursos chave em cache, você elimina a necessidade de conexão, garantindo que o usuário conseguirá usar sua PWA quando quiser.
Velocidade
Sabemos que mais da metade dos usuários mobile abandonam um site se ele demorar mais de 3 segundos para carregar.
Uma vez carregado, o usuário espera que ele ofereça rolagem instantânea, resposta rápida à interações e navegação praticamente imperceptível entre páginas.
Todas essas características são necessárias para que um site possa ser chamado de rápido. E para ser considerado uma PWA, o site precisa ser rápido. É tudo sobre experiência de usuário, lembra? E os usuários não tem paciência, deal with it.
Atratividade
Conforme citado previamente, Progressive Web Applications são instaláveis (não é exatamente uma “instalação de verdade”; é o momento em que a cache citada em ‘Confiabilidade’ é gerada) e geram ícone na tela inicial do usuário, sem precisar passar por uma app store.
As Progressive Web Applications recebem ajuda do o Web App Manifest, um arquivo JSON que permite que o desenvolvedor controle como o site será exibido, permitindo que a PWA:
- Tenha um ícone personalizado na tela inicial;
- Seja exibida em tela cheia,
- Esconda o nome, o ícone, o menu e barra do navegador;
- Seja exibida em modo retrato ou paisagem;
- Defina cores tema
- Adicione uma tela de carregamento personalizada
Implementando uma PWA
Desenvolvedores interessados em abraçar esse novo conceito contam com um poderoso aliado: a Google, desenvolvedora do sistema operacional Android, é totalmente amigável com as Progressive Web Applications!
Além de divulgar o conceito e preparar o navegador Chrome para rodar as Progressive Web Applications com perfeição, a Google ainda disponibiliza uma ferramenta gratuita para auxiliar os desenvolvedores a criar sites, portais e páginas que sigam à risca os critérios PWA.
Acesse outros conteúdos gratuitos para desenvolvedores de Software!
Conheça a Revista TecnoUpdate, essencial para Software Houses!
