Découvrez comment une petite équipe a réussi en créant une PWA de place de marché attrayante.
Basée à Amman, en Jordanie, OpenSooq est une place de marché de petites annonces pour mobile, qui propose une large gamme de produits et services dans 19 pays du Moyen-Orient et d'Afrique du Nord.
Problématique
Plus de 85% du trafic d'OpenSooq provient d'appareils mobiles, et ce chiffre ne cesse d'augmenter. Dans cette région, de nombreuses personnes utilisent des appareils d'entrée de gamme disposant d'une capacité de stockage limitée. Il est donc important que le site pour mobile d'OpenSooq soit aussi rapide et léger que possible. Cependant, les temps de chargement lents de l'ancien site mobile d'OpenSooq ont affecté la satisfaction client et ont entraîné des taux de rebond pouvant atteindre 49% sur des marchés tels que le Koweït.
Afin d'offrir à ses clients une expérience toujours meilleure sur toutes les plates-formes, l'entreprise a réalisé qu'elle avait besoin d'un site Web plus rapide et plus réactif. En juin 2017, l'équipe d'ingénieurs d'OpenSooq a donc lancé une progressive web app (PWA).
Priorité aux performances et à la fiabilité
Les trois développeurs internes d'OpenSooq ont pu créer une PWA complète à l'aide de React et d'un webpack en seulement deux mois et demi.
Pour s'assurer que le site serait rapide et facilement indexable par les moteurs de recherche, l'équipe a choisi d'implémenter le rendu côté serveur. Près de 28% des utilisateurs accèdent à la PWA sur des réseaux 2G ou 3G corrigés. Il était donc essentiel que les utilisateurs aient confiance en l'expérience de fonctionnement, quelles que soient les contraintes réseau. L'équipe a donc mis en œuvre une expérience hors connexion à l'aide de service workers et d'une stratégie réseau de mise en cache d'abord, puis réseau. Elle a également utilisé le modèle PRPL pour offrir un chargement instantané à ses utilisateurs.
En adoptant ces bonnes pratiques, l'équipe a pu réduire le temps de chargement moyen des pages (Time to Interactive) de quatre à moins de deux secondes. L'équipe a utilisé Lighthouse pour s'assurer que le site reste aussi rapide. Ces efforts ont permis à OpenSooq d'atteindre plus de 1,8 milliard de pages vues par mois.
Plus d'un quart de nos utilisateurs accèdent à la PWA OpenSooq depuis des réseaux de faible taille. La fiabilité est donc essentielle pour préserver l'engagement de ces utilisateurs. Les service workers et les stratégies de mise en cache nous ont aidés à créer, de manière fluide, l'expérience utilisateur fiable dont nous avions besoin.
Amin Shoman, responsable technique PWA, OpenSooq
Améliorer le réengagement
Après avoir créé une expérience performante et fiable, l'équipe d'OpenSooq voulait s'assurer que ses utilisateurs continuaient à interagir avec le produit. Pour ce faire, elle a permis aux utilisateurs d'installer la PWA sur leur écran d'accueil et a ajouté la prise en charge des notifications pertinentes. Cela a permis au site d'informer les acheteurs des interactions avec les vendeurs concernant les requêtes et les vendeurs au sujet de l'activation et de l'expiration des annonces.
Ces améliorations ont fait augmenter de 14 % le nombre d'utilisateurs actifs par mois de l'expérience Web d'OpenSooq. Pour les utilisateurs ayant installé la PWA, le nombre de visites de pages par session a augmenté de 48% et la durée moyenne des sessions a bondi de 28 %. OpenSooq a également constaté une augmentation de 25% du temps moyen passé par les utilisateurs sur une page et une baisse de 29% des taux de rebond moyens sur tous les marchés.
Perspectives d'avenir
Après seulement quelques semaines de travail, OpenSooq a créé une PWA complète de 23 Ko qui offre une expérience cohérente aux utilisateurs sur toutes les plates-formes et tous les navigateurs. De plus, comme il est facile de mettre à jour des fonctionnalités sur le Web, l'équipe a opté pour les PWA en lançant et en testant de nouvelles fonctionnalités et de nouveaux parcours utilisateur avant de les déployer sur d'autres plates-formes.
OpenSooq travaille actuellement à l'ajout d'une invite d'installation spécifique à la plate-forme et à l'intégration de la PWA dans le format Accelerated Mobile Pages (AMP). Ces améliorations vont encore accélérer le chargement des pages et rendre la transition vers l'application spécifique à la plate-forme aussi fluide que possible. En s'appuyant sur ses efforts de développement initiaux, l'équipe OpenSooq va continuer à offrir à ses utilisateurs la meilleure expérience possible.
La direction et les équipes techniques ont clairement compris l'importance de développer notre PWA. Après avoir créé une application Web moderne et l'avoir rendue performante, nous sommes ravis de constater l'impact commercial sur notre investissement de 2,5 mois.
Ramzi Alqrainy, directeur de la technologie, OpenSooq