Scopri come un piccolo team ha ottenuto grandi vittorie creando un'avvincente PWA marketplace.
Con sede ad Amman, in Giordania, OpenSooq è un marketplace di annunci mobile-first che offre un'ampia gamma di prodotti e servizi in 19 paesi in Medio Oriente e Nord Africa.
La sfida
Oltre l'85% del traffico di OpenSooq proviene da dispositivi mobili e questo numero continua ad aumentare. Molte persone in questa regione si affidano a dispositivi di fascia bassa con capacità di archiviazione limitate, il che crea una forte esigenza che il sito per dispositivi mobili di OpenSooq sia il più veloce e leggero possibile. Tuttavia, i tempi di caricamento lenti sul vecchio sito mobile di OpenSooq incidevano sulla soddisfazione dei clienti e hanno portato a frequenze di rimbalzo fino al 49% in mercati come il Kuwait.
Per offrire ai propri clienti un'esperienza costantemente migliore su tutte le piattaforme, l'azienda si è resa conto di dover creare un sito web più veloce e reattivo. Pertanto, nel giugno 2017, il team di tecnici di OpenSooq ha lanciato un'app web progressiva (PWA).
Presta attenzione a prestazioni e affidabilità
I tre sviluppatori interni di OpenSooq sono stati in grado di creare una PWA completa con React e webpack in soli due mesi e mezzo.
Per garantire che il sito fosse veloce e facilmente indicizzabile dai motori di ricerca, il team ha scelto di implementare il rendering lato server. Con quasi il 28% degli utenti che accedeva alla PWA su reti 2G o 3G con problemi, era fondamentale che gli utenti si fidino dell'esperienza per funzionare, indipendentemente dai vincoli di rete. Per questo motivo, il team ha implementato un'esperienza offline utilizzando i service worker e una strategia cache-first-then-network. Inoltre, ha utilizzato il pattern PRPL per offrire agli utenti il caricamento istantaneo.
Adottando queste best practice, il team è stato in grado di ridurre il tempo di caricamento medio delle pagine (Tempo all'interattività) da 4 a meno di 2 secondi. Inoltre, ha utilizzato Lighthouse per assicurarsi che il sito rimansse così veloci. Questi sforzi hanno aiutato OpenSooq a totalizzare oltre 1,8 miliardi di visualizzazioni di pagina al mese.
Oltre un quarto dei nostri utenti accede alla PWA OpenSooq da reti medio-bassa, quindi l'affidabilità era essenziale per mantenere coinvolti questi utenti. I service worker e le strategie di memorizzazione nella cache ci hanno aiutato a creare l'esperienza utente affidabile di cui avevamo bisogno, senza problemi.
Amin Shoman, PWA Technical Manager, OpenSooq
Migliorare il ricoinvolgimento
Avendo creato un'esperienza affidabile e ad alte prestazioni, il team di OpenSooq voleva assicurarsi che gli utenti fossero sempre coinvolti con il prodotto. Per farlo, hanno consentito agli utenti di installare la PWA sulla loro schermata Home e hanno aggiunto il supporto per le notifiche significative. In questo modo il sito ha potuto notificare agli acquirenti l'interazione con i venditori per query e venditori relativi all'attivazione e alla scadenza degli annunci.
Questi miglioramenti hanno aumentato del 14% gli utenti attivi mensili dell'esperienza web di OpenSooq. Per gli utenti che hanno installato la PWA, si è verificato un aumento del 48% del numero di visite alla pagina per sessione e un aumento del 28% della durata media della sessione. OpenSooq ha anche registrato un aumento del 25% del tempo medio degli utenti su una pagina e un calo del 29% della frequenza di rimbalzo media in tutti i mercati.
Prospettive future
Dopo solo poche settimane di lavoro, OpenSooq ha creato una PWA completa da 23 kB, che offre un'esperienza coerente agli utenti su tutte le piattaforme e tutti i browser. Inoltre, poiché è facile aggiornare le funzionalità sul web, il team ha dato la priorità alle PWA lanciando e testando nuove funzionalità e nuovi flussi utente sulla PWA prima di distribuirli su altre piattaforme.
OpenSooq ora sta lavorando all'aggiunta di una richiesta di installazione specifica per la piattaforma e all'integrazione della PWA con Accelerated Mobile Pages (AMP). Questi miglioramenti accelereranno ulteriormente il caricamento delle pagine e renderanno il più semplice possibile la transizione all'app specifica per la piattaforma. Basandosi sulle basi del proprio lavoro di sviluppo iniziale, il team di OpenSooq continuerà a offrire agli utenti la migliore esperienza possibile.
L'importanza dello sviluppo della nostra PWA è stata chiara sia ai team dirigenziali che a quelli tecnici. Dopo aver creato un'app web moderna e resa efficiente, siamo entusiasti di vedere l'impatto del nostro investimento in 2,5 mesi per la nostra attività.
Ramzi Alqrainy, Chief Technology Officer, OpenSooq