Accueil » Blog » Application Mobile » Les piliers des PWA : le fonctionnement hors-ligne??

Continuons notre exploration des concepts fondamentaux des Progressives Web Applications (PWA) et intéressons-nous à l’intégration des fonctions de mise en cache et de pré-chargement du contenu.

Qu’apporte la gestion du cache à ma webapp ?

A l’ère du haut débit, la connectivité de bureau nous semble toujours là, nous sommes habitués à être toujours en ligne. Et quand nous ne le sommes pas et que nous voyons ces écrans d’erreur que vous connaissez bien, c’est un désastre.

Or les téléphones mobiles ne sont pas toujours en ligne. Vous avez peut-être activé le mode avion ou votre station de métro n’est pas desservie. Et même lorsque vous avez quatre barres, vous pouvez ne pas avoir de connexion suffisamment qualitative. Mais ce n’est pas seulement la non-connexion qui brise la confiance de l’utilisateur. Ce sont les connexions lentes et intermittentes qui affectent les utilisateurs tout autant.

Les utilisateurs ne s’attendent pas à ce que le Web fonctionne sans connexion réseau. Souvent, ils ne se donnent même pas la peine d’essayer lorsqu’il sont sur une connexion lente ou intermittente.

Grâce aux PWA vous pouvez changer cette perception des internautes ! Vous pouvez offrir une expérience unique et continue quel que soit l’état du réseau.

Mais pour cela vos Applications Web doivent être fiables. Car lorsque l’utilisateur appuie sur une icône son écran d’accueil, il s’attend à ce que celle-ci se charge instantanément et qu’elle se sera assurée que son fonctionnement sera optimal.

A quelle typologie de site s’adresse la gestion du mode « offline » ?

En fait, cela concerne tous les annonceurs qui souhaitent offrir une expérience utilisateur qui ne craint pas les pertes de connexion ou les fluctuations du réseau.

Cela peut aller du simple site corporate jusqu’aux sites de discussion instantanée souhaitant mettre en cache les discussions des internautes, en passant par les sites eCommerce qui souhaitent offrir une consultation optimale de leur catalogue et une expérience de préparation de commande robuste.

Comment rendre fiable ma Progressive Web App ?

Grâce aux technologies modernes du web que sont les « Services Workers » et « API cache » les sites ont maintenant la possibilité de configurer quels sont les contenus qui seront mis en mémoire sur les navigateurs des internautes (qu’ils soient sur mobile, tablette ou ordinateur) et à quel moment ces éléments seront chargés.

Par exemple un site de quelques pages peut décider de précharger l’intégralité de celles-ci dans le cache du navigateur permettant ainsi une expérience de navigation décorrélée de la qualité du réseau.

De même, un autre site pourra mettre en cache au fur et à mesure les pages visitées par les internautes. Ainsi lorsque l’internaute voudra revenir sur le site voir le produit qu’il a repéré, le contenu de cette page pourra être directement extraite du cache pour un affichage quasi instantané.

Autrement dit les sites ont désormais la maîtrise et la gestion du mode offline.

Quels sont les défauts de la gestion hors ligne des Progressive Web Apps ?

90%

des navigateurs sont actuellement compatible avec la technologie de gestion de la mise en cache des contenus

(https://caniuse.com/#search=cache)

Cela permet d’assurer la fiabilité de votre UX sur la majorité des devices.

Les principaux points de défaut de la gestion du cache dans les PWA sont que l’implémentation de Safari est (à l’heure actuelle) moins riche et plus contraignante.

En effet sur iOS il existe une limite pour la taille du cache de 50 Mo pour le “service worker”, mais cette limite permet déjà de couvrir la majorité des besoins de stockage. Et cela ne signifie pas que vous ne pouvez pas stocker plus de données, une solution simple est d’utiliser indexedDb qu’une semble pas limité sur iOS.
De même, toujours sur iOS, les Applications Web inutilisées et qui n’ont pas été ajoutées à l’écran d’accueil verront leurs ressources mises en cache purgées après 7 jours, mais si vos utilisateurs sont engagés et que vos leviers de fidélisation sont en place cela ne devrait pas vous poser de problèmes majeurs.

Par contre sur Android, Windows, MacOS & Linux la gestion du cache fonctionne correctement notamment si vous utilisez un navigateur moderne : Google Chrome (ou Chromium), Mozilla Firefox, ou encore Microsoft Edge Chromium.

Alors qu’en pensez-vous ? Est-ce que votre site ne gagnerait pas à assurer son fonctionnement quels que soient les conditions du réseaux ?

Cet article vous a plu ?

N’hésitez pas à le partager et le commenter, votre retour nous aide à écrire des articles plus pertinents pour vous. Et pour ne pas rater les suivants abonnez-vous à nos notifications en utilisant la petite ? en bas a gauche de votre écran.

Retrouvez le dossier complet sur les PWA :

Notification

Activez le bouton ci-dessous pour autoriser le site à vous envoyer des notifications.