Écrit par Souvik Biswas

La plupart des entreprises essaient d’adopter un cadre de développement d’applications multiplateformes afin de devoir embaucher un petit nombre de développeurs qui géreraient à la fois la partie iOS et Android native. Mais, cet état d’esprit des gens change lentement maintenant, avec l’introduction du Flutter. Même certaines grandes entreprises (qui ont déjà des développeurs pour Android et iOS natifs) utilisent Flutter dans leur application de production. Alors, comment ce changement radical arrive-t-il? Explorons-le plus en détail.

Qu’est-ce que Flutter

Sur le site Web officiel de Flutter, Flutter est défini comme la boîte à outils de l’interface utilisateur de Google pour créer de belles applications compilées nativement pour mobile, Web et bureau à partir d’une seule base de code.

Le 4 décembre 2018, Flutter 1.0 a été publié lors de l’événement Flutter Live, désignant la première version « stable » du framework. Depuis lors, Flutter s’est beaucoup amélioré en termes de performances.

Récemment, le 11 décembre 2019, Flutter Interact a eu lieu et a apporté un certain nombre d’améliorations au framework avec l’introduction de Flutter 1.12.

Un résumé de toutes les annonces dans Flutter Interact est disponible ici.

Vous pouvez trouver certaines des applications créées à l’aide de Flutter sur leur page Web officielle.

Aperçu de Flutter vs iOS

Dans les premiers jours du développement iOS, le langage de programmation utilisé par Apple était Objective-C que la plupart des développeurs détestaient à l’époque, mais étaient obligés d’utiliser car c’était la seule option disponible si vous vouliez poursuivre le développement iOS à cette époque. Mais en 2014, Swift a été introduit, qui était sûr pour le type et utilisait une syntaxe concise mais expressive, et les développeurs l’ont adoré. Il était également entièrement compatible avec Objective-C et les API iOS existantes. Bien que les API utilisées par Swift n’étaient pas si bonnes au départ, elles sont beaucoup améliorées maintenant.

Flutter a été initialement publié en gardant à l’esprit ces quatre piliers: Beau, Rapide, Productif & Ouvert. Et après un an, il a prouvé qu’il s’y tenait.

La plupart des frameworks de développement d’applications multiplateformes présents souffrent de problèmes de performances et de stabilité. Ils sont facilement identifiables lorsqu’ils sont exécutés à côté d’une application native. Flutter a largement comblé cet écart de performances par rapport à d’autres frameworks multiplateformes, tels que React Native et Xamarin.

Comment Flutter est-il devenu aussi performant qu’une application native ? La réponse réside dans son architecture et aussi dans le langage utilisé par Flutter, c’est-à-dire Dart.

En tant que développeur iOS si vous souhaitez essayer Flutter, une belle documentation officielle est disponible.

Architecture

Applications natives

 Architecture native
Architecture native

Dans les applications natives, qu’il s’agisse d’Android ou d’iOS, le code de l’application native communique avec la Plate-forme pour créer des widgets OEM ou pour accéder à divers Services tels que l’audio, les capteurs, la caméra, etc. Les widgets sont rendus dans un canevas d’écran et les événements sont renvoyés aux widgets. Cette architecture limite la réutilisation des widgets sur toutes les plates-formes car ils sont spécifiques aux OEM. Et, c’est la raison pour laquelle nous devons écrire l’application entière pour chaque plate-forme séparément.

Avant de passer à Flutter, examinons l’architecture d’une autre solution multiplateforme populaire, React Native.

Applications natives React

 Architecture native React
Architecture native React

Les applications natives React sont écrites en JavaScript, donc pour accéder aux widgets OEM, il faut utiliser un pont pour parler à la plate-forme. C’est là que réside le goulot d’étranglement de ce cadre.

Ainsi, la solution des développeurs React Native:

Pour concevoir des applications natives React performantes, nous devons réduire au minimum les passes sur le pont.

Applications Flutter

 Architecture Flutter
Architecture Flutter

Maintenant, nous arrivons aux applications Flutter. Flutter résout la partie la plus difficile des autres frameworks multiplateformes, c’est-à-dire se débarrasser du PONT. Flutter n’utilise pas les widgets OEM, il fournit ses propres widgets. Flutter déplace les widgets et le moteur de rendu de la plate-forme vers l’application, ce qui leur permet d’être personnalisables et extensibles. Cela aide également Flutter à maintenir la cohérence de 60 images par seconde.

Dart

