Makina Blog
Quelle solution pour mon application mobile hybride ?
Un petit guide des frameworks open source disponibles.
Le JavaScript avance, et vite. C'est un peu le leitmotiv du développement front end depuis quelques années. Une des conséquences est l'essor des applications mobiles hybrides et des solutions diverses et variées y répondant.
Nous vous proposons dans cet article un petit tour d'horizon des grandes solutions open source (et gratuites) disponibles en ce début 2016, avec leurs avantages et inconvénients respectifs.
Cordova : le senior
Cordova est là depuis longtemps. Anciennement PhoneGap, il a ouvert la route vers une uniformisation de l’accès aux fonctions natives des plates-formes mobiles. Non sans surprise, il reste aujourd’hui l’un des grands piliers du mobile hybride. Non seulement il continue d’être maintenu et amélioré très régulièrement (sortie de la version 6 le 28 janvier 2016 !), mais surtout il sert de base à de nombreux frameworks dont Ionic dont nous parlons ci-dessous.
Il est facile de se dire que Cordova seul n’est pas suffisant, mais il convient parfaitement à certains types d’applications où la lourdeur d’un framework complet est une chose dont on peut largement se passer.
Nous proposons d'ailleurs des formations à Cordova, si vous voulez vous y mettre plus facilement.
Petite clarification, PhoneGap est aujourd'hui le nom du service propriétaire d'Adobe, construite sur Cordova.
Points positifs
- compatible avec de très nombreuses plates-formes (Android, iOS, Windows Phone, Blackberry, Ubuntu mobile, Firefox OS, LG web OS, FireOS) ;
- liberté technologique (utilisez le framework qui vous convient, ou pas du tout de framework d’ailleurs !) ;
- performances entièrement dépendantes de ce que l’on en fait ;
- une base de plugins très complète et bien maintenue ;
- technologie mûre.
Points négatifs
- demande un travail plus conséquent pour avoir un résultat utilisable en production ;
- interface graphique non comprise ;
- absence de visualisation hors émulateur / périphérique par défaut.
Ionic : le petit frère
Ionic est aujourd’hui l’un des frameworks les plus en vogue pour faire des applications mobiles hybrides rapidement et de qualité. Depuis sa création en 2014, l’outil n’a cessé de s’améliorer et de fédérer autour de lui. Il partage actuellement le haut du panier avec React Native en terme d’engouement, et la version 2 à venir (déjà disponible en beta) ne fait qu’amplifier ce phénomène. L’attrait principal du framework est qu’il offre toute une interface prête à utiliser, au sein d’un système de routage et d’outils complets. Construit autour Cordova, il profite de ses plugins et offre donc une surcouche à celui-ci, utilisant majoritairement AngularJS.
À noter que nous avons rédigé un guide de démarrage pour Ionic, si vous êtes impatient de vous y plonger.
Points positifs
- UI complète (avec un système de templating unifié pour toutes les plates-formes) ;
- création rapide pour la production ;
- construit avec AngularJS ;
- CLI très puissante (ex: visualisation dans le navigateur avec du live reload) ;
- dépôt de plugins cordova spécifiquement maintenu par l’équipe du framework.
Points négatifs
- compatible uniquement iOS et Android (Windows Phone prévu pour la version 2) ;
- obligation d'utiliser AngularJS ;
- système de routing vite limité pour des navigations complexes (point adressé dans la version 2) ;
- performances encore assez éloignées du natif.
React Native : le cousin des States
React Native est le penchant mobile du framework de Facebook, React. Encore en cours de finalisation, il apporte une autre réponse au fameux mythe du “écrire une fois et déployer partout”. L’intérêt principal est qu’il utilise la même bibliothèque (donc même syntaxe) que React, et permet donc, modulo les éléments spécifiques aux plates-formes mobiles, de réutiliser le code pour une version bureau ou web, tout en créant des versions natives pour Android et iOS. Il devient même envisageable, avec un peu de réécriture, de l’associer à un Cordova pour le déployer sur d’autres plates-formes que celles gérées par le framework.
Points positifs
- performances natives ;
- framework édité par Facebook, donc bien maintenu ;
- logique de composants ;
- même syntaxe que React (donc possibilité de sortir une version web).
Points négatifs
- framework jeune ;
- compatibilité IOS et Android (partielle pour l'instant), mais pas de Windows Phone prévu ;
- nécessité d'utiliser des conditions pour différencier le code spécifique aux composants natifs des différentes plates-formes (on peut vite se retrouver avec des if en pagaille) ;
- n’est pas du web à proprement parler et donc demande une adaptation pour les développeurs.
En résumé
Chaque solution possède ses forces et ses faiblesses. Ionic reste à l'heure actuelle le meilleur moyen d'obtenir rapidement une application fonctionnelle et respectant relativement bien l'esthétisme des plates-formes auxquelles elle se destine. Si votre besoin comprend une compatibilité Windows Phone, il est indispensable de se tourner vers du Cordova avec des kits UI ou de tout réaliser à la main. Enfin, si c'est la performance qui guide votre choix, React Native est votre meilleure option, suivi par Cordova.
Bien sûr, il existe d’autres frameworks, et l’envie de les tester ne manque pas ! Ceux présentés dans cet article sont largement utilisés, et nous avons eu la chance de pouvoir nous même les mettre en production. Si vous avez des expériences à partager avec la communauté, n’hésitez pas à nous écrire un petit mot !
Formations associées
Formations Front end
Formation Développement d'applications JavaScript
À distance (FOAD) Du 2 au 4 avril 2025
Voir la Formation Développement d'applications JavaScriptFormations Mobile
Formation React Native
Aucune session de formation n'est prévue pour le moment.
Pour plus d'informations, n'hésitez pas à nous contacter.
Voir la Formation React NativeActualités en lien
Générer un fichier PMTiles avec Tippecanoe
SIG
28/02/2024
Exemple de génération et d’affichage d’un jeu de tuiles vectorielles en PMTiles à partir de données publiques.
Publier une documentation VitePress sur Read The Docs
Logiciel libre
01/02/2024
À l'origine, le site de documentation Read The Docs n'acceptait que les documentations Sphinx ou MKDocs. Depuis peu, le site laisse les mains libres pour builder sa documentation avec l'outil de son choix. Voici un exemple avec VitePress.
Créer une application en tant que composant web avec Stencil
Application Web & Mobile
04/04/2023
Mise en place dans le cadre de Geotrek, cette solution permet de se passer d'une iFrame pour afficher une application dans n'importe quel site.