Sélectionner une page

Avec quel outil commencer le développement multi-plateforme ? Cette comparaison construite autour de retours d’expérience concrets va vous aider à faire le bon choix entre React Native et Flutter.

Vous en avez certainement entendu parler car ils font le buzz. Ces deux outils révolutionnent le développement d’applications mobiles et le rendent plus accessible à de nombreux développeurs, d’où les nombreuses comparaisons apparues au cours des derniers mois.
Cependant, tout le monde parle d’argu-ments qui n’ont pas vraiment d’importance comme le langage ou l’outil de ligne de commande pour l’installation. J’aimerais partager avec vous une approche différente en parlant des choses qui comptent réelle¬ment dans un projet, afin de choisir le cadre approprié à vos besoins.

Tout dépend de vous : d’où vous venez et de vos besoins. Les deux sont d’excellents outils que vous devriez considérer pour vos applications.

Maintenant que tout a été dit, nous pouvons commencer.

Prise en main

Il y a déjà beaucoup de comparaisons entre Dart et JS, composants natifs, scaffolding, etc. Je ne développerai pas plus cela ici. N’hésitez pas à faire des recherches sur Internet et vous obtiendrez de nombreux résultats pertinents, notamment des bench¬marks de performances.

En bref : Dart est nativement typé. C’est un très bon langage qui a été conçu à l’origine pour remplacer JavaScript (mais Google n’a pas réussi à intégrer dans d’autres navigateurs que Chrome une machine virtuelle Dart malgré plusieurs tentatives).

D’autre part, JavaScript ne possède pas nativement de types statiques mais peut être étendu avec TypeScript notamment pour ajouter cette fonctionnalité.
On pourrait parler de votre IDE favori ou de bien d’autres outils de développement… Mais ce n’est pas ce oui compte vraiment. Nous nous soucions de la liberté et de la flexibilité qu’un framework nous donne pour atteindre nos objectifs. الدومينو Non pas de la façon dont il est pris en main à première vue. On s’habitue à tout après tout, non ? Surtout quand on est développeur et que les tech¬nologies évoluent vite.
Parlons donc des arguments populaires que l’on peut lire partout, les mêmes arguments que ceux que j’entends de la bouche de mes collègues au travail.

La mauvaise argumentation entre Flutter et REACT NATIVE

« Dort est plus sûr car c’est un langage à types statiques alors que JS ne l’est pas. »

Le typage est un choix de premier ordre pour n’importe quelle application, en parti-culier pour les applications mobiles qui ont une plus grande inertie lors du déploiement de mises à jour. Ceci notamment à cause du processus de build et de la validation des stores a pplicatifs.
JS peut utiliser TypeScript et Flow pour également obtenir du typage statique. Cela ne donne pas encore d’optimisation de perfor¬mance comme Dort le fait actuellement. Cela pourrait toutefois changer à l’avenir, en particulier avec le nouveau moteur/architecture de REACT NATIVE qui sera disponible courant 2020 selon les pré¬visions.
Malgré cela, il peut parfois être intéressant d’avoir un langage non-compilé. كرة اولين Par exemple pour un procédé de mise à jour à distance, dont nous parlerons plus loin.

« Flutter et Dart sont propulsés par Google et le nouveau système d’exploitation Google Fuchsia est l’avenir. REACT NATIVE mourra en douceur car Flutter sera beaucoup mieux optimisé pour son nouveau système d’exploitation. »

Personne ne peut prédire l’avenir, mais une chose est certaine : quelques-unes des plus grandes entreprises du monde sont en train de parier sur React Native en ce moment. Microsoft crée de nombreux outils tels que CodePush ou REACT NATIVE Windows / Mac et une partie de leurs outils populaires tels que Word sont portés partiellement en React Native.
On parle également d’entreprises et start-ups telles que Discord, Tesla, Uber ou encore Pinterest et bien évidemment Facebook et Instagram.
Flutter est certainement un choix fort et continuera à se développer, mais je pense que les deux frameworks resteront des concurrents pour Fuchsia.

La bonne argumentation entre React Native et Flutter

« Les performances de Flutter sont meilleures que celle de REACT NATIVE.»

Effectivement, grâce à la compilation en amont c’est complètement vrai. Cependant il faut noter qu’avec quelques optimisations, on peut obtenir une expérience complètement fluide et performante avec React Native également.

« Quand on vient du monde Android/iOS, il est plus facile de prendre en main Flutter que REACT NATIVE. »