Une autre raison pour laquelle les développeurs aiment Flutter est à cause du langage Dart.

Dart est un langage orienté objet, défini par une classe, collecté à la poubelle utilisant une syntaxe de style C qui trans-compile éventuellement en JavaScript.

Bien que le Swift soit également une très bonne langue moderne, le Dart possède certaines caractéristiques qui le séparent des autres langues:

  • Dart utilise la compilation AOT (à l’avance), ce qui donne un démarrage rapide et des widgets Flutter entièrement personnalisables.

  • Dart utilise également la compilation JIT (Juste à temps), qui est la principale raison pour laquelle le rechargement à chaud existe. J’en parlerai un peu.

  • Dart a un ramasse-miettes construit dans la langue. Cela permet à Flutter d’obtenir des animations et des transitions fluides qui s’exécutent à 60 images par seconde.

  • Dart permet à Flutter d’éviter le besoin d’un langage de mise en page déclaratif distinct ou de constructeurs d’interface visuelle, comme Storyboard dans iOS, car la mise en page déclarative et programmatique de Dart est facile à lire et à visualiser.

  • Dart a une courbe d’apprentissage facile, car elle présente des similitudes avec diverses autres langues. C’est la combinaison des caractéristiques de ces langages qui rend Dart si puissant.

Chez Flutter Interact, Dart a été mis à jour vers la version 2.7 avec la prise en charge des méthodes d’extension, du paquet de caractères et de l’aperçu de sécurité null. Vous pouvez obtenir plus d’informations dans cet article.

Rechargement à chaud

Dans le développement de l’application iOS native, si nous apportons même des modifications très simples comme changer la couleur d’un composant, il faudra au moins 10 secondes pour afficher le changement à l’écran.

 Démo de rechargement à chaud
Démo de rechargement à chaud

Le rechargement à chaud de Flutter permet aux développeurs d’envoyer uniquement les modifications incrémentielles du code source à la machine virtuelle Dart en cours d’exécution, plutôt que d’exécuter tout le code après chaque modification. Cela lui permet d’apporter des modifications presque instantanées, tout en conservant l’état de l’application.

La fonction de rechargement à chaud de Flutter vous aide à expérimenter rapidement et facilement, à créer des interfaces utilisateur, à ajouter des fonctionnalités et à corriger des bugs.

Si vous n’avez pas encore essayé Flutter, vérifiez-le une fois, au moins au nom de Hot Reload. Il faut le voir pour le croire.

Code d’interface utilisateur déclaratif

Chaque composant de Flutter est connu comme un widget. Les applications Flutter sont créées en combinant ces widgets (comme des blocs de construction) pour former une arborescence de widgets. Même l’application finale que nous obtenons est également un widget.

Flutter utilise une interface utilisateur déclarative.

Dans un style de programmation déclaratif, nous sommes le plus préoccupés par ce que nous voulons comme réponse. Ici, en tant que développeurs, nous ne sommes pas préoccupés par la façon dont nous y arrivons, simplement par la réponse qui est reçue.

Cela signifie que Flutter utilise l’interface utilisateur en fonction de l’état.

Cela permet également au code Dart de s’exécuter sur un seul isolat.

Alors que le développement iOS utilisant Swift suit le paradigme de programmation impératif.

Dans un style de programmation impératif, nous nous soucions de la façon dont nous arrivons à une réponse, étape par étape. Nous voulons le même résultat en fin de compte, mais nous disons au compliant de faire les choses d’une certaine manière afin d’obtenir la réponse correcte que nous recherchons.

Cela signifie également que le code Swift s’exécute sur plusieurs threads et que pour maintenir la communication entre les composants dans iOS, nous devons utiliser des fermetures (rappels), des délégués, des notifications, des sélecteurs de cible, une observation clé-valeur, etc.

Swift utilise un générateur d’interface séparé appelé Storyboard pour concevoir l’interface utilisateur de l’application.

Cela rend souvent le code très complexe à comprendre et réduit la productivité.

Comme Flutter utilise du code déclaratif, il est beaucoup plus propre et plus facile à refactoriser que le code Swift de style impératif. De plus, le code déclaratif signifie que nous raisonnons à un niveau d’abstraction beaucoup plus élevé que le code impératif.

Directives de conception

Suivre les directives de conception iOS dans Flutter est vraiment très facile. Flutter a une bibliothèque de composants d’interface utilisateur distincte connue sous le nom de widgets Cupertino. Cela contient tous les widgets qui suivent les directives de conception iOS par défaut.

