Saiba como uma pequena equipe conseguiu grandes vitórias criando um PWA de marketplace atraente.
Com sede em Amã, na Jordânia, a OpenSooq é um mercado de classificados que prioriza dispositivos móveis e oferece uma ampla variedade de produtos e serviços em 19 países do Oriente Médio e do Norte da África.
O desafio
Mais de 85% do tráfego da OpenSooq vem de dispositivos móveis, e esse número continua crescendo. Muitas pessoas na região dependem de dispositivos de baixo custo com capacidades de armazenamento limitadas, o que cria uma forte necessidade de que o site móvel da OpenSooq seja o mais rápido e leve possível. No entanto, os tempos de carregamento lentos no antigo site móvel da OpenSooq afetaram a satisfação do cliente e resultaram em taxas de rejeição de até 49% em mercados como o Kuwait.
Para oferecer aos clientes uma experiência melhor em todas as plataformas, a empresa percebeu que precisava de um site mais rápido e responsivo. Em junho de 2017, a equipe de engenharia da OpenSooq lançou um Progressive Web App (PWA).
Foco no desempenho e na confiabilidade
Os três desenvolvedores internos da OpenSooq criaram um PWA repleto de recursos com o React e o webpack em apenas dois meses e meio.
Para garantir que o site fosse rápido e fácil de indexar pelos mecanismos de pesquisa, a equipe optou por implementar a renderização pelo servidor. Com quase 28% dos usuários acessando o PWA em redes 2G ou 3G irregulares, era fundamental que os usuários confiem na experiência para funcionar, independentemente das restrições da rede. Por isso, a equipe implementou uma experiência off-line usando service workers e uma estratégia que prioriza o cache e depois a rede. A equipe também usou o padrão PRPL (link em inglês) para oferecer carregamento instantâneo aos usuários.
Ao adotar essas práticas recomendadas, a equipe conseguiu reduzir o tempo médio de carregamento da página (Tempo para interação da página) de 4 para menos de 2 segundos. E eles usaram o Lighthouse para garantir que o site permaneça tão rápido. Esses esforços ajudaram a OpenSooq a alcançar mais de 1,8 bilhão de visualizações de página por mês.
Mais de um quarto dos nossos usuários acessa o PWA do OpenSooq em redes de baixa média. Por isso, a confiabilidade foi essencial para manter o engajamento dos usuários. Os service workers e as estratégias de armazenamento em cache nos ajudaram a criar a experiência do usuário confiável de que precisávamos sem problemas.
Amin Shoman, gerente técnico de PWA, OpenSooq
Melhorar o reengajamento
Depois de criar uma experiência confiável e de alto desempenho, a equipe da OpenSooq queria garantir que os usuários permanecessem engajados com o produto. Para fazer isso, eles permitiram que os usuários instalassem o PWA na tela inicial e incluíssem suporte a notificações significativas. Isso permitiu que o site notificasse os compradores sobre a interação com o vendedor em consultas e os vendedores sobre ativação e expiração dos anúncios.
Essas melhorias aumentaram o número de usuários ativos por mês da experiência na Web do OpenSooq em 14%. Para os usuários que instalaram o PWA, houve um aumento de 48% no número de visitas à página por sessão e um aumento de 28% na duração média da sessão. A OpenSooq também teve um aumento de 25% no tempo médio dos usuários em uma página e uma queda de 29% nas taxas médias de rejeição em todos os mercados.
No futuro
Após apenas algumas semanas de esforço, a OpenSooq criou um PWA de 23 KB com todos os recursos, que oferece uma experiência consistente a usuários em todas as plataformas e navegadores. Como é fácil atualizar recursos na Web, a equipe optou pelo PWA, lançando e testando novos recursos e fluxos de usuários no PWA antes de implementá-los em outras plataformas.
A OpenSooq agora está trabalhando para adicionar uma solicitação de instalação específica da plataforma e integrar o PWA com Accelerate Mobile Pages (AMP). Essas melhorias aceleram ainda mais o carregamento de páginas e facilitam ao máximo a transição para o app específico da plataforma. Com base no esforço inicial de desenvolvimento, a equipe do OpenSooq continuará oferecendo aos usuários a melhor experiência possível.
A importância de desenvolver nosso PWA ficou clara para as equipes de liderança e técnica. Depois de criar um aplicativo da Web moderno e melhorar seu desempenho, estamos animados em ver o impacto comercial nos nossos investimentos de 2,5 meses.
Ramzi Alqrainy, diretor de tecnologia, OpenSooq