O nosso parceiro de agência giftGRÜN construiu uma Progressive Web App (abreviado: PWA) com WordPress para o Hospital Universitário RWTH Aachen, que apoia a integração de novos/as colaboradores/as. Conversámos com Patrick Heinker sobre as vantagens e desvantagens das PWAs versus sites e aplicações nativas.

Como funciona uma Progressive Web App

Patrick, como funciona exatamente uma AWP e o que acontece com a gestão de dados?

O conteúdo é mantido em WordPress e produzido através de modelos normais. Um ServiceWorker fornece a funcionalidade offline. Quando a página é aberta inicialmente, o ServiceWorker descarrega um ficheiro zip com todas as páginas, que é gerado no lado do servidor.

Agora, quando uma página é chamada, a página que já está na cache é exibida. E o ServiceWorker trata da atualização em segundo plano, para que ela mostre novos conteúdos na próxima visita, caso algo tenha mudado. Opcionalmente, podes também recarregar após uma atualização, mas isso não foi necessário para o nosso caso de uso.

PWA WordPress
Screenshots da Progressive Web App para o Hospital Universitário RWTH de Aachen

O armazenamento de dados é completamente offline, apenas para vídeos e conteúdos externos é necessária uma ligação à internet.

PWA vs. App nativa

Quais são as diferenças, mas também as vantagens em comparação com as aplicações nativas?

As aplicações nativas são específicas da plataforma, muitas vezes complexas e, portanto, de implementação cara. Além disso, elas têm de ser distribuídas através das lojas oficiais para um grande alcance. As PWAs, por outro lado, podem ser instaladas diretamente com o toque de um botão quando se visita a página.

No entanto, a Apple ainda está um pouco atrasada com o suporte das funcionalidades da PWA. Mas não é novidade entre os/as desenvolvedores/as web, que o Safari não suporta coisas que são comuns em outros navegadores há anos...

Como é que a interação entre a Progressive Web App com WordPress?

Utilizamos WordPress para a manutenção de dados, mas também para os modelos. É um site normal, com a única diferença de que o conteúdo é disponibilizado offline através de um JavaScript ServiceWorker. E que se comporta quase como uma aplicação nativa.

Há também a possibilidade de usar a API REST do WordPress e renderizar tudo do lado do cliente, como seria usual em aplicações nativas. Para o nosso caso de uso, no entanto, apenas vimos aqui um esforço adicional, o que dificilmente traz qualquer benefício.

Implementar Progressive Web App com WordPress

Que abordagens existem se se quiser implementar uma Progressive Web App com WordPress?

Existem alguns plugins, com os quais uma página pode ser transformada numa Progressive Web App com o premir de um botão e algumas definições. Há também serviços de notificação push que podem ser usados para notificar todos/as os/as visitantes de blogues sobre novas publicações. No entanto, estes plugins prontos foram pensados mais para fazer um blogue normal com capacidade offline e pré-carregar ficheiros específicos.

Depois de brincarmos com alguns destes plugins, partimos para a nossa própria solução. Construímos a nossa funcionalidade separadamente dos plugins para permitir, por exemplo, o carregamento completo do conteúdo da página através de um zip gerado pelo servidor e para ser mais flexível no ajuste de funcionalidades. As notificações push são normalmente mapeadas através de serviços pagos, mas podem ser construídas internamente com a mesma facilidade.

PWAs: compatibilidade e proteção de dados

Quais são as potenciais armadilhas e como as resolveste? E quanto à questão da proteção de dados?

O habitual com o desenvolvimento web: cada navegador funciona de maneira diferente e deve ser testado extensivamente em todos os dispositivos. A Apple recusa-se a suportar totalmente a funcionalidade PWA e, mais uma vez, tem as suas próprias meta tags específicas da Apple para fazer a aplicação funcionar e que se desviam do padrão.

O modelo de cache deve ser escolhido para se adequar ao caso de uso. O ServiceWorkers pode gerar páginas em cache em milissegundos e atualizá-las em segundo plano. Contudo, se eu estiver numa página de notícias, o/a utilizador/a pode preferir ver uma pequena barra de espera até que o último conteúdo seja carregado.

A proteção de dados foi uma das principais razões para escolhermos uma AWP. O conteúdo e o progresso da aprendizagem dos/as utilizadores/as são mantidos completamente offline. O servidor nunca vê qual utilizador/a chama o quê, já que não há utilizadores/as com sessão iniciada. Portanto, é impossível rastrear se um/a novo/a colaborador/a já trabalhou em tudo ou sequer se instalou a aplicação,

Vantagens e desvantagens dos sistemas

Como decides por cliente qual a tecnologia mais adequada para um projeto deste tipo?

Existem aplicações que só podem ser implementadas através de uma aplicação nativa. Por exemplo, se um/a cliente quer absolutamente ter notificações push num iPhone, então não há outra maneira além da nativa. Por outro lado, a produção de PWAs também é significativamente mais barata do que uma aplicação nativa, devido ao uso de tecnologias web e à dispensa de todo o manuseio da loja. É claro que o orçamento disponível também desempenha um papel decisivo.

Tens outros projetos de PWA em pteparação sobre os quais nos podes contar?

Muito - mas ainda não os queremos 😉 Apenas isto: podem ser feitas muitas e fantásticas coisas com as PWAs também no setor do comércio electrónico.

Algumas palavras sobre ti e a tua agência?

giftGRÜN é a agência digital dentro do Grupo GRÜN. O nosso grupo de empresas é o fornecedor líder de mercado na Alemanha em sistemas de gestão de doação e de membros. A maioria dos nossos projetos são sobre a criação de um sistema global para os/as nossos/as clientes, ou seja, conetar o nosso sistema ERP a sites.

Fazemos muito trabalho de interface e também desenvolvemos os nossos próprios temas de WordPress. Nossa equipa é composta por designers, desenvolvedores/as frontend e backend e gestores de projeto. O nosso host favorito é, naturalmente, de Münster 🙂

As tuas perguntas sobre as Progressive Web Apps

Tens perguntas sobre Progressive Web Apps? Escreve-nos nos comentários. Queres ser informado/a sobre novos artigos de WordPress e WooCommerce? Então segue-nos no Twitter, Facebook, LinkedIn ou através da nossa newsletter.

O Michael é responsável pelas áreas de conteúdo e saúde mental na RAIDBOXES. Desde 2007 que ele é bastante ativo nas comunidades de bloggers e WordPress. Entre outras coisas, como co-organizador de eventos WordPress, autor de livros e formador de blogues corporativos. Ele gosta muito de escrever em blogues, tanto a nível profissional como pessoal. O Michael trabalha e escreve remotamente a partir da ensolarada cidade de Friburgo.

Artigos relacionados

Comentários sobre este artigo

Escreve um comentário

O teu endereço de e-mail não será publicado. Os campos obrigatórios estão marcados com *.