Avec l’introduction de Flutter 1.12, il n’est désormais plus nécessaire de télécharger chaque police de la bibliothèque Google Fonts pour l’utiliser dans votre application Flutter. Il vous suffit d’inclure un package, google_fonts, et vous aurez accès à l’ensemble de la bibliothèque de polices Google.

Flutter 1.12 a amélioré certains des widgets de Cupertino et leur a ajouté une prise en charge complète du mode sombre.

Vous pouvez trouver les conseils officiels de conception de l’interface utilisateur iOS ici.

Il existe également un Google Codelab disponible pour créer une application Cupertino avec Flutter.

Gestion des dépendances

iOS dépend de certains outils tiers pour son système de gestion des dépendances, comme CocoaPods ou Carthage. Les développeurs iOS doivent donc en apprendre davantage sur ces outils de gestion des dépendances tiers.

Flutter utilise son propre système de gestion des dépendances appelé Pub. Le gestionnaire de paquets Pub est intégré à Flutter et il est facile d’importer de nouvelles dépendances selon les besoins pour le développement de l’application.

Vous pouvez obtenir plus d’informations sur l’utilisation des paquets dans Flutter ici.

Add-to-app

Flutter peut également être intégré à vos applications iOS existantes en tant que bibliothèque ou module. Ce module peut ensuite être importé dans votre application iOS pour afficher une partie de l’interface utilisateur de votre application dans Flutter.

Depuis Flutter 1.12, l’ajout à l’application est pris en charge pour le scénario de base consistant à intégrer une instance de Flutter en plein écran à la fois par application.

Une documentation pour ajouter Flutter à une application existante est disponible ici.

Testing

Apple utilise XCTest comme framework de test à partir de Xcode 5. Les types de test que vous pouvez effectuer à l’aide de XCTest sont:

  • Tests unitaires
  • Tests de performance
  • Tests d’interface utilisateur

XCTest est étroitement intégré à l’environnement de développement de Xcode, il fournit donc un flux de travail facile à utiliser et transparent avec d’autres composants et fonctionnalités de l’environnement de développement. Mais il présente des problèmes de performances et de stabilité lors de l’exécution de tests d’interface utilisateur sur l’appareil.

Swift manque également d’un cadre de moquerie approprié. Ainsi, pour les tests simulés, certains des frameworks sur lesquels les développeurs iOS comptent sont Cuckoo& MockFive.

Vous pouvez trouver une brève documentation de test pour iOS ici.

En revanche, le Flutter est très fort en termes de tests. Il a également trois catégories de tests:

  • Tests unitaires
  • Tests d’intégration
  • Tests de widget

Le test de widget dans Flutter est similaire au test de composant ou au test d’interface utilisateur d’autres frameworks. Mais Flutter exécute des tests de widget aussi rapidement que des tests unitaires, ce qui lui donne un énorme avantage par rapport aux tests d’interface utilisateur normaux utilisés dans iOS. Vous pouvez également utiliser d’autres frameworks de test comme Mockito en utilisant le package mockito dans Flutter. Pour exécuter des tests d’intégration dans Flutter, vous devez inclure un package connu sous le nom de flutter_driver.

La documentation pour tester les applications Flutter est disponible ici.

CI/CD

L’intégration continue (CI) et la livraison continue (CD) aident les développeurs à apporter des modifications de code de manière fiable et rapide, et leur permettent de livrer leur application à temps. Flutter et iOS ont tous deux un excellent support CI / CD disponible.

Il existe différents services CI / CD basés sur le cloud disponibles pour une utilisation avec des projets iOS, tels que Nevercode, BuddyBuild, Jenkins, Travis CI, CircleCI, Bitrise.

Ces services CI/CD basés sur le cloud gèrent tout le processus de génération iOS, y compris les tests, la signature de code et le déploiement d’applications vers des services spécifiques ou des connexions iTunes. Nous pouvons également écrire nos propres scripts personnalisés pour répondre à des besoins spécifiques.

Codemagic a été présenté comme la première solution CI/ CD dédiée uniquement au Flutter. Mais maintenant, il prend également en charge les applications non flottantes utilisant codemagic.yaml. Cela le rend capable de créer, de tester et de fournir des applications natives avec des modules Flutter ajoutés.

À partir de maintenant codemagic.yaml prend en charge uniquement Android et Web, mais le support iOS serait ajouté très bientôt.

Le flottement peut-il dominer sur iOS?

