Innovations et Technologies

La petite révolution des « Progressive Web Apps ».

4 juin 2019

Depuis quelques années, il y a une nouvelle venue dans le monde du développement mobile, c’est la « Progressive web app », une application qui se lit sur navigateur et qui possède beaucoup plus d’avantages qu’une application mobile classique.

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

Une PWA (Progressive Web App), va combiner les technologies du web (HTML, CSS, JavaScript) et les fonctionnalités d’une application native (notifications push, vision plein écran, géolocalisation etc.). Elle est mobile-first, lisible depuis un navigateur, possède un URL et elle est responsive sur tous les écrans (mobile, tablette, PC). Aujourd’hui la PWA représente un vrai croisement entre la web App (Hotmail, Google Drive) et le site web mobile.

Comment fonctionne-t-elle ?

Pour commencer elle utilise un script « Service Workers », qui va donner l’accès à des fonctionnalités comme l’envoi de notifications push, la mise à jour du contenu en arrière-plan ou encore l’utilisation hors-ligne.

Basée sur un modèle « App Shell » elle fournit une enveloppe de l’UI de base avant la mise en place des données. On sépare donc le contenu et la structure de l’application pour gagner en temps de chargement.

Enfin elle utilise un « manifest.json », un fichier qui lui permet de créer un raccourci sur la page d’accueil depuis le navigateur, et non plus après installation depuis le Store ! Cette manipulation est facilement réalisable sur Android, tandis que sur iOS il faut ruser un peu ou épingler son site.

Il faut savoir qu’iOS a fait beaucoup d’effort récemment pour intégrer les PWA. En effet le système d’exploitation offre par exemple beaucoup plus d’accès aux outils du smartphone (géolocalisation, gyroscope) et améliore l’expérience utilisateur. Les fonctionnalités du « manifest » ne s’arrêtent pas là puisqu’il permet de rendre un aspect plus natif à l’application via la possibilité de tourner l’écran, d’effectuer un affichage sans barre d’adresse ou encore d’en changer la couleur.

Enfin, conjointement à ces fichiers, on peut coder notre « Progressive Web App » comme un site web classique, avec de l’HTML, du JavaScript et du CSS.

Quels sont les avantages d’une Progressive Web App ?

Voyons ensemble les avantages d’une PWA face à une application native classique :

  • On n’a pas besoin d’installer une PWA, on y accède via son URL.
  • On peut mettre l’icône d’une PWA en raccourci sur l’accueil d’un téléphone depuis le navigateur sans avoir à l’installer.
  • La PWA représente un gain d’argent car elle n’est développée qu’une fois, alors qu’une app native a besoin d’être développée pour Android et iOS.
  • Grace à sa mise en cache partielle, l’utilisateur ne la re-télécharge pas à chaque fois qu’il l’utilise.
  • La PWA a un référencement ! Et oui, grâce à son URL, elle est référencée par Google, elle est donc SEO-friendly.
  • Elle est utilisable sans connexion internet.
  • Elle est sécurisée (HTTPS), et responsive (PC, Tablette, Portable).

 

Citons maintenant les inconvénients :

  • Malgré les progrès effectués, iOS reste un peu à la traîne.
  • Parmi les navigateurs, Chrome fait office de bon élève, mais les autres mettent du temps à s’adapter à la PWA.
  • Malgré ses nombreuses fonctionnalités, elle offre des possibilités limitées en termes d’UX et d’UI, notamment en 3D.

 Les PWA vont-elles remplacées le marché des développeurs natifs ?

C’est Google via Android qui, le premier, a flairé le filon des PWA. En effet il rend peu à peu disponible toutes les fonctionnalités des applications natives aux PWA, et ce depuis déjà quelques années. Elles se retrouvent aujourd’hui dotées de nombreux avantages comme nous venons de la voir (réduction des coûts, gestion de cache, référencement) mais également du meilleur des applications natives (notifications push, icônes, mode plein écran).

On peut donc apercevoir une fin plus ou moins proche des développeurs natifs, qui devront se mettre à la page !

A noter cependant qu’iOS n’a pas été aussi rapide qu’Android à doter les PWA de fonctionnalités natives sur son système. Il se rattrape donc en ce moment, en les supportant de mieux en mieux à chaque mise à jour, avec des avancés quasiment chaque mois.

Le métier de développeur natif a donc perdu une partie de son marché, mais ils ne vont pas disparaître du jour au lendemain, cependant il devra désormais travailler, afin de concurrencer les PWA, sur des applications plus poussées, en cherchant les dernières fonctionnalités que les PWA ne supportent pas encore.

Conclusion

Grâce à ses URLs, sa rapidité de chargement, ses fonctionnalités et son Design mobile, le PWA semblent être le futur des applications.  Et pour preuve « Twitter Lite », qui a mis en place une PWA pour son expérience mobile, et a vu son taux de rebond baisser de 20% et son nombre de tweets augmenter de 75%. D’autres ont aussi eu cette initiative, comme Tinder, Pinterest ou encore Lancôme.

Au vu de ces bons résultats, les navigateurs et autres plateformes ont fait récemment beaucoup d’effort afin de supporter et d’ajouter toujours plus de fonctionnalités aux PWA, c’est donc une technologie qui évolue et qui pourrait, à terme, supplanter le marché des applications.

L'auteur Florian Grandvallet

Co-Founder

Florian Grandvallet
Postuler à l'annonce Postuler à toutes les annonces Ingénieur système linux orienté web
ou
Remplissez le formulaire
C'est tout bon

On vous recontact au plus vite !
En attendant, vous pouvez toujours consulter nos autres jobs !

rotate screen

Retourner votre tablette pour une meilleure navigation