La PWA (Progressive Web App) est en quelque sorte la forme d’application web la plus avancée technologiquement parlant. Loin d’être idéale, elle offre néanmoins des avantages considérables en particulier pour les utilisateurs d’Android. Investir dans une Progressive Web App peut donc s’avérer judicieux et économique, car ce format d’application mobile mêle les avantages d’une application native à la praticité du site web, le tout à des tarifs compétitifs.

Application Web progressive : le meilleur des applications mobiles

La PWA ou Progressive Web App, qu’on nomme application web progressive en français, est un format d’application web à vocation mobile conçue par les équipes de Google. Le fonctionnement d’une PWA est le même que toute application web, c’est-à-dire qu’elle s’exécute forcément dans un navigateur Internet, qu’il soit visible ou pas. 

Une PWA n’est pas une nouvelle structure ou une technologie novatrice. Il s’agit d’un ensemble d’améliorations pratiques apportées aux applications web classiques. En d’autres termes, une PWA ne diffère d’une application web que par les progrès tributaires de l’avancement naturel de cette technologie. De nos jours, la PWA est ce qui se présente de mieux en termes d’applications web. 

Ainsi, les applications Web progressives utilisent des API et des fonctionnalités de navigateur Web émergentes, couplées à une stratégie traditionnelle d’amélioration progressive.

Les améliorations propres aux PWA permettent de les rapprocher aux plus du point de vue de leur fonctionnement à une application de bureau ou mobile. D’un point de vue UX également, une PWA offre une expérience utilisateur intrinsèque aux applications mobiles/ de bureau.

L’expérience de ces applications web multiplateformes est donc similaire à celle d’une application native. L’objectif étant de ne laisser chez l’utilisateur aucun présage qu’une quelconque différence existe entre une PWA et toute autre application. 

Comme toute application web, la Progressive Web App se contente d’un développement unique pour tous les systèmes d’exploitation, est accessible sur  les navigateurs modernes, apparaît dans les recherches sur les moteurs et est donc référencée SEO.

Comme toute technologie, les PWA présentent des atouts mais aussi des inconvénients.

Les avantages clés d’une PWA :

Les PWA sont introduites par Google comme étant des sites web survitaminés, qui présentent tous les bons avantages d’une application web et d’une application native. 

Websites that took alle the right vitamins !

https://web.dev/progressive-web-apps/

Les avantages majeurs d’une PWA sont ses facilité et rapidité d’accès, d’utilisation et d’exécution, la possibilité d’avoir un icône d’application sur l’écran, l’utilisation en mode hors-ligne, l’expérience immersive comme pour une application native, les notifications… 

Pour aborder les atouts plus en détails, une PWA est : 

Sécurisée : Une PWA doit utiliser le protocole HTTPS pour protéger la confidentialité et l’intégrité des données échangées. A ce titre, elle fournit un mécanisme de livraison sécurisé qui empêche l’espionnage tout en garantissant que le contenu n’a pas été falsifié. Ceci est rendu possible en tirant parti du HTTPS et en développant les applications dans un souci de sécurité. Il est également facile pour les utilisateurs de vérifier et de s’assurer qu’ils installent la bonne application web, étant donné que l’URL de la PWA doit correspondre au domaine du site web. Ceci est très différent par rapport aux applications dans les App / Play Stores. En effet, plusieurs applications peuvent porter le même nom ce qui risque de confondre l’utilisateur, et même le résigner à ne pas télécharger l’application. Les applications Web éliminent donc cette confusion et garantissent aux utilisateurs la meilleure expérience possible sans souci de faille sécuritaire ni d’égarement.

Progressive : Une PWA peut fonctionner chez tous les utilisateurs (ou presque), tout dépend du navigateur utilisé. En effet, l’application web progressive doit  être conçue à l’aide de modèles d’amélioration progressive (progressive enhancement patterns). Effectivement, les PWA ne dépendent pas d’une seule API, elles associent plutôt diverses technologies pour atteindre l’objectif de fournir la meilleure expérience Web possible sur un maximum de navigateurs. Une PWA suit avant tout la règle d’amélioration progressive : elle utilise des technologies qui améliorent l’apparence et l’utilité de l’application web lorsque celles-ci sont disponibles. Mais si ces technologies ne sont pas à portée de main, les PWA offrent les fonctionnalités de base relatives à l’application web. Le recours à des améliorations pratiques en développement une PWA implique la création d’applications Web qui suivent de meilleures pratiques: présenter une application web inspirant la confiance et offrant des performances idéales, en plus de fonctionnalités du type application native. Développer une PWA garantit que les utilisateurs seront en mesure d’utiliser une application performante, mais ceux qui disposent de navigateurs modernes auront l’avantage de bénéficier d’encore plus de fonctionnalités progressives. L’élément clé requis pour les PWA est le support des Service Workers. Heureusement, les Services Workers sont désormais pris en charge sur quelques navigateurs modernes comme Firefox et Chrome, sur ordinateur de bureau et mobile. D’autres fonctionnalités telles que le manifeste d’application Web (Web App Manifest), les notifications push et la fonctionnalité Ajouter à l’écran d’accueil (icône sur écran) bénéficient également d’une large prise en charge sur les navigateurs.