Flutter regorge de fonctionnalités et promet de bonnes performances, mais il n’est toujours pas prêt pour certaines applications.

Il manque de disponibilité de certains plugins. Certains des plugins importants disponibles sont toujours bogués et ne sont pas utilisables dans les applications de production à grande échelle. Mais cela dépend fortement du type d’application sur laquelle vous ou votre entreprise travailleriez, si vous obtenez de bons plugins et qu’ils répondent aux besoins en fonctionnalités de votre application, Flutter pourrait être le meilleur choix pour vous.

Comme vous l’avez peut-être déjà compris jusqu’à présent, Flutter adopte une approche très différente des autres solutions multiplateformes, ce qui lui permet d’obtenir des performances presque natives et le langage Dart permet aux développeurs de montrer facilement leurs compétences créatives, en rendant les applications belles et intuitives à utiliser pour les utilisateurs.

À ce stade, vous ne devez pas ignorer Flutter. Si vous n’avez pas encore essayé Flutter, essayez-le maintenant, car il vaut mieux tard que jamais.

Quelques autres points forts de flottement qui le séparent des autres cadres sont énumérés ci-dessous.

Rapport Octoverse

Selon le rapport OCTOVERSE du GitHub de 2019, Flutter est l’un des projets open source à la croissance la plus rapide et il a grimpé à la 2e position.

Dart est devenu le langage de programmation à la croissance la plus rapide sur GitHub.

Fuchsia

Fuchsia est un système d’exploitation open source actuellement développé par Google.

Flutter a été développé dans les premières phases en gardant à l’esprit le fuchsia. Fuchsia utilise Flutter comme moteur de rendu de l’interface utilisateur.

Ce qui rend Fuchsia si unique, c’est la possibilité de s’exécuter sur n’importe quelle architecture CPU. Il est basé sur leur propre micro-noyau appelé Zircon qui, selon eux, est capable de fonctionner sur des smartphones, des ordinateurs de bureau, des systèmes embarqués et plus encore.

Il existe une page Web officielle de Fuchsia, qui contient de la documentation sur la façon de démarrer avec Fuchsia.

À ce stade, on ne sait pas quand le système d’exploitation Fuchsia sera disponible et quel type d’appareils prendra-t-il en charge.

RIVE

Rive (anciennement 2Dimensions) est un outil de conception et d’animation puissant, qui permet aux concepteurs et aux développeurs d’intégrer facilement des animations sophistiquées dans leur plate-forme. Vous pouvez importer des animations Rive directement dans vos applications Flutter qui fonctionnent sans problème à 60 images par seconde.

Pour plus d’informations, consultez leur site officiel.

Ambient Computing

À Flutter Interact ’19, Flutter a été présenté comme la plate-forme d’interface utilisateur conçue pour l’informatique ambiante. Par cela, ils voulaient dire qu’au départ, Flutter a été introduit comme solution multiplateforme uniquement pour les appareils mobiles, mais maintenant, il s’étend même au Web, à macOS, aux appareils embarqués, etc. Vous pouvez dire que le cadre Flutter montre ses vrais pouvoirs maintenant, et j’ai hâte de voir ce qu’il peut faire à l’avenir.

Support communautaire

Flutter étant totalement un projet open source, la communauté des développeurs joue un rôle important dans son succès. Il y a un certain nombre de plugins Flutter impressionnants qui sont venus de cette communauté et les développeurs expérimentent chaque jour de nouvelles choses dans Flutter, repoussant ses limites.

Conclusion

Flutter est devenu un framework vraiment puissant et ne peut plus être ignoré. Que vous aimiez ou détestiez Flutter, en tant que développeur iOS, vous devez absolument essayer Flutter et Dart pour comprendre leurs véritables pouvoirs.

Si Flutter remplacera iOS natif, reste toujours une question. En attendant cette réponse, il est prudent de dire que Flutter a un très bel avenir. Même s’il ne parvient pas à remplacer le développement d’applications natives, il s’est déjà avéré être le meilleur framework de conception d’interface utilisateur disponible à ce stade.

Souvik Biswas est un développeur d’applications Mobiles passionné (Android et Flutter). Il a travaillé sur un certain nombre d’applications mobiles tout au long de son parcours. Aime la contribution open source sur GitHub. Il poursuit actuellement un B.Diplôme de Technologie en Informatique et en Ingénierie de l’Institut Indien des Technologies de l’Information de Kalyani. Il écrit également des articles de flottement sur la communauté de flottement moyen.