Une Application Web Progressive est une application web visant à réduire l'écart entre les applications mobiles et les sites web.

La PWA permet de mieux traiter l'expérience hors-ligne et d'accélérer les temps de chargement sur des visites successives. Présentées comme les remplaçantes des applications mobiles, il est possible aujourd'hui de les installer via le Google Play Store sur Android. Cependant à l'heure où j'écris ces lignes Apple continue de freiner cette possibilité afin de garder un certain contrôle sur les parutions.

C'est donc une autre possibilité de réaliser des applications mobiles. Pour ma part, je les compare toujours à ma deuxième solution favorite, à savoir react native.

Qu'est-ce qu'une Progressive Web App ?

Concrètement, une PWA est une application qui possède un fichier manifest permettant de donner certaines informations sur sa composition. À cela, cette application enregistre un service worker, une sorte de middleware agissant comme un reverse proxy permettant d'effectuer des actions avant ou après que les requêtes soient parties de l'application vers le réseau.

On va donc pouvoir mettre en cache dans le navigateur web certains éléments comme les pages HTML ou les fichiers Javascript composant l'application, on obtient dès lors une vrai expérience offline.

Plutôt cool ! Mais alors comment choisir si on utilise une PWA ou une application mobile native ?

Dans quel cas utiliser une PWA plutôt que react native ?

Cette liste est non-exhaustive et donne une idée permettant d'aider à se décider sur le choix de la technologie pour réaliser son application.

  1. Vous devez réaliser une application qui devra posséder un homologue web/bureautique et vous ne souhaitez pas développer un deuxième projet.
  2. Vous ne souhaitez pas recourir à une parution sur les stores officiels.
  3. Vous souhaitez utiliser les composants et les librairies du web pour développer votre application.
  4. Vous souhaitez simplement mettre à jour votre application sans recourir à des technologies tel que Microsoft Codepush.
  5. Vous n'avez pas de contraintes de performances extrêmes.
  6. Vous n'avez pas de gros volumes de données à stocker, les navigateurs ayant chacun leurs propres limites.

Bien évidemment, ses préférences et compétences personnelles sont à prendre en compte et pèse un poids important dans la balance du choix de la technologie.

Pour réaliser des PWA avec ReactJS l'idéal est d'utiliser NextJS et le plugin next-offline ou bien d'utiliser GatsbyJS. Cela permettra d'y gagner grandement en rapidité et profiter d'autres avantages tels que le rendu côté serveur ou la génération de site statique.