lun. 1 mars 2021

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

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

Entre la web app classique et l’application native, la Progressive Web App ou PWA gagne du terrain dans le cœur des créateurs d’application. Elle offre une alternative intéressante aux applications natives et répond à certaines limitations techniques des navigateurs web. Quelles sont ces fonctionnalités qui la rendent si séduisante ?

Avant de regarder plus en détail la Progressive Web App, c’est l’heure d’un rappel des principaux types d’application.

La web app (ou application web) est un site web avec du contenu interactif, responsive et optimisé pour une consultation depuis un navigateur. Elle se consulte depuis tous les appareils au sein d’un navigateur web.

L’application native est une application développée dans le langage propre à un système d’exploitation (iOS ou Android, majoritairement). Elle est généralement téléchargée via des app stores (App Store, Play Store) et elle accède aux fonctionnalités natives des appareils mobiles comme l’appareil photo, le GPS… L’expérience utilisateur et la performance font partie de ses plus grandes qualités.

L’application hybride est un site web empaqueté sous la forme d’une application mobile. Elle est donc disponible depuis les app stores, mais à l’intérieur, c'est bien du web intégré sous la forme d’une web view.

Caractéristiques de la Progressive Web App

Si la Progressive Web App plaît tellement, c’est parce qu’elle offre le meilleur du web et de l’application native.

Elle se consulte comme un site web classique depuis un navigateur web, mais elle offre les avantages d’une expérience utilisateur similaire à celle d’une application mobile, à savoir :

  • Elle ne nécessite pas d’installation et peut être ajoutée à l’écran d’accueil de l’appareil.
  • Elle est disponible hors connexion : lors de la première utilisation, ses données sont mises en cache dans le navigateur. Par la suite, il est possible de la consulter sans connexion ou dans des zones à faible connexion Internet.
  • Elle se charge plus rapidement qu’une web app classique.

Comment fonctionne une Progressive Web App ?

La Progressive Web App c’est avant tout une web app. Elle est développée à partir des technologies web ((HTML5, CSS3, Angular ou React). Elle possède un domaine sécurisé HTTPS, un ou plusieurs service workers et un fichier manifest qui contrôle la manière dont elle apparaît aux utilisateurs.

Les Service Workers sont un script que le navigateur exécute en arrière-plan sur un appareil mobile. Il fournit une couche intermédiaire entre la web app et le réseau, qui tourne en arrière-plan (même quand l’application est fermée). Grâce aux services workers, la PWA offre une expérience déconnectée et de meilleures performances qu’une web app.

Pourquoi choisir la Progressive Web App ?

La Progressive Web App offre de nombreux avantages qui la positionne comme un futur possible des applications mobiles.

Elle est facile à installer

Contrairement à une application native, l’utilisateur n’a pas besoin d’installer l’application pour la consulter. Il suffit de cliquer sur son URL pour accéder à son contenu depuis un navigateur.

Elle est facile à déployer

Côté créateurs d’applications, c’est également plus simple : la Progressive Web App n’a pas besoin d’être publiée sur les app stores. Il n’y a donc aucune vérification, ni contraintes qui pèsent sur le contenu de l’application. Le process de déploiement est plus rapide, plus simple et de même pour les mises à jour.

Pour qu’elle soit plus visible, la Progressive Web App peut être ajoutée au Play Store en version bêta et être trouvée par une recherche classique.

Elle peut être ajoutée à l’écran d’accueil

L’utilisateur a la possibilité de rajouter la Progressive Web App à l’écran d’accueil de son appareil mobile. Cela est rendu possible par le fichier manifest qui attribue à l’app une icône et un nom unique, ainsi qu’un écran de chargement.

Cette manipulation est néanmoins moins facile que pour l’application native.

Elle est consultable en plein écran

Un autre avantage proche est sa consultation immersive et adaptée mobile.

Lorsqu’elle est lancée depuis le raccourci, l’app s’affiche dans le navigateur en mode plein écran.

Elle est disponible hors ligne

C’est l’un des plus gros atouts de la Progressive Web App. Lors de la première visite, les données sont mises en cache dans le navigateur grâce aux services workers. Le contenu de la PWA est alors consultable sans connexion Internet et sans délai. Plus de soucis de mauvaise couverture réseau !

Elle fonctionne sur tous les appareils

La PWA fonctionne via un navigateur sur mobile, tablette ou ordinateur.

Elle est performante

La Progressive Web App bénéficie de temps de chargement raccourcis grâce à la mise en cache et elle utilise moins de ressources que l’application native.

Elle est sécurisée

La Progressive Web App bénéficie d’un protocole HTTPS qui permet son utilisation pour tout type de site et de données.

Les inconvénients de la Progressive Web App

Tout n’est pas rose dans le monde de la Progressive Web App.

Tous les navigateurs web ne sont pas compatibles

Même si la plupart des derniers navigateurs la supportent, tous les navigateurs ne sont pas compatibles les fonctionnalités de la Progressive Web App comme les services workers. Il y a notamment de fortes disparités entre iOS et Android.

Sur iOS, seul Safari est le navigateur qui peut-être utilisé pour bénéficier de certaines fonctionnalités liées à la PWA comme ajouter le raccourci à l’écran d'accueil. Sur les autres navigateurs, elle fonctionne comme une web app.

Sur ordinateur, les PWA fonctionnent de façon similaire aux applications. Ils sont disponibles sous Chrome OS, Windows, Linux, et MacOS.

Certaines fonctionnalités sont limitées

Même si la Progressive Web App permet d’accéder à plus de ressources système que la web app comme l’appareil photo ou le GPS, toutes les fonctionnalités ne sont pas accessibles comme par exemple le Bluetooth ou le NFC.

Créer une Progressive Web App

Pour conclure, la Progressive Web App a des avantages et des inconvénients, c’est à vous de faire le point en fonction de vos objectifs.

Côté développement, vous pouvez créer une Progressive Web App sans aucune ligne de code. C’est l’un des formats proposés par PandaSuite aux côtés de l’application native et de la web app.

Pour créer une PWA, activez l’usage des Services Workers et le Téléchargement intégral de l’application depuis votre dashboard.

Choisissez une icône, un nom et un écran de chargement, le tour est joué !

Partager cet article

Commencez gratuitement

Rejoignez plus de 25 000 utilisateurs dans le monde. Pas d'inquiétude, PandaSuite est gratuit autant de temps que vous voulez.

Essayer gratuitementContactez-nous
PandaSuite Studio