Responsive : Une PWA doit s’adapter à n’importe quelle taille d’écran: toutes sortes d’ordinateurs, téléphones portables, tablettes, etc. Les applications Web responsives utilisent des technologies telles que les Media Queries et Viewport pour s’assurer que leurs interfaces utilisateur UI s’adaptent à n’importe quel facteur de forme. Une progressive web app est donc forcément conçue pour fonctionner sur tous les appareils des utilisateurs en offrant une expérience de visualisation optimale puisqu’elle s’adapte à toutes les tailles d’écrans. Elles offrent une lecture et une navigation faciles avec un minimum de redimensionnement, de défilement, et ce, sur une large panoplie d’appareils, passant par les téléphones mobiles, les tablettes aux ordinateurs de bureau. Étant progressive et responsive, les PWA garantissent aux utilisateurs une meilleure expérience, ce qui peut aider l’entreprise à atteindre les revenus et/ou l’engagement recherché. Par exemple, si le client va ajouter votre site web à son écran d’accueil comme étant une application, cela va faciliter l’accès donc accroître son engagement et par conséquent votre chiffre d’affaires. 

Ré-engageable : Une PWA devrait augmenter l’engagement grâce aux notifications push  par exemple afin de rappeler l’utilisateur de l’existence de la PWA et de le ramener aussi souvent que possible. Ceci se présente originellement comme étant l’un des principaux avantages des platesformes natives. La facilité avec laquelle les utilisateurs peuvent être réengagés en leur présentant des mises à jour et de nouveaux contenus, même lorsqu’ils ne sont pas en train de consulter l’application ou d’utiliser leurs appareils. Les applications Web modernes c’est-à-dire les PWA peuvent désormais le faire également en offrant la possibilité de réengager l’utilisateur comme le ferait une application native. C’est en utilisant de nouvelles technologies telles que les Service Workers pour contrôler les pages, l’API Web Push pour envoyer des mises à jour directement du serveur vers l’application via un service worker, et l’API Notifications pour générer des notifications système. Tout ceci aide à engager les utilisateurs lorsqu’ils n’utilisent pas activement leur navigateur Web ou leur PWA.

Installable: Une PWA permet à l’utilisateur de créer un raccourci sur son bureau initial ou son écran d’accueil à travers une icône personnalisée, sans aucune ressource du Store. C’est une option fondamentale et essentielle de l’expérience des applications Web progressive qui consiste à doter les utilisateurs avec des icônes d’applications sur leur écran d’accueil afin qu’il puissent appuyer directement dessus. Ceci leur permet d’ouvrir instantanément la PWA dans leur propre conteneur natif. Les applications Web progressives peuvent avoir cette impression d’application native via cette propriété de l’icône, couplée à un fonctionnement interne très similaire. C’est également possible via une fonctionnalité disponible dans les navigateurs de smartphones modernes appelée installation d’application Web (web app installation).

Partageable : Une PWA est facile à partager avec n’importe qui à travers seulement son URL tout en demeurant facile à installer. La PWA présente donc un avantage très apprécié. C’est tout simplement avoir la possibilité de créer un lien vers une application à travers une URL spécifique sans devoir passer par le Store ou par un processus d’installation complexe. 

Indépendance réseau – Sans Internet :  Il est possible d’accéder à l’application sur des connexions de mauvaise qualité ou même hors ligne. En effet, les applications web progressive peuvent fonctionner lorsque le réseau n’est pas fiable, faible, voire inexistant. Les objectifs de base visés par l’indépendance réseau sont de pouvoir:

  • Revisiter un site, revoir et recueillir son contenu même si aucun réseau n’est disponible ;
  • Parcourir tout type de contenu que l’utilisateur a auparavant visité (au moins une fois), même dans les situations de mauvaise connectivité extrêmes ;
  • Contrôler ce qui est montré à l’utilisateur dans les situations où il n’y a pas de connexion Internet.

