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: http://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

logo PhoneGapNitobi, 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

logo AppceleratorDé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


PhoneGap Titanium
iOS, Android, BlackBerry, Bada, WindowsPhone, WebOS, Symbian iOS, Android et depuis très récemment BlackBerry

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


PhoneGap Titanium
Possibilités des navigateurs Web + API PhoneGap (principalement appareil photo, système de fichier, accéléromètre, liste des contacts, géolocalisation) Accès aux composants d’IHM natifs + API Titanium (base de données, géolocalisation, gestion des contacts, intégration Facebook, appareil photo, lecture et enregistrement audio/vidéo…)

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


PhoneGap Titanium
HTML/CSS/JavaScript standard. On développe comme si c’était une application Web normale. Les API PhoneGap sont bien documentées, par-contre on devra chercher sur le Web la documentation pour les technologies HTML/CSS/JS et les éventuelles librairies JavaScript utilisées. JavaScript en utilisant des API spécifiques à Titanium, que ce soit pour créer les IHM ou pour écrire des appels au système. Le site d’Appcelerator propose la documentation des API ainsi qu’une application démo (KitchenSink) et des vidéos.

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


PhoneGap Titanium
PhoneGap nécessite de développer pour chaque plateforme ciblée dans l’IDE correspondant, et ne fournit pas d’outils supplémentaires. Titanium fourni un IDE dédié, basé sur Aptana, un des meilleurs IDE Web reposant lui-même sur Eclipse (acheté récemment par Appcelerator)

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


PhoneGap Titanium
PhoneGap propose depuis peu un outil de build sur le cloud: PhoneGap Build, qui compile un projet PhoneGap vers les différentes plateformes cibles, que vous pourrez ensuite publier sur l’AppStore, l’Android Market, etc. Titanium ne fournit pas d’outil de packaging multi-plateforme. Vous devrez donc créer manuellement les packages applicatifs.

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


Fonctionnalité Synthèse
Plateformes supportées Avantage PhoneGap
Richesse (fonctionnalités + IHM) Avantage Titanium
Langage de développement Egalité
Productivité des développements Avantage Titanium
Gestion des déploiements Avantage PhoneGap

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.

11 commentaires pour “Applications mobiles multi-plateformes: les approches PhoneGap et Titanium Mobile”

  1. Je peux vous dire que Titanium est loin d’être aussi productif que vous (et eux) le laissez croire. Pour avoir auditer et suivi de nombreux projets Titanium, je constate que cette plateforme est très instable, lente au possible pour développer et qu’il existe de nombreuses différences entre les platformes qui doivent être gérées.

    Au final, une fois le surcout graphique de PhoneGap essuyé, on obtient un outil aussi proche que Titanium de la plateforme cible, mais beaucoup plus stable, simple et surtout plus efficace.

  2. Sans oublier les différences entre les plateformes. Sur blackberry et windows phone, en particulier.

    Je suis d’accord avec Waddle sur Titanium …

    Enfin contrairement aux croyances, ce qu’on gagne en développement on le perd en test et QA avec ces environnements …

  3. [...] fonctionne PhoneGap car beaucoup l’on déjà fait mieux que je ne peux le faire (comme octo par exemple) mais juste faire un petit retour [...]

  4. Est-ce-que ces plates-formes apportent une solution sur l’adaptation de la page au terminal, voir à l’ergonomie du terminal ? Bouton plus ou moins gros selon le DPI ou si le terminal est orienté touch screen ou style ?

  5. Et la validation ou la simulation sur un terminal, est-ce-que chacune propose une solution ? Notamment pour vérifier le fonctionnement sur les touches physiques ou sensitives, simuler un appel, une géolocalisation précise, le basculement à portrait/paysage, une idée du rendu sur plusieurs terminaux sans avoir à tous les acheter?

  6. Je pense que Titanimum ne va pas dans le sens de l’histoire. L’histoire elle vas vers HTML 5. Avec les capacités graphiques, d’animation, de gestion multimédia, supporté par les plateformes mobiles les plus diffusées (iOS; Android, BB6, et maintenant WP7 Mango), HTML 5 s’impose comme standard de développent sur Plateforme mobile.
    Qui dit HTML 5 ne dit pas forcément application native. Et c’est justement l’intérêt ! Une application HTML 5 peut être livrée sous forme de Web App ou d’application native grâce à PhoneGap, possibilité que n’offre pas Titanium. En ce qui concerne PhoneGap, le défaut qui est cité pour le côté graphique, est largement compensé en utilisant les frameworks Sencha Touch ou JQuery Mobile.

    C’est pour cela que dans notre plateforme Convertigo Mobilizer nous avons choisi et intégré le couple PhoneGap/Sencha Touch comme base pour générer nos applications Mobile. Convertigo permet de créer des application mobiles Cross-Platform, de les générer multi-OS en un Click tout en les connectant aux application métiers existantes.

  7. [...] Blog Octo: Applications mobiles multi-plateformes: les approches PhoneGap et Titanium Mobile [...]

  8. Bonjour,

    En fait, je suis en train de faire une comparaison entre Titanium et PhoneGab, et je voudrais bien poser certaines questions:

    1- Est ce qu’on peut développer des WebApp avec Titanium?

    2- Que voulez-vous dire, dans la section Richesse de la plateforme, par Titanium: Accès aux composants d’IHM natifs ?

    3- Vous avez mentionné que: 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.)… Au même temps, vous avez dis que PhoneGab fournit des API JavaScript aux navigateurs Web standards, permettant d’appeler des fonctionnalités natives non disponibles autrement: accéder à l’appareil photo!!!

    4- Pouvez-vous m’expliquez de plus cette phrase: Le principe de Titanium est de fournir une machine virtuelle JavaScript permettant d’accéder au système natif?

    J’espère que mes questions ne seront pas gênantes ;) et merci pour votre coopération!

  9. Salut tout le monde,
    Merci bcp pour ces éclaircissements
    un débat très intéressants

  10. Tout à fait d’accord avec Waddle sur Titanium !
    A se demander si le rédacteur de l’article a déjà utilisé ce mauvais outil.
    Quant aux soi-disant gains économiques, ça reste très théorique et pas si vrai en pratique.

    Soit on veut un site Web mobile, soit on veut une application ; mais mixer les 2 reste totalement utopique aujourd’hui.

  11. Bonjour à tous

    je suis débutant dans la programmation mobile multi plateforme et j’utilise pour le moment le framework Phonegap avec du jquery Mobile. je travaille actuellement sur un projet android, mais je suis bloqué sur le rendu de mon projet android dans l’émulateur, le rendu ne prend pas en compte les propriétés propres Jquery Mobile par contre en exécutant uniquement le fichier index.html dans le navigateur le rendu prend en compte les propriétés ( la mise en formes des composants) jquery mobile.

    merci pour toutes propositions de solutions

Laissez un commentaire