Ecma-Tech
Développement webComprendre

Progressive Web App (PWA) : à quoi ça sert et comment ça marche ?

Ecma-Tech--7 min de lecture

Vous avez peut-être déjà vu un site vous proposer de "l'installer" sur votre téléphone ou votre ordinateur. Pas via l'App Store ou le Play Store, mais directement depuis le navigateur. Ce sont des Progressive Web Apps, ou PWA. Derrière ce terme se cache une idée simple : faire en sorte qu'un site web se comporte comme une application.

C'est quoi une PWA, concrètement ?

Une PWA, c'est un site web auquel on ajoute des capacités supplémentaires. Vos utilisateurs peuvent l'installer sur leur écran d'accueil, l'utiliser même sans connexion internet, et recevoir des notifications. Le tout sans passer par un store et sans téléchargement.

Trois caractéristiques la distinguent d'un site classique :

  • Elle fait plus qu'un site : géolocalisation, notifications push, accès à la caméra, stockage local. Les navigateurs modernes donnent accès à des fonctionnalités qui étaient réservées aux applications mobiles il y a quelques années.
  • Elle fonctionne même sans réseau : plutôt qu'une page d'erreur, vos utilisateurs voient une version allégée de l'application avec les données déjà consultées. Dès que la connexion revient, tout se met à jour automatiquement.
  • Elle s'installe en un clic : l'utilisateur l'ajoute à son bureau ou son écran d'accueil. L'application s'ouvre ensuite dans sa propre fenêtre, sans barre d'adresse, comme n'importe quelle application.

Les trois caractéristiques d'une PWA : fonctionnalités avancées, mode hors ligne, installation
Les trois caractéristiques d'une PWA : fonctionnalités avancées, mode hors ligne, installation

Comment ça fonctionne côté utilisateur ?

Pour l'utilisateur, c'est transparent. Il visite votre site normalement. Au bout de quelques visites, le navigateur lui propose d'installer l'application. S'il accepte, une icône apparaît sur son bureau ou son écran d'accueil. Il clique dessus, l'application s'ouvre dans sa propre fenêtre. C'est aussi simple que ça.

Les mises à jour se font automatiquement, côté serveur. Pas besoin de télécharger une nouvelle version depuis un store. Quand vous corrigez un bug ou ajoutez une fonctionnalité, c'est disponible dès la prochaine ouverture.

Une PWA s'installe depuis le navigateur et s'ouvre comme une application classique
Une PWA s'installe depuis le navigateur et s'ouvre comme une application classique

Le mode hors ligne : l'atout principal

Le vrai intérêt de la PWA pour vos équipes ou vos clients, c'est de fonctionner sans connexion internet. Les données consultées lors des visites précédentes sont stockées localement. Si le réseau coupe, l'application reste utilisable.

C'est un avantage concret dans plusieurs situations :

  • Des commerciaux en déplacement qui consultent un catalogue ou saisissent des commandes dans des zones mal couvertes
  • Des techniciens sur le terrain qui remplissent des rapports d'intervention
  • Un outil interne utilisé dans des locaux avec un wifi instable

Dès que la connexion revient, les données se synchronisent.

PWA ou application mobile : comment choisir ?

La PWA ne remplace pas toujours une application mobile. Les deux répondent à des besoins différents.

CritèrePWAApplication mobile
DistributionLien URL, pas de storeApp Store / Play Store
InstallationOptionnelle, un clicTéléchargement obligatoire
Mises à jourInstantanées, côté serveurSoumises à validation du store (24-48h)
Coût de développementUn seul code pour tous les supportsPlus élevé (iOS + Android)
Commission sur les ventesAucune15 à 30% (Apple/Google)
Accès au matériel (Bluetooth, NFC)PartielComplet

La PWA est adaptée quand :

  • Vos utilisateurs accèdent au service depuis différents appareils (PC, tablette, mobile)
  • Vous voulez éviter les délais de publication sur les stores
  • Votre budget ne permet pas de développer une application native en plus du site web
  • Vous n'avez pas besoin d'un accès avancé au matériel du téléphone

On a suivi cette approche sur des projets comme Courtageo (plateforme de courtage immobilier) ou Skreept (plateforme d'apprentissage), où les utilisateurs travaillent aussi bien sur un ordinateur que sur leur téléphone.

L'application native est préférable quand :

  • Vous ciblez le grand public et voulez être présent sur les stores
  • Vous avez besoin du Bluetooth, du NFC, ou de fonctionnalités matérielles avancées
  • Les performances sont critiques (jeux, vidéo, 3D)

Dans certains cas, on combine les deux : un outil web pour la gestion et une app mobile pour le terrain.

Comparatif PWA vs application native selon les besoins du projet
Comparatif PWA vs application native selon les besoins du projet

Les limites à connaître

Quelques points à garder en tête avant de se lancer :

  • Apple traîne un peu : sur iPhone, les PWA fonctionnent mais certaines fonctionnalités arrivent plus tard que sur Android (les notifications push n'ont été ajoutées qu'en 2023). L'expérience d'installation est aussi moins visible que sur Chrome.
  • Pas de présence sur les stores : vos utilisateurs ne vous trouveront pas en cherchant sur l'App Store. La PWA se découvre via votre site web ou un lien direct.
  • Certains usages restent hors de portée : si votre application a besoin du NFC, du Bluetooth avancé ou d'un accès aux contacts du téléphone, la PWA ne suffira pas.

Le bon côté : si le navigateur ne supporte pas une fonctionnalité, le site continue de marcher normalement. L'utilisateur ne perd rien, il n'a simplement pas accès aux extras.

En résumé

La PWA est un bon choix quand vous voulez donner à vos utilisateurs une expérience proche d'une application sans le budget et les délais d'un développement mobile. C'est une brique qu'on ajoute à un projet de développement web existant, et qui peut évoluer vers une app native si le besoin se confirme.

Un projet web qui pourrait profiter du mode offline ou de l'installation ? Parlons-en.

Cet article vous intéresse ? Découvrez nos services de développement web ou consultez nos réalisations clients.

Un projet en tête ?

Discutons ensemble de vos besoins et trouvons la solution la plus adaptée.