Applications mobiles multi-plateformes: les approches PhoneGap et Titanium Mobile

Introduction

Le développement d'applications pour terminaux mobiles (iPhone, iPad, Android, Blackberry, Windows Phone, Nokia Symbian, Samsung Bada...) se heurte à la fragmentation des technologies de développements: environnement iOS/Objective-C pour l'iPhone et l'iPad, SDK Java spécifique pour Android, J2ME pour Symbian, etc.

Deux approches possibles lorsque l'on débute un projet d'application ciblant plusieurs de ces plateformes sont de développer une application pour chacune d'elle, ou de développer un site Web compatible.

Dans le premier cas, l'inconvénient concerne bien évidemment le coût des développements. Dans le deuxième, on sera limité en richesse de l'application par les possibilités du Web.

Ce fut l'objet d'un précédent article sur notre blog: https://blog.octo.com/debat-web-apps-vs-natif/.

Entre ces deux approches se situe une offre assez fournie de solutions de développement multi-plateforme, proposées par des éditeurs proposant leurs propres plateformes d'exécution et leurs outils de développement.

Parmi celles-ci, nous nous sommes concentrés dans cet article sur PhoneGap et Titanium Mobile, qui sont aujourd'hui parmi les plus abouties et sont représentatives des deux principales approches de développement multi-plateforme: l'utilisation des moteurs de rendus Web pour PhoneGap, et la translation de code source vers la plateforme cible pour Titanium.

Présentation des solutions

PhoneGap

Nitobi, l'éditeur de PhoneGap, a annoncé son rachat par Adobe le 3 octobre 2011. Cela confirme l'intérêt que l'on peut avoir envers cette solution, même si ce rachat surprise apporte une certaine incertitude sur l'avenir de PhoneGap. PhoneGap est un outil open-source, et devrait d'ailleurs rejoindre la fondation Apache. Le principe de PhoneGap est de fournir des API JavaScript aux navigateurs Web standards, permettant d'appeler des fonctionnalités natives non disponibles autrement: accéder à l'appareil photo, à l'accéléromètre, au système de fichiers... Cela nécessite d'embarquer le code source HTML/CSS/JS dans une application native, grâce au composant permettant d'inclure une vue Web dans une application, disponible dans chaque SDK.

Titanium

Développé par Appcelerator qui vend du support et des formations sur Titanium, c'est également une solution libre.

Le principe de Titanium est de fournir une machine virtuelle JavaScript permettant d'accéder au système natif, et ainsi de développer des applications natives mais en JavaScript. C'est la promesse d'applications plus réactives et à l'expérience utilisateur plus proche du natif que celles basées sur des pages Web, comme PhoneGap.

Points communs

L'intérêt principal de l'utilisation d'une plateforme de développement multi-plateforme comme PhoneGap et Titanium Mobile réside en 2 points:

• pouvoir déployer l'application sur les magasins (AppStore, Android Market...) afin de bénéficier de ce canal de distribution et de communication. Cela est réellement assuré par ces deux outils;
• réduire les coûts de développements en mutualisant du code. Cela est assuré par ces deux outils à condition de bien les utiliser et de limiter la part des développements spécifiques à chaque plateforme et donc de se limiter aux fonctionnalités supportées "out of the box". On rogne donc sur l'expérience utilisateur et la richesse fonctionnelle.

Comparaison

Plateformes supportées

#table_fct_html5 {border-collapse: separate; border-spacing: 2px; width:100%;} #table_fct_html5 th {padding: 6px 12px; text-align: left} #table_fct_html5 td {padding: 6px 12px; vertical-align: top;} #table_fct_html5 td:last-child, th:last-child {text-align: left;} #table_fct_html5 tr:nth-child(odd){background: #eee;} #table_fct_html5 tr:nth-child(even){background: #ddd;} #table_fct_html5 tr:first-child {background: #cba; color:white;} #table_fct_html5 td:empty {background: white;}

Notre avis:

En pratique, les développements PhoneGap nécessitent des adaptations pour chaque plateforme, dont les capacités et l'expérience utilisateurs diffèrent fortement. Etant donné l'état du marché (avec l'écrasante domination de l'iPhone, d'Android et de Blackberry), on ciblera généralement ces 3 plateformes uniquement. C'est ce que l'on a pu constater dans la plupart des cas où une entreprise ciblait initialement toutes les plateformes: l'augmentation du coût pour les supporter au fur et à mesure rendait cela impossible et finalement, au maximum, seules les 3 ou 4 principales étaient vraiment adressées. Concernant Titanium, le support de Blackberry est encore récent et disponible uniquement sous Windows, alors que la plupart des développeurs mobiles sont sous Mac (pour l'iPhone). Cela est dommage mais on espère que ce sera bientôt résolu. Pour cibler tous les terminaux mobiles à moindre coût, le meilleur moyen reste de réaliser un site Web simple, qui permet de diffuser de l'information mais ne permet ni de fournir des fonctionnalités avancées (appareil photo, etc.), ni de proposer une expérience utilisateur riche, ni d'être visible sur l'AppStore.

Richesse de la plateforme

#table_fct_html5 {border-collapse: separate; border-spacing: 2px; width:100%;} #table_fct_html5 th {padding: 6px 12px; text-align: left} #table_fct_html5 td {padding: 6px 12px; vertical-align: top;} #table_fct_html5 td:last-child, th:last-child {text-align: left;} #table_fct_html5 tr:nth-child(odd){background: #eee;} #table_fct_html5 tr:nth-child(even){background: #ddd;} #table_fct_html5 tr:first-child {background: #cba; color:white;} #table_fct_html5 td:empty {background: white;}

Notre avis:

Titanium est indéniablement plus riche fonctionnellement et fournira une apparence plus proche du natif, ce qui est en général l'objectif des concepteurs d'applications. PhoneGap est dans l'absolu plus limité en terme de fonctionnalités, et on doit concevoir les écrans comme des pages Web et non des écrans natifs. C'est d'ailleurs une erreur que l'on retrouve souvent sur les projets mobiles utilisant des technologies Web: il ne faut surtout pas tenter de reproduire des comportements natifs, mais plutôt viser des comportements Web performants. Les deux plateformes sont extensibles, Titanium plus facilement que PhoneGap, mais nous déconseillons globalement d'aller dans cette direction car cela devient très coûteux à maintenir (on estime en général à 20% la part maximale de code spécifique tolérable), et nécessite en outre encore plus de compétences que de faire des applications natives spécifiques à chaque plateforme.

Plateforme de développement

#table_fct_html5 {border-collapse: separate; border-spacing: 2px; width:100%;} #table_fct_html5 th {padding: 6px 12px; text-align: left} #table_fct_html5 td {padding: 6px 12px;vertical-align: top;} #table_fct_html5 td:last-child, th:last-child {text-align: left;} #table_fct_html5 tr:nth-child(odd){background: #eee;} #table_fct_html5 tr:nth-child(even){background: #ddd;} #table_fct_html5 tr:first-child {background: #cba; color:white;} #table_fct_html5 td:empty {background: white;}

Notre avis:

On remarque l'utilisation de plus en plus large de JavaScript, un langage décrié par ses côtés peu structuré et trop tolérant. Il est nécessaire, pour développer ce type d'applications, de se former profondément à JavaScript et de connaître les design patterns de structuration/modularisation du code dans ce langage, qui existent mais sont souvent mal connus des développeurs. C'est d'ailleurs le principal objet de la formation à Titanium donnée par leur expert Kevin Whinnery, que nous avons eu la chance de suivre à l'UpdateConf 2011. De manière globale, l'environnement de développement de Titanium est mieux intégré et plus documenté.

Productivité des développement

#table_fct_html5 {border-collapse: separate; border-spacing: 2px; width:100%;} #table_fct_html5 th {padding: 6px 12px; text-align: left} #table_fct_html5 td {padding: 6px 12px;vertical-align: top;} #table_fct_html5 td:last-child, th:last-child {text-align: left;} #table_fct_html5 tr:nth-child(odd){background: #eee;} #table_fct_html5 tr:nth-child(even){background: #ddd;} #table_fct_html5 tr:first-child {background: #cba; color:white;} #table_fct_html5 td:empty {background: white;}

Notre avis:

Titanium fournit un environnement de développement "clé en main" et performant, là où PhoneGap nécessite d'installer et configurer soi-même plusieurs environnements. La productivité est clairement côté Titanium aujourd'hui.

Gestion des déploiements

#table_fct_html5 {border-collapse: separate; border-spacing: 2px; width:100%;} #table_fct_html5 th {padding: 6px 12px; text-align: left} #table_fct_html5 td {padding: 6px 12px;vertical-align: top;} #table_fct_html5 td:last-child, th:last-child {text-align: left;} #table_fct_html5 tr:nth-child(odd){background: #eee;} #table_fct_html5 tr:nth-child(even){background: #ddd;} #table_fct_html5 tr:first-child {background: #cba; color:white;} #table_fct_html5 td:empty {background: white;}

Notre avis:

L'automatisation du packaging et de la livraison des applications sur les différentes plateformes (magasins publics type AppStore ou comptes privés "in house") est un véritable enjeu concernant la productivité des développements et le coût global d'un projet. C'est d'ailleurs pour cela qu'OCTO propose Appaloosa, qui facilite la distribution en entreprise d'applications mobiles dans des stores privés. L'outil PhoneGap Build (compatible uniquement avec les applications PhoneGap), qui vient d'être ouvert en version finale, était une véritable nécessité.

Synthèse

#table_fct_html5 {border-collapse: separate; border-spacing: 2px; width:100%} #table_fct_html5 th {padding: 6px 12px; text-align: left} #table_fct_html5 td {padding: 6px 12px;} #table_fct_html5 td:last-child, th:last-child {text-align: left;} #table_fct_html5 tr:nth-child(odd){background: #eee;} #table_fct_html5 tr:nth-child(even){background: #ddd;} #table_fct_html5 tr:first-child {background: #cba; color:white;} #table_fct_html5 td:empty {background: white;}

Les points forts de PhoneGap sont donc aujourd'hui son support de plus de 6 plateformes, et le fait qu'il utilise au maximum les technologies standards du Web. Ses points faibles concernent ses limitations fonctionnelles et sa moindre richesse d'IHM du fait qu'il n'utilise pas les composants natifs, ainsi que son manque d'outillage de développement.

Les points forts de Titanium sont sa richesse fonctionnelle et graphique, ainsi que la productivité de son environnement de développement. Son point faible concerne le peu de plateformes supportées.

Conclusion

En conclusion, on a pu voir que Titanium est globalement plus productif et fournit plus de fonctionnalités que PhoneGap dans le but de développer des applications mobiles multi-plateformes. On le préfèrera en général, si l'on ne doit pas supporter plus que iOS + Android + BlackBerry. Au-delà du choix de l'outil, notre conseil majeur restera d'utiliser les outils pour ce qu'ils savent faire, et éviter de "tordre" leur usage pour leur faire faire autre chose ou de manière différente. Cela s'approche des problématiques bien connues d'utilisation trop personnalisée de progiciels, qui rend rapidement très coûteuse la moindre évolution.

Et d'ors et déjà, le choix de la technologie de développement multi-plateformes doit aussi se faire par-rapport aux applications Web HTML5 qui apportent de plus en plus de fonctionnalités et viennent sérieusement concurrencer les approches natives et hybrides, et les solutions Web existantes comme les moteurs de rendus (BkRender, Wokup) et les nombreux frameworks Web pour mobiles (par exemple Sencha Touch.

La problématique du développement mobile multi-plateforme est loin d'être encore résolue, et nul doute que nous reviendrons encore dessus rapidement car c'est un enjeu fort pour les entreprises aujourd'hui.