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 nos autres articles sur les PWA :