Flutter vs Native: Comment choisir?

Chez Liip, nous développons des applications mobiles depuis plusieurs années. Nous avons utilisé différentes technologies telles que Kotlin (Android), Swift (iOS), Cordova, Xamarin et maintenant Flutter. Chacune ayant ses avantages et désavantages, nous nous efforçons de nous maintenir à jour et d'utiliser les technologies les plus adaptées à chaque projet.

Flutter est un framework de développement multi-plateforme pour réaliser des applications sous Android, iOS, Web, etc. avec le langage Dart. Il a été publié en 2017 et a été développé par Google. Comme sa popularité est très grande dans la communauté, il était temps de l’utiliser pour l’un de nos clients après plusieurs projets de recherche en interne. Kariyon, notre première application développée avec Flutter est désormais sur les stores (AppStore / Google Play).

Kariyon a été imaginé par la société Local Impact. Cette Start-up fribourgeoise s'est particulièrement distinguée durant la crise de la Covid-19 afin d'aider les commerces locaux en proposant des bons d’achats en partenariat avec le canton de Fribourg. L'application souhaite continuer à soutenir les détaillants locaux en leur fournissant l'infrastructure nécessaire pour un système de fidélité numérique. De plus, si le commerce appartient à une communauté de commerces, les points s’accumulent aussi auprès de cette communauté, bénéficiant ainsi d’avantages supplémentaires.

"Kariyon", une application pour smartphone, est lancée pour soutenir le commerce de proximité fribourgeois avec une carte de fidélité virtuelle et globale - RTS, 11.18.2021

Dans cet article, nous aimerions vous partager notre retour d’expérience sur Flutter.

Design et animation

Avec une approche déclarative, Flutter met tout en œuvre pour faciliter le développement des vues et leur optimisation. Peu d’efforts sont nécessaires pour avoir très vite un beau retour visuel. Les widgets mis à disposition permettent de créer des visuels identiques pour les deux plateformes (Android et iOS). Si besoin, il est aussi possible d’utiliser des composants graphiques spécifiques à la plateforme.

Les bulles du background en blanc sur l'image 1 et en vert sur l'image 2 sont réalisées en utilisant un CustomPainter. Il permet de personnaliser le design de l'application en dessinant des formes géométriques quelconques. L'application a la possibilité de s'enrichir facilement d'un design profond et détaillé.

Un autre objet, le CustomClipper permet de découper cette fois les formes et de limiter leurs étendues afin de voir l'arrière-plan. Visibles sur l'image 2, les coupons ont des arrondis vers l'intérieur. Avec Flutter, les possibilités de personnalisation du design sont grandes et rapides à mettre en place.

Les animations sont aussi bien pensées avec Flutter. Comme pour les autres frameworks, il est possible d'ajouter directement des GIFs dans l'application. Il est aussi très facile de créer des animations en ajoutant une évolution dans le temps aux CustomPainter et CustomClipper.

Navigation

Flutter se veut cross-plateforme pour Android et iOS, mais peut aussi être utilisé pour des applications web (depuis la v2.0) et desktop (en beta). C’est très pratique pour avoir une seule codebase mais le support des différentes plateformes complexifie le code.

Il existe deux systèmes de navigation: le Navigator (système impératif) et le Router (système déclaratif). Si l'application est petite, le Navigator est suffisant et la navigation est simple et efficace pour les applications mobiles. Dès que la navigation est plus complexe, le Router peut devenir nécessaire, mais cela demande plus de travail et est plus lourd à entretenir.

Packages

Avec Flutter, beaucoup de fonctionnalités sont sous la forme de packages (librairies). Les fonctionnalités du système telles que l’utilisation de la caméra, le GPS ou encore les requêtes réseau nécessitent l'ajout d'un package. Pour ces fonctionnalités de base par exemple, les packages sont maintenus par Google. Mais pour d'autres, le soutien de la communauté est nécessaire.

A cause de ses packages, le support et la longévité de l'application n’est pas garanti. Cependant, la communauté de Flutter est déjà grande et en pleine expansion. Les packages les plus populaires sont bien maintenus à jour. C’est aussi une opportunité pour les développeurs de contribuer à des projets open source pour garantir la longévité de la plateforme.

Dart & Hot reload/hot restart

Dart est un langage facile à apprendre, à typage fort et orienté-objet avec une syntaxe de type C et offre toutes les fonctionnalités d'un langage moderne comme l'inférence de type, sécurité nulle, génériques, concurrence, etc. Le choix de ce langage a permis de mettre à disposition le Hot reload et Hot restart durant le développement grâce la compilation Just-in-time. Quand on change du code, le changement est directement visible dans l'application sans avoir à la redémarrer. Cette fonctionnalité permet un gain de temps considérable, même si cela ralentit les performances de l'application lors du développement uniquement.

À l'inverse, lors de la mise en production, l'application utilise la compilation Ahead of time rendant possible les bonnes performances de Flutter.

Conclusion

Si votre application est petite et que vous désirez minimiser les coûts de développement, Flutter est la meilleure solution actuellement sur le marché tout en donnant un résultat très qualitatif qui est proche du natif, tant en termes d’expérience utilisateur que de performances.

Flutter permet aussi de maîtriser une seule technologie avec une codebase unifiée ce qui peut-être un grand avantage en comparaison de l’approche classique qui consiste à développer deux fois la même application pour Android et iOS.

En revanche, nous ne sommes pas sûrs si Flutter se prête bien au développement d'applications complexes et s'il y aura plus de problèmes de maintenance comparé au natif. Si vous voulez le meilleur produit possible et que vous pouvez vous permettre des coûts supplémentaires, pensez à long terme: le développement natif reste le meilleur choix.