Les PWA et TWA

PWA, TWA, APK ? Le développement d’applications pour mobile évolue. Il existe aujourd’hui plusieurs façons de développer une application.

Application native (APK)

L’APK (Android Package Kit) est un format de fichier natif pour le système Android. Il est développé en Java (ou Kotlin). L’application compilée au format APK peut être soumise à un Play store pour être diffusée.

Le logiciel de référence pour développer une application Android est Android studio.

Cela présente un inconvénient : un coût de développement non négligeable pour porter l’application sur différents systèmes (Swift, Objective-C pour iOS, Java/Kotlin pour Android).

Et si on pouvait coder l’application une seule fois pour tous les écosystèmes ?

Progressive Web App (PWA)

Les “Progressive Web App” sont des applications web avec l’apparence d’une application mobile. Elles peuvent fonctionner hors ligne grâce au Service Worker qui joue le rôle de proxy.

Comment ça marche ?

Dans votre smartphone, vous ouvrez votre navigateur, vous saisissez l’adresse d’un site web servant une PWA et vous aurez l’impression d’utiliser une application mobile classique. Il est même proposé d’installer l’application sur l’écran d’accueil pour retrouver l’icône de l’application comme toute application native.

Comment développer une PWA ?

Les éléments principaux sont les suivants :

• Manifest : fichier JSON contenant les informations utiles (icônes, adresse de l’application, couleurs…)
• Service worker : fichier Javascript tournant en tâche de fond sur le site web. Il gère les notifications push, le mode hors ligne, le cache…
• L’application web : votre code HTML, CSS, Javascript, codé par exemple avec React, VueJS, Vuetify…

Voici un excellent tutoriel pour développer une PWA.

Les avantages d’une PWA :

• Pour les mises à jour, il suffit de mettre à jour l’application web (pas besoin de publier une nouvelle application sur le Store).
• Vous gérez le mode “hors ligne”.
• Notifications push, et autres API web.
• Pas de développement spécifique pour chaque système mobile, tout est développé en Javascript/HTML/CSS.
• Possibilité d’ajouter une icône de démarrage de l’application sur l’écran d’accueil du téléphone.

L’inconvénient est que l’application n’apparaît pas dans le Play Store. Et aujourd’hui quand un utilisateur cherche une application, il se dirige vers le store.

Pour remédier à cela, Cordova peut être utilisé. Ce logiciel crée un APK en incluant l’application web (js, html, css), qu’il est possible de publier sur le play store.

Mais Cordova a des inconvénients :

• Cordova utilise une webview, pas aussi performante que le navigateur natif. Les APIs du navigateur ne sont pas disponibles.
• Cordova inclut l’application web (html, js, css…) donc à chaque mise à jour du code il faut déployer un nouvel APK.
• Débogage : pas de rapport de plantage comme on pourrait avoir avec une application native.

Existe-t-il une autre alternative pour diffuser une PWA dans le Google Play Store ? Oui: les TWA.

Trusted Web Activity (TWA)

Une “Trusted Web Activity”, que l’on pourrait traduire par “vue internet de confiance” est un onglet du navigateur Chrome affiché dans une application Android native. C’est un dérivé du “Chrome Custom Tab” apparu dans Chrome 45. La TWA fonctionne sur les versions d’Android Kit Kat (API 19) et supérieures. La page peut s’afficher en plein écran sans la barre d’adresse. Par sécurité, il est vérifié que l’application native et le site web appartiennent au même développeur (d’où “trusted”, de confiance). Cette vérification est effectuée via l’Android App Links.

Comment développer une TWA ?

Voici le document de référence pour créer une TWA. Vous trouverez également à cette adresse un lien vers une application de démonstration.

Les avantages d’une TWA :

• offre beaucoup plus de fonctionnalités que le composant “webview” (notifications push, synchronisation en arrière plan , API de partage)…
• le code de l’application n’est pas embarqué dans l’APK. Pour mettre à jour votre application, transférez une nouvelle version de votre PWA sur votre site web. La mise à jour sera transparente pour l’utilisateur, plus besoin de télécharger une application complète pour une petite mise à jour.
• si l’utilisateur est connecté dans le navigateur web, il sera connecté dans l’application (Chrome partage les sessions, le cache, le stockage…)
• application native dans le play store très légère car le contenu est sur votre site web (PWA).

Les inconvénients :

• débogage : pas de rapport de plantage comme on pourrait avoir avec une application native
• Chrome doit être installé sur le smartphone

Conclusion

Les navigateurs web (desktop ou smartphone) accèdent de plus en plus aux fonctionnalités du système hôte (notifications, enregistrement audio et vidéo, géolocalisation, stockage…). Vous pouvez vérifier les possibilités de votre navigateur sur le site https://whatwebcando.today/. Avec un peu de Javascript c’est une bonne alternative pour le développement d’applications multi-plateformes.