En effet, Flutter est clairement le successeur de Java et Android et par les caractéris¬tiques de Dort cela est plus simple à prendre en main quand on vient du natif.

Une bonne partie de la logique vient de Java et d’un langage objet fortement typé. La plus grosse différence se trouve dans l’apprentissage du côté déclaratif et l’orga-nisation en Widgets, dont les développeurs natifs n’ont pas forcément l’habitude.

Les Widgets sont des composants métiers/graphiques avec des paramètres qui décrivent l’état et la mise en page escomptée de l’application.

« Les outils de développement de Flutter sont bien mieux que ceux de REACT NATIVE. »

Il y a en effet un grand écart entre les deux produits sur ce point. L’équipe derrière Flutter fournit une excellente intégration pour VScode et Android Studio avec de nombreux outils d’analyse et de debug.
De l’autre côté, chez REACT NATIVE, les outils sont relativement légers. Mis à part le React Dev Tool et quelques plugins, la plu-part du debugging est délégué aux outils natifs d’Android et iOS. Facebook essaye d’améliorer cela, notamment grâce à leur nouvel outil Flipper, mais cela reste encore assez expérimental.
Comme nous pouvons le voir, il y a de bons arguments en faveur de nos deux frameworks. Allons plus loin dans les différences majeures en termes de styles et de compor¬tements.

Les différences majeures entre REACT NATIVE et Flutter

Le moteur de rendu ne fonctionne pas du tout pareil !
Sur React Native, le JavaScript pilote à tra-vers ce qu’on appelle le pont natif (native bridge), le moteur de rendu de chaque système d’exploitation mobile. Il y a donc une sorte de bus de message entre les deux threads (JS et natif).

De ce fait les composants affichés sont ceux propres à chaque plateforme. On peut par¬fois être contraint d’utiliser des structures conditionnelles pour utiliser des compo¬sants natifs selon la plateforme, ce qui reste rare globalement.
Le rendu est de temps en temps légèrement différent sur les deux plateformes. Ces diffé¬rences peuvent porter atteinte au fonction¬nement de quelque chose si l’on ne fait pas attention. Il faut donc bien vérifier les deux plateformes lors du développement.

Chez Flutter, les applications sont rendues dans une sorte de Canva. De la même manière qu’un jeu vidéo se rend via son moteur graphique. خدمه العملاء كونكر Du coup, peu importe la plateforme, le rendu est exactement le même. Ce que fait Flutter, c’est qu’il redes-sine des composants reproduisant le même design que les composants natifs selon le design kit choisi. Cela laisse moins de place aux incompatibilités et cas à la marge.

Par contre, pour le driver web, Flutter utilise des canvas HTML. Ceci ampute aujour¬d’hui le SEO d’applications web en Flutter (actuellement en bêta), là où react-native¬web rend de vraies balises HTML.

Mises à jour à la volée et compilation

Grâce à la nature de JavaScript qui est d’être compilé Juste-à-Temps, il est possible de tirer parti des mises à jour à la volée avec React Native. Et c’est vraiment très simple en utilisant Microsoft Codepush ou Expo.io. Une mise à jour à-la-volée est une mise à jour que l’on peut envoyer via le réseau, très rapidement sans build, ni validation de stores applicatifs. Cela sur tous les termi¬naux utilisateurs sans attendre qu’ils déclenchent une mise à jour.
C’est actuellement la principale raison pour laquelle je ne change pas REACT NATIVE pour Flutter progressivement (outre le fait que j’aime vraiment le paradigme React). Cela change vraiment la donne, en particu-lier sur les applications événementielles où le délai de mise à jour est très court et où vous avez beaucoup d’utilisateurs dans un court laps de temps.

Avec Expo.io, on peut même développer une application mobile sans environne¬ment de développement installé sur son ordinateur.
Chez Flutter, ce n’est pas possible actuelle-ment. Peut-être que l’équipe de Flutter nous fournira une meilleure solution à l’avenir, mais à l’heure actuelle, il n’y a pas de bibliothèque officielle solide qui supporte cela.

L’expérience de dévelop-pement et la mise en page

Outils de développement
Les outils de débogage sont géniaux avec Flutter et c’est un argument fort en faveur de l’expérience de développement. Vous pouvez aller plus facilement et plus profon-dément dans l’optimisation que dans REACT NATIVE comme nous l’avons vu plus haut dans cet article.