Ceci est rendu possible via l’utilisation d’une combinaison de technologies : les Service Workers pour contrôler les requêtes de page (les stocker hors ligne par exemple), l’API Cache pour stocker les réponses aux requêtes réseau hors ligne (très utile pour stocker les actifs du site) et les technologies de stockage de données côté client telles que Web Storage et IndexedDB qui permettent de stocker les données d’application hors ligne.

Mise à jour automatique et déploiement instantané : L’utilisateur n’aura à télécharger aucune mise à jour. Puisqu’il s’agit d’un site Web, toutes les mises à jour doivent se faire et se passent automatiquement en arrière-plan. Au même titre qu’un site web (une PWA est un site web), il suffit de faire la mise à jour sur le serveur pour déployer la PWA. 

Détectable : Une PWA doit être identifiée comme étant une application. Toute PWA sera détectable grâce au manifeste W3C et à un registre de Service Workers approprié. Il est de ce fait possible aux moteurs de recherche de les identifier. L’objectif final est que les progressive web app soient mieux représentées dans les moteurs, qu’elles soient plus faciles à exposer, à cataloguer et à classer, et qu’elles aient des métadonnées utilisables par les navigateurs pour leur donner des capacités spéciales. Les PWA dispose également des possibilités de référencement dont profite tout site web (une PWA est un site web) sur les moteurs de recherches. Certains évoquent même que les PWA soient mises en avant par le moteur de recherche Google. 

App like : En utilisant une PWA l’utilisateur doit avoir la même expérience et la même sensation sur toute autre application native/hybride: icône sur l’écran d’accueil, design, affichage plein écran, fonctionnalités, utilisation,… Ceci est rendu possible notamment à travers le modèle App Shell.

Les inconvénients d’une PWA :

Comme toute technologie, les PWA ne cumulent pas que des avantages. Compte tenu de certains facteurs, les progressive web apps présentent certaines limites, à savoir : 

Des fonctionnalités limitées : 

L’accès aux fonctionnalités du dispositif digital (smartphone, tablette…) reste limité à un sous-ensemble contrairement aux applications natives. 

A titre d’exemple, ces fonctionnalités ne sont pas disponibles pour les PWAs :

  • Les push sur iOS,
  • Les fonctionnalités innovantes (Machine Learning, Réalité Augmentée),
  • Les extensions (Siri, widget, quick action, watch, etc.).

Support incomplet et format non standardisé : 

Les PWA sont utilisables sur la plupart des navigateurs modernes, mais ne sont pas supportés par les anciennes versions. De plus, les fonctionnalités disponibles ne sont pas les mêmes d’un navigateur à un autre : elle s’approche d’une application régulière sur Chrome. 

La technologie étant conçue et portée chez Google, elle est encore loin d’être un standard. Si Microsoft est jusque-là partisan et supporte le format PWA, c’est totalement le contraire du côté de Mozilla par exemple. L’équipe est allée jusqu’à annoncer la non prise en charge des progressive web apps par le navigateur.

Pour la marque à la Pomme, les PWA sont opérationnelles mais elles sont encore limitées dans leurs fonctionnalités (absence de notifications Push) étant donné qu’Apple limite leur intégration d’une manière viable. Il manque principalement la gestion des notifications push ainsi que la synchronisation à l’arrière-plan. 

Les PWAs sont également absentes de l’App Store, il sera donc impossible d’y faire référencer une PWA. Apple témoigne d’une politique stricte sur ce point : les PWA ne sont pas des applications mais des sites web, rien ne justifierait donc leur présence sur l’App Store.

Un avenir prometteur pour les PWAs ?

En dépit des obstacles observés, peut-on confirmer que l’avenir appartient aux PWAs ? Étant donné que la majorité des mobinautes naviguent sur Android, la PWA est une véritable technologie d’amélioration des plateformes numériques. Les PWA permettent l’augmentation des conversions, la finalisation du tunnel d’achat, la diminution du taux de rebonds, augmentation du nombre de sessions via un appareil mobile et même la réduction du temps nécessaire à l’interactivité de la page. Tout ceci, en plus des avantages clés d’une PWA, n’empêche pas qu’elle présente des contraintes concernant la disparité des plateformes et certaines fonctionnalités complexes à l’instar des jeux 3D ou la réalité virtuelle.