Qu'est-ce qu'une PWA ? Guide pour développeurs en 2026

Qu’est-ce qu’une PWA ? C’est une application web progressive : un site web construit avec des technologies web standard qui se comporte comme une application native : elle s’installe, s’ouvre dans sa propre fenêtre avec une icône et peut fonctionner hors ligne. MDN la définit comme « une application construite avec les technologies de la plateforme web, mais qui offre une expérience utilisateur comparable à celle d’une application native » (MDN, décembre 2025). Deux fichiers font l’essentiel du travail : un manifeste d’application web, qui décrit l’application, et, pour l’usage hors ligne, un service worker.

Ce qu’est une application web progressive

Une PWA est une application web qui garde les propriétés d’un site web et en ajoute certaines d’une application native. Selon MDN, elle conserve d’un site web une base de code unique pour tous les systèmes d’exploitation et l’accès direct depuis le web. Des applications natives, elle reprend l’installation (depuis une boutique d’applications ou directement depuis le web), le lancement en application autonome avec une icône, le fonctionnement hors ligne et en arrière-plan, l’affichage plein écran sans interface du navigateur, et l’intégration au système, comme les cibles de partage.

Une PWA, c’est un site normal plus deux fonctionnalités techniques :

• le manifeste d’application web, un fichier JSON que le navigateur lit pour connaître le nom de l’application, ses icônes et la manière de l’ouvrir ;
• un service worker, un script qui contrôle les pages de l’application et, selon les mots de MDN, peut récupérer des ressources sur le serveur et les ajouter à un cache local.

Web.dev décrit la même idée : une PWA utilise l’amélioration progressive pour offrir une expérience plus fiable et plus intégrée, et elle peut être installée (web.dev, septembre 2024).

Ce qui rend une PWA installable

C’est le navigateur qui décide si une application est installable, et les critères varient. Pour les navigateurs basés sur Chromium (Chrome, Samsung Internet, Edge), MDN énumère ces conditions (MDN, Making PWAs installable, octobre 2026) :

Chrome attend aussi une interaction avant de déclencher l’événement beforeinstallprompt : l’utilisateur doit avoir cliqué ou touché la page au moins une fois et l’avoir consultée pendant au moins 30 secondes (web.dev, septembre 2024).

Le service worker ne figure pas dans la liste. MDN précise qu’il n’est pas requis pour l’installation, même si beaucoup de PWA s’en servent pour l’usage hors ligne. Un manifeste minimal qui respecte le tableau ressemble à ceci :

{
  "name": "My PWA",
  "short_name": "MyPWA",
  "start_url": "/",
  "display": "standalone",
  "icons": [
    { "src": "/icons/192.png", "type": "image/png", "sizes": "192x192" },
    { "src": "/icons/512.png", "type": "image/png", "sizes": "512x512" }
  ]
}

Reliez-le depuis chaque page avec <link rel="manifest" href="/manifest.webmanifest">.

Comment une PWA fonctionne hors ligne

Un service worker rend l’usage hors ligne possible en interceptant les requêtes réseau et en répondant depuis un cache. Enregistrez-le depuis votre page, puis traitez l’événement fetch dans le worker. Voici le modèle « cache d’abord » de MDN, raccourci :

// dans la page
if ('serviceWorker' in navigator) {
  navigator.serviceWorker.register('/service-worker.js');
}

// service-worker.js
self.addEventListener('fetch', (event) => {
  event.respondWith(
    caches.match(event.request).then((cached) => cached || fetch(event.request))
  );
});

Cet exemple sert depuis le cache et se rabat sur le réseau, mais il ne remplit jamais le cache ; l’exemple complet de MDN ajoute l’étape d’écriture et une page de secours. MDN note aussi que « cache d’abord » risque davantage de renvoyer une réponse périmée, alors que « réseau d’abord » se rabat sur le cache quand l’appareil est hors ligne, et que la meilleure stratégie dépend de l’application. Les service workers sont Baseline largement disponibles (depuis octobre 2020, avec Chrome 45, Firefox 44 et Safari 11.1 comme premières versions, selon web-features 3.44.0).

Les différences entre iOS et Android

Android et iOS installent tous deux les PWA, mais ils diffèrent dans la manière et sur quelques fonctionnalités. En octobre 2026, selon MDN, Apple et web-features :

Trois points d’iOS comptent pour les développeurs :

