Progressive web application

Imaginez un monde sans App Store ou Google Play store. Un monde où il n’y aurait plus besoin d’installer d’applications sur votre téléphone mais juste à appuyer sur un bouton dans votre navigateur pour l’utiliser depuis votre écran principal. Un rêve qui devient accessible avec l’évolution des navigateurs et la puissance des smartphones, véritables ordinateurs de poche au vu des caractéristiques techniques des nouveaux modèles.

• Qu’est-ce qu’une progressive web app ?
• Avantages du PWA
• Interactions possibles
• Push notifications
• Beacons, Bluetooth et NFC
• Géolocalisation
• Photo et vidéo
• Offline
• Exemples de progressive web app
• Guitar turner
• Paper Planes

Une application progressive est conçue pour répondre au besoin d’interface fluide. L’idée est de se rapprocher le plus possible d’une application mobile tout en restant dans le navigateur et en utilisant les standards du web. La différence entre une PWA et un site mobile réside notamment sur l’apparence que l’application va dégager.

Sur un site web responsive, l’aspect du web est souvent très marqué. La progressive web app vient moderniser le coté responsive pour les services nécessitant une interface adaptée se rapprochant ainsi au maximum de l’expérience des applications mobile. Que ce soit au niveau de l’interface comme au niveau des interactions avec le téléphone.

Le premier avantage est comparable à celui du React: avoir un langage commun Javascript, HTML et CSS. Nul besoin de se lancer dans une nouvelle technologie pour avoir une application dans le navigateur.

Le deuxième est certainement le plus gros avantage: pas de mise à jour de votre application sur les stores. La mise en production de votre application est disponible de la même manière pour tous.

Le troisième est en relation avec les conditions de publication exercées sur les stores: vous n’êtes pas dépendant d’Apple ou Google. Si vous ne collez pas avec les conditions d’utilisation des plateformes ou que vous essayez de contourner leurs services, vous pouvez être retiré du store du jour au lendemain.

Le dernier avantage est de ne pas encombrer le téléphone: très peu de données sont stockées sur le smartphone et donc ne génère aucun ralentissement de votre mobile.

Tout comme avec les applications mobiles, il est possible d’interagir avec les différentes fonctions du téléphone. C’est ce qui différencie principalement la version mobile ou responsive d’un site de la PWA. Même si rien n’empêche un site mobile responsive d’utiliser les interactions disponibles en fonction du navigateur et du téléphone utilisé.

C’est une des principales motivations des éditeurs: être capable d’envoyer des pushs aux personnes ayant téléchargé l’application. Il est notamment possible d’envoyer des pushs via une PWA sous réserve que la personne accepte le fait de recevoir vos notifications. Cette fonction est disponible sur mobile, mais également sur desktop.

Elle reste quand même pour le moment limitée aux navigateurs compatibles, Apple étant à la traîne sur ces sujets via son navigateur Safari. Pour le moment Chrome est en avance sur Android.

L’utilisation du bluetooth et NFC arrive dans les magasins, en parallèle des utilisations de la RFID qui permettront d’avoir des informations sur les produits, les rayons et d’avoir une vraie expérience digitale en magasin ou lors d’événements. L’utilisation de ces services est encore principalement sur des applications natives ou hybrides mais ils arrivent aussi dans le navigateur des mobinautes. Le champ des possibles est alors très large.

Une fonction très pratique et ouverte sur l’ensemble des plateformes à condition d’avoir activé la localisation dans ses paramètres. Elle permet de localiser précisément la personne et donc de lui apporter de l’information avec une valeur ajoutée et donc d’avoir une interaction avec l’utilisateur sans avoir téléchargé d’application en amont.

Fonctions également ouvertes sur l’ensemble des plateformes. Il est possible de prendre une photo ou une vidéo avec le capteur du téléphone, et de la récupérer via un service. Cela peut, par exemple, permettre de changer d’avatar ou d’alimenter une banque d’images pour la récupérer sur internet par la suite.

Il est possible d’utiliser l’application sans avoir internet, dans le cadre d’un usage ne nécessitant aucune requête vers internet. Une petite révolution permettant d’avoir des applications très simples quand vous êtes dans le métro, l’avion ou en manque de réseau.

Amateurs de musique, voici un accordeur de musique dans le navigateur. Il suffit de donner accès au micro à l’aide de votre smartphone et vous pouvez accorder votre instrument très facilement sans télécharger d’application au préalable.

https://guitar-tuner.appspot.com/

Il est également possible de donner accès au gyroscope du téléphone. Voici un exemple de jeu totalement bluffant visuellement et d’une fluidité parfaite.

https://paperplanes.world/