Définition de l’interface utilisateur
Mais d’un autre côté, alors que React native s’appuie sur JSX (une sorte de XML) pour décrire la définition de l’interface utilisateur de manière simple, Flutter utilise une mise en page basée sur des Widgets, ce qui reste assez verbeux et complique le développement selon moi.
Il y a beaucoup de répétitions et sans IDE, il devient vite difficile de lire le code. Cela complique évidemment les revues de Pull Request.
JSX tire parti d’une définition de mise en page simple et lisible, proche du HTML, encore plus avec une bibliothèque telle que styled-components. Cela donne à REACT NATIVE un bel avantage, car n’importe quel développeur venant du web peut rapi¬dement commencer avec REACT NATIVE.

La communauté et les librairies
L’écosystème JavaScript est très populaire avec beaucoup d’outils et de bibliothèques, cependant bien que Dort soit un bel outil, la communauté est aujourd’hui beaucoup plus petite et beaucoup plus jeune.
Vous avez beaucoup de paquets avec Dort, mais la plupart des start-ups IT ne donnent pas de SDK Dart pour le moment, alors que NodeJS est très populaire dans le monde des SDK.
Dort est cependant soutenu par Google qui va probablement pousser de nombreuses bibliothèques dans le futur pour son langa¬ge. A suivre…
React native et JS ont donc clairement l’avantage.

À emporter / TLDR;

Ceci résume et vous aidera à choisir entre nos deux protagonistes.
Il n’y a pas de bonne ou de mauvaises réponses et cela dépendra du contexte et des préférences/connaissances de votre équipe.

Flutter et Dart
Flutter et Dart sont des choix forts pour concevoir votre application si vous avez l’intention de parier sur l’avenir.
Je ne pense pas qu’il y ait des risques à se lancer sur cette pile technologique. Les seuls risques sont qu’il vous faudra écrire/comprendre pas mal de code par vous-même, ceci parce que l’écosystème est assez récent. Vous ne pourrez pas utili-ser les outils créés par les autres comme vous le feriez avec JS.
Mais Dart est un bon langage qui résout de nombreux problèmes de JavaScript.
Actuellement, je recommanderais de commencer avec Flutter pour le cross-platform si au moins certaines des phrases sui-vantes sont vraies pour vous :

  • Vous venez d’un environnement sans JavaScript et React, et vous ne pourrez pas capitaliser sur votre expérience avec ces outils.
  • Vous ne venez pas du développement web et n’avez pas l’expérience de la mise en page CSS et notamment du CSS-in-JS.
  • Vous n’avez pas de délais stricts et vous avez une flexibilité dans votre livraison en termes de périmètre de fonctionnalités. Comme vous n’obtiendrez pas autant d’aide de l’extérieur que vous pourriez en obtenir avec React, il peut être plus difficile de concevoir une interface utilisateur spécifique.
  • Le routage avec Flutter est également plus complexe qu’avec la fameuse librairie react-navigation.
  • Les performances sont des caractéris-tiques importantes de votre application.
  • Vous acceptez de perdre le bénéfice des mises à jour à-la-volée et vous reposez sur les mises à jour via le Play Store de Google ou l’Apple App Store, au moins pour les prochains mois/années.

React Native et TypeScript (ou JavaScript)

D’autre part, React Native est soutenu par Facebook et de nombreuses autres entreprises. C’est le framework le plus avancé de sa catégorie.
Malgré l’absence de fonctionnalités telles que le typage statique en JS, vous pouvez (voir devrez) combler cela en utilisant cer-tains outils tels que TypeScript.
Je vous recommande d’utiliser React Native si vous avez beaucoup de choses qui correspondent aux phrases suivantes :

  • Vous êtes déjà un développeur React, Vue ou Angular et vous êtes familiers avec le concept de programmation décla-rative en composants.
  • Vous venez d’un environnement web et vous êtes familier avec la mise en page CSS, vous avez de l’expérience avec les bibliothèques CSS-in-JS.
  • Vous aimez compter sur un grand et riche écosystème de développeurs et d’outils que vous pouvez utiliser dans votre appli¬cation ; vous voulez obtenir du support externe sur des forums populaires tels que stock overflow.
  • Vous souhaitez tirer parti des mises à jour à la volée à l’aide de Microsoft Codepush ou Expo.io, pour des correctifs et une livraison rapides.
  • Vous voulez utiliser des outils SASS popu¬laires qui apportent un support pour NodeJS prêt à l’emploi.
    A vous de coder !

Source : Programmez

EnglishFrench

Pin It on Pinterest