• beforeinstallprompt n’est pas pris en charge sur iOS, selon MDN, donc vous ne pouvez pas afficher votre propre bouton d’installation. Expliquez plutôt les étapes du menu Partager dans votre interface ; web.dev note que les designers ajoutent souvent ce type d’écran.
• Depuis iOS 26, « chaque site web ajouté à l’écran d’accueil s’ouvre comme une application web » par défaut, et l’utilisateur peut désactiver « Ouvrir comme application web » même si le site a un manifeste (blog WebKit, 9 juin 2025).
• Les notifications push web sur iOS et iPadOS sont disponibles pour les applications web de l’écran d’accueil depuis iOS 16.4. Un site compte comme application web de l’écran d’accueil quand son manifeste définit display sur standalone ou fullscreen, et la demande d’autorisation doit venir d’un geste de l’utilisateur (blog WebKit, 16 février 2023). Web-features classe Push comme Baseline nouvellement disponible depuis mars 2023 et largement disponible depuis septembre 2025, avec Safari 16 et Safari iOS 16.4 comme premières versions.

Les détails de l’ajout à l’écran d’accueil changent à chaque version d’iOS ; vérifiez la version que vous prenez en charge.

Exemples de PWA

Le guide des PWA de web.dev cite des entreprises qui ont publié des résultats après le lancement d’une PWA ; les chiffres sont les leurs, recueillis par web.dev (septembre 2024, web.dev) :

Ce sont des résultats que ces entreprises communiquent pour leurs propres produits.

PWA ou application native

Une règle pratique : choisissez une PWA quand une seule base de code web et la distribution depuis le web comptent avant tout, et une application native quand vous avez besoin de fonctionnalités de plateforme que le web n’offre pas. MDN indique qu’une PWA peut aussi être distribuée par les boutiques d’applications, donc les deux options ne s’excluent pas. Si vous publiez une application native à côté de votre site, les liens peuvent l’ouvrir directement ; la configuration est décrite dans liens universels et App Links Android.

Tester une PWA sur mobile

Testez une PWA en trois passes : DevTools pour les fichiers, un vrai téléphone pour l’installation, et une vue à la taille d’un mobile pour la mise en page.

1. DevTools : dans le panneau Application de Chrome DevTools, le volet Manifest affiche les champs et les icônes de l’application, et une section Installability décrit l’erreur si quelque chose cloche. Le volet Service Workers comporte une case Offline qui met DevTools en mode hors ligne (Chrome for Developers). Les tests PWA de Lighthouse sont dépréciés (page mise à jour en avril 2024) ; utilisez donc le panneau Application.
2. Un vrai téléphone : installez l’application depuis le navigateur, passez le téléphone en mode avion et ouvrez l’application depuis son icône. Faites-le sur iOS et sur Android, car le parcours d’installation et le comportement des notifications diffèrent.
3. Tailles mobiles : vérifiez les pages aux largeurs de téléphone, comme pour tout site mobile, avec le guide pour rendre un site web compatible mobile et la liste de contrôle des tests de site mobile ; pour iOS sans appareil, voir tester sur un iPhone sans iPhone.

Mobile View Extension recharge l’onglet courant avec le user agent, la taille d’écran et le ratio de pixels d’un téléphone ; c’est donc un moyen rapide de voir les pages de votre PWA aux tailles mobiles. Il ne peut pas installer une PWA ni exécuter les service workers et le mode autonome comme le fait un téléphone : il utilise le moteur de Chrome sur ordinateur, avec une entrée à la souris, et n’affiche pas le comportement de l’écran d’accueil. Utilisez un téléphone pour les tests d’installation et de mode hors ligne. La vitesse est traitée à part dans le guide de test de vitesse mobile.

Questions fréquentes

Qu’est-ce qu’une PWA, en termes simples ?

Une PWA est un site web qui peut être installé sur un appareil et utilisé comme une application. Elle est construite avec des technologies web ordinaires, et un manifeste et un service worker apportent le comportement installé et hors ligne.

Quelles sont les conditions pour une PWA ?

Pour l’installation dans les navigateurs Chromium : HTTPS, un manifeste avec un nom, une icône de 192 px et une de 512 px, start_url et display, et prefer_related_applications non défini sur true. Un service worker n’est pas requis pour être installable, mais il est nécessaire pour l’usage hors ligne.

Les PWA fonctionnent-elles sur iPhone ?

Oui. Depuis iOS 16.4, elles s’installent depuis le menu Partager de Safari, Chrome, Edge, Firefox et Orion, et les applications web de l’écran d’accueil peuvent recevoir des notifications push web. Il n’existe pas de beforeinstallprompt sur iOS : les utilisateurs installent donc via le menu Partager.

Une PWA peut-elle fonctionner hors ligne ?

Oui, lorsqu’un service worker met en cache les pages et les fichiers dont elle a besoin. Sans service worker, l’application peut quand même être installée dans les navigateurs Chromium, mais elle n’a pas de gestion propre du mode hors ligne.