author
La semaine dernière Xebia annonçait la sortie de l’application mobile Xebia pour Devoxx France, ainsi que la publication prochaine du code source de l’application. C’est aujourd’hui chose faite puisque vous pouvez le consulter sur son espace GitHub à l’adresse suivante : https://github.com/xebia-france/devoxx-mobile.
Le code source est publié sous license MIT. Je vous encourage à aller le consulter, le forker ainsi qu’à partager vos retours d’expériences autour du développement d’applications mobiles basées sur des technologies web.
Génèse et objectifs
Le développement de l’application s’est focalisé autour des axes et objectifs suivants :
- Explorer les technologies web pour développer une application mobile, que cela soit par l’utilisation d’HTML5 et CSS3 via le cadre de développement proposé par la librairie jQueryMobile ou bien par l’intégration de différentes librairies JavaScript telles que Require, Backbone, Underscore ou Lawnchair.
- Mettre en oeuvre PhoneGap et son usine logicielle en ligne PhoneGap Build pour délivrer des applications web encapsulées dans des coquilles natives afin de pouvoir les publier sur les markets Android, Chrome ou bien encore iOS.
- Fournir une application qui sera utilisable sur l’ensemble des matériels du marché et vérifier dans quelle mesure les applications mobiles web peuvent se comparer aujourd’hui face aux applications natives.
- Développer une application ayant une base de code unique afin d’éviter d’avoir à gérer la fragmentation des plateformes.
- Etre en mesure de répondre à un cahier des charges complet en un temps réduit. Ce cahier des charges comprenant:
- Le développement des différents écrans applicatifs : Liste des sessions par journée avec affichage complet des détails, ainsi que les listes et détails des speakers, des salles, et des tracks.
- La gestion et le stockage des favoris (On parle ici des sessions)
- La présentation du programme Xebia pendant les 3 jours de la conférence
- Une application étant capable de fonctionner en mode offline avec synchronisation et stockage des données
- Un affichage de la timeline twitter XebiaFr et DevoxxFr
- Un fonctionnement effectif sur un ensemble étendu des matériels allant du téléphone au PC en passant par la tablette quelque soit l’OS
Un premier bilan
Le pari du développement d’une application mobile web fonctionnant sur un grand nombre d’OS et de matériels est un succès. L’application fonctionne aussi bien sur des plateformes mobiles telles qu’iOS ou Android que sur les navigateurs web classiques. Malgré des avantages évidents, le développement mobile web n’est pas exempt de difficultés. Pour rendre compte de cela nous allons tenter de dresser une liste de points positifs et des difficultés rencontrées au cours du développement de l’application.
Les points positifs
Un développement unifié
Un aspect majeur vient du fait qu’il n’a pas été nécessaire de gérer différentes bases de code. Le travail de gestion de la fragmentation n’a été que secondaire.
Bien que la plateforme web propose un mode de développement unifié avec les technologies HTML, CSS et JavaScript, les différentes OS et matériels imposent des contraintes variées qui peuvent apporter des problématiques venant complexifier les développements : taille de l’écran, performance des navigateurs, latence et vitesse des réseaux de données, etc.
Afin de ne pas se tromper, il est nécessaire de s’assurer de la plateforme cible principale et d’y apporter une expérience utilisateur optimale, vous pouvez ensuite vous assurer du bon fonctionnement des développements sur les environnements cibles secondaires. Il n’est pas difficile dans le cas d’un développement mobile de faire fonctionner l’application dans un navigateur classique. Il est d’ailleurs possible en introduisant quelques notions de Responsive UI d’obtenir un résultat efficace sur l’ensemble des navigateurs.
Les principaux navigateurs mobiles étant basés sur WebKit, il est possible de travailler la majorité du temps avec un navigateur desktop compatible tel que Chrome ou bien Safari. Il est cependant nécessaire de tester dès le départ ses développements sur mobile pour éviter les mauvaises surprises. Pour cela, rien de plus facile, il vous suffit de préparer une configuration Apache pointant sur vos développements, ce qui rend accessible votre application sur vos matériels mobiles via Wifi sans même avoir à déployer quoi que ce soit. Il est biensûr important d’avoir un environnement de recette disponible sur un hébergement externe afin de rendre vos développements testables sur d’autres matériels auxquels vous n’avez accès qu’occasionnellement.
Ce dernier point soulève la problématique du déploiement. Heureusement le déploiement d’une application web n’a rien de bien complexe, et quelques commandes de scripts répondront avec succès à vos besoins.
Des technologies maîtrisées
Les technologies web ont pour avantage d’être généralement déjà maîtrisées par les équipes de développement, par conséquent leur coût d’apprentissage reste faible. Le web fourmillant de tutoriaux, il est facile de trouver les informations dont vous avez besoin pour démarrer ou progresser dans vos développements.
Ce qu’il faut retenir c’est qu’il n’est plus nécessaire d’apprendre les arcanes du SDK de chacune des plateformes que vous ciblez! Le gain à ce niveau est extraordinaire, vous n’avez à vous concentrer que sur une seule technologie ce qui favorise votre montée en compétences, et vous permet d’éviter de vous disperser. Ceci est d’autant plus vrai lorsque vous avez une équipe restreinte à disposition : vous n’aurez qu’une seule application à peaufiner, à maintenir ou bien encore à débogguer. Vous irez d’autant plus vite à fournir une solution viable à vos utilisateurs sans entraîner de déception en excluant telle ou telle plateforme.
Les difficultés
Des problèmes d’intégration
jQueryMobile est une formidable librairie mobile adressant avec succès la fragmentation des plateformes, mais pour autant cette librairie n’est pas exempt de défaut. La gestion des hashtags ne permet pas jusqu’à présent de traiter correctement les paramètres d’URL, ceci reste secondaire puisqu’il est possible de contourner le problème en utilisant un routeur externe tel que celui fourni par le projet jQueryMobile Router. Il est à noter que jQueryMobile ne s’intègre pas parfaitement avec le router de Backbone au moins dans sa version 1.0, il reste à vérifier si la situation a changé avec la version 1.1 de la librairie.
Des problèmes de performance
Les environnements mobiles sont contraints par les performances des processeurs qui équipent votre matériel. De surcroît, de nombreuses optimisations Webkit ne sont pas intégrées aux navigateurs mobiles actuels. Les différences se jouent également sur différents aspects selon les plateformes. Ainsi, la plateforme Android propose de faibles performances concernant les animations CSS, tandis que la plateforme iOS a du mal à optimiser le scroll ce qui pose des problème de transition entre les page d’une application jQueryMobile (Ce problème est décrit dans le changelog de la version 1.1).
Des fonctionalités manquantes
Il n’est hélas pas possible de reproduire l’ensemble des fonctionnalités d’une application native dans une application mobile. Il n’est ainsi pas possible de synchroniser des données en tâche de fond avec les technologies web actuelles. Seuls les WebWorkers pourraient répondre à cette problématique, cependant ils ne sont pas encore supportés correctement sur la majorité des plateformes mobiles. Il est donc nécessaire d’étudier dès le démarrage de votre projet mobile les solutions de contournement possibles.
Le piège de la validation
Attention à ne pas sous-estimer la difficulté de passer l’étape de validation de votre application sur le market iOS. S’y prendre en avance n’est parfois pas suffisant. Apple conditionne l’acceptation des applications à des contraintes extrêmement sévères. Par exemple, une application fonctionnelle mais juste correcte visuellement n’est pas nécessairement suffisante. Si vous voulez mettre toutes les chances de votre côté, il est nécessaire de mettre en avant les possibilités et les qualités de la plateforme iOS. Il est également nécessaire de soumettre uniquement des applications avec un graphisme irréprochable, proposant de préférences des fonctionnalités inédites et originales.
Il faut également savoir que les applications HTML5 peuvent être refusées pour le simple motif qu’elles n’utilisent pas de fonctionnalités natives, et cela même si aucune application ne propose encore la même fonctionnalité sur le market. Dans ce cas, Apple vous enjoint à proposer votre application via le web. Ce dernier point peut être très dommageable en terme de diffusion et de retour sur investissement. Il est donc nécessaire de prévoir d’exploiter des fonctionnalités natives d’iOS si vous voulez mettre toutes les chances de votre côté. Les solutions sont nombreuses, vous pouvez par exemple utiliser les notifications iOS via PhoneGap et le tour est joué. Quelques tests de support de fonctionnalités natives dans votre code via la présence des API PhoneGap suffiront à faire l’affaire.
A toutes fins utiles, sachez qu’il faut attendre en moyenne 9 jours pour que votre application passe la validation Apple. Prévoyez également la possibilité que votre application soit refusée et qu’il faille la soumettre à nouveau. Ceci nous amène à un délai d’au-moins un mois. Il est nécessaire d’anticiper ces délais si vous ne voulez pas avoir de mauvaises surprises !
Conclusion
Le développement d’applications mobiles viables basées sur des technologies web est bel et bien aujourd’hui une réalité, mais les difficultés sont encore nombreuses, et le support des technologies et des pratiques demandent encore à mûrir. Cependant les choses évoluent très vite, et même si nous sommes aujourd’hui dans un trou technologique entre une fragmentation des développements natifs de plus en plus difficile à adresser et une plateforme de développement unifiée autour des technologies web qui ne demandent qu’à mûrir, il serait dommage de rester là à regarder le train passer sans se mettre à apprendre ce qui sera sans aucun doute une solution de premier choix dans un futur très proche !