DEV Community

Flutter, Ionic, React Native or Xamarin? What you use and why?

Heithem Moumni on June 01, 2018

Collapse
 
nitya profile image
Nitya Narasimhan, Ph.D

Hey @moumni - I think that like most subjective questions, we need to start with the simple answer which is "It depends".

It depends on what you are trying to achieve, what your resources/budget are, and what your current background/skillset is. It also depends on whether you are looking at this from a learning perspective or from an immediate-production perspective.

That said, this is how I view it:

  1. From a maturity perspective I would argue that Ionic has been around the longest, while Flutter is relatively new, and React Native finds the middle ground. So if you are looking at legacy projects or for folks with broad expertise in the space, Ionic and React Native are both good candidates. If however you are looking at long-term futures, I can see Flutter becoming competitive. At the very least, playing with it right now will give you early insights into the platform and a bigger chance to get engaged in contributing to the development and community around it.

  2. From a support perspective (as in who's backing this) my $0.02 is that the odds favor React Native and Flutter simply because they are backed by the big guys (React Native from Facebook, and Flutter from Google) both of which have vested interests in the mobile apps and experiences market (e.g., the advertising moneymakers are mobile) and are investing time and resources in advocating for their development. While I haven't played with React Native recently, I did spent all of Google I/O attending the Flutter talks and sessions --- and when you see them treating Flutter as an equal to Android, iOS and web (e.g., in implementing Material Design widgets, supporting Firebase client libraries etc.) you tend to take that more seriously. Ionic on the other hand has a huge following amongst web developers -- but is essentially not as deep-pocketed as the other two.

  3. I recently did a lightning talk on Flutter (shameless plug I know) and had this slide which is adapted from one that is used in many Flutter talks. It might give you another frame of reference to compare the three. I have not used Ionic myself but believe it relies on Cordova to create the native mapping. So in this grid, it would in the "Interpreted and non-Reactive" square.

The Mobile UI Landscape

The point made here is that both Cordova and React Native still operate within the JS realm; in both cases, you still have JS code in a "contained" view which is run within the native environment and invokes native APIs and widgets as needed- which incurs overheads in transitioning between JS and pure native environments. By contrast Flutter does not use ANY native OEM widgets. Instead you write your apps in Dart (yes! I didn't say it was perfect) and the Flutter tooling takes care of compiling this into pure native code that is packaged and shipped in native markets; there are no "JS bridges". The way they achieve native widget parity is by literally creating and maintaining Flutter widget collections ("Cupertino" for iOS and "Material Design" for Android) that are fairly comprehensive in covering the widgets provided natively by those operating systems. So if you measure value by performance, then Flutter is a little ahead of the pack and likely to keep improving

All three options are open source. But Flutter is no silver bullet so don't assume equivalence for production. For instance:

  • It is still a Beta 3 release. They call it production ready but I know agencies and companies that don't consider it viable until it hits at least v1 and has a few more large-scale signature app deployments.
  • It requires developers to learn Dart. Granted Dart is easy to pick up if you know Java, JavaScript or Swift -- but it is still a new language and environment, with all the learning curves that entails.
  • It still has a lot of "to-dos" - check out the growing list of issues. Since it is still a small team at Google, this will take some time; the upside is that there is a hugely engaged community and the Flutter team is super responsive to ideas and contributions.

There is more to say but hopefully this gives you a starting point for the discussion. Note however that after being in this industry for over two decades, I no longer believe in "winners vs. losers" -- rather I think its important to be pragmatic and adaptable, and pick the technologies that suit your immediate needs best, even while you learn things that are on the horizon. I remain a fan of all three and their engineering teams.

Collapse
 
sethusenthil profile image
Sethu Senthil

I would love to use Flutter but the problem is its base of the language dart. It's great if you like/ know Java but I'm a JS guy, why Google I thought your a JS fan like me man.

Collapse
 
zoechi profile image
Günter Zöchbauer

The Flutter team didn't chose Dart because it just likes Dart.
There are concrete reasons why Dart is a great fit for Flutter
hackernoon.com/why-flutter-uses-da...

Thread Thread
 
sethusenthil profile image
Sethu Senthil

This is all great, infact I am convinced to learn dart instead of ionic but is there a way to incorporate soket.io are some like that (packages)?

Thread Thread
 
zoechi profile image
Günter Zöchbauer

Haven't tried yet.
Google found github.com/flutter/flutter/issues/...

Collapse
 
ctrleffive profile image
Chandu J S

I'm also a JavaScript developer. Trust me. Dart is really easy.

Thread Thread
 
sethusenthil profile image
Sethu Senthil

Update: You are right! I'm somewhat into flutter and I can say its true

Collapse
 
creativ_bracket profile image
Jermaine

the problem is its base of the language dart. It's great if you like/ know Java but I'm a JS guy

Dart is also great if you like/know JavaScript. The syntax is familiar, and you can be productive in little time. I'm also another JavaScript developer who has come to appreciate Dart's offering. However, I am curious about your concerns–perhaps you could share a bit more in this discussion.

Collapse
 
rhymes profile image
rhymes

I'm so excited about Flutter, if they do it right it's going to change the game. A lot of companies don't have budgets for two teams and they're going the React Native or Cordova route with all the limitations they have...

To me it really makes no sense to have two different teams building the same exact app twice, with a different set of bugs :D

Collapse
 
sudiukil profile image
Quentin Sonrel

A friend of mine recently got into Flutter and liked it a lot, although his main concern was the lack of clear "conventions" (as he said it : "it's awesome but it's hard to find out what's the best way of doing something"), what are your thoughts on this ?

Collapse
 
nitya profile image
Nitya Narasimhan, Ph.D

Yes, absolutely. I am actually going to answer this in two parts.

First, Flutter is still in beta (currently beta release 3 I believe).

I am guessing that the Flutter team is racing to complete a number of issues that need to be addressed (e.g., in terms of missing widgets or libraries, enhancing or providing key features like accessibility and internationalization, tackling performance targets etc.). And since they are a fairly small team, that means that things like documentation and best practices may not be as comprehensive as they should be.

That said, I have been seeing an incredible number of resources popping up -- from a full-set of new codelabs to a free Udacity course to a growing list of YouTube Videos and Shows from Flutter team developer advocates.

If I had to guess, I would say that developer evangelism is a huge item on their list and that we will start seeing a lot more content/guidance coming out over the months leading up to the official v1.0 release.

Second, Conventions are often the byproduct of usage, and we need more usage.

What I mean is that people who write the middleware, libraries, APIs and platforms may not always know how those get used by developers. Conventions are often driven by best practices derived from widespread usage -- and in that sense, my hope is that we will see more conventions defined later in 2018 because organic usage of Flutter is trending upwards.

My best advice for right now (and in fact, this is what I do and plan to do more of) is to sift through the open-source examples to understand how various things are being implemented, and learn by duplicating and then customizing those for your needs. The awesome-flutter repo is a wonderful source for open-source community apps as well.

That said, I will leave you with two observations.

First on coding conventions. I do think the Flutter team has done a great job with providing a built in formatter that automatically reformats code to align with specific code conventions. If you work with distributed teams, or if you share code with others, having an objective formatter is great because it results in code that looks familiar and consistent to everyone (even if your inner control-freak is incensed by their indentation count).

Second, on design conventions. I think this is what you are interested in and the challenge I foresee is that Flutter is aiming to be a universal app framework that appeals to web, Android, iOS and other mobile platform developers. And each of those domains/developers comes with some baggage on design conventions established within those domains -- that now have to either translate into this realm, or be overcome and new ones learnt to be productive. And that may be the most interesting and valuable thing that comes out of organic community contributions to this discussion -- ways in which we can unify our thinking around this new platform by bringing best practices from environments we are familiar with, while understanding the strengths & weaknesses of this one.

Hope that helped

Thread Thread
 
sudiukil profile image
Quentin Sonrel

Awesome answer, it definitely helps, I'll forward this to my friend !

Collapse
 
heithemmoumni profile image
Heithem Moumni

Hi @nitya , thank you for your clear answer

Collapse
 
kaybarax profile image
Kevin Barasa

Dart's learning curve is that tough!!! Dart is really easy, and beautiful

Collapse
 
binarydelight profile image
Binary Delight

I've looked at all 3 and I (still) use Xamarin.

Of the 3 Xamarin is the closest to the respective native platforms and it supports more platforms than the others.

Xamarin allows me to still be a native developer using the same native API's and UI (storyboards and android xml layouts, without having to learn a new user interface framework. C#, the top 5 languages in terms of popularity is very productive. Together with .NET you have a powerful combination, espeically if you're crafting your own backends too using .NET core which is also cross-platform. Now you can share common classes (esp json POCOs) between App and Backend code.

Xamarin allows be to keep abreast of whats new in the respective native frameworks.

I think Flutter is promising, but dart is a very niche language, and its too early to bet on it being a winner.

Collapse
 
castrojr913 profile image
Jesús Castro • Edited

I'm Xamarin developer too. However, Visual Studio for Mac is absolutely mess. I can't believe Microsoft can't make a reliable IDE, it's very unstable and buggy. However, you can use Android Studio, Jetbrains IDEs or Visual Studio Code in order to create your apps on Flutter. Flutter has hot-reload feature, Material and Cupertino components, Skia engine is better than Mono Runtime; It's faster than Xamarin. Xamarin has 8 years working and Flutter is changing the game with 2 years only. Incredible.

Collapse
 
jryanio profile image
John Ryan

My 2 cents about Flutter:

It's ready to use: We've been using Flutter for ~6 months, and have had
surprisingly few issues with it. Any issues we've had have gotten quick
answers from the Flutter team.

It's production ready: We've shipped an app to a major customer of ours and the
issues we've found have not been related to flutter.

Flutter is straight-forward: Flutter uses the same concepts as React (props =
Dart constructor parameters and state = StatefulWidget) and has similar
lifecycle methods (componentDidMount() = initState(), componentWillUnmount() =
dispose()) and the concept of a key for stateful widgets. (I recommend the
Widgets Intro article on the Flutter site.)

Dart is straight-forward: I've worked with ~15 developers that have learned it
in less than a week, sometimes a few days. The language itself is
straight-forward and the tools for IntelliJ and VSCode work well. (here's a
shameless plug for Dart by Example to learn
the basics)

Layout is simple: Flutter takes a straight-forward and sensible approach to
layout. Rather than using CSS, flexbox or the platform's layout system
(AutoLayout, UIBuilder XML), Flutter uses it's own. Widgets decide how their
children are displayed. To make it even more simple, layout is described by
Widgets too. (For example, there is a Column widget with children instead of
flex-direction: column.)

There's much more to say about Flutter, but if you're interested in a more
in-depth analysis I recommend this article by Wm Leler.

Collapse
 
bgadrian profile image
Adrian B.G.

Best for what?

As @nitya provided a good objective answer I will give a subjective one

Flutter 🤠, although I am a JS developer for more than 9 yrs, Flutter is faster, simpler, overall better (or at least will be once it reaches a more mature level).

Collapse
 
kayis profile image
K

While I have the feeling that people will hype anything just becaue it doesn't come from Facebook (see Vue) I really have to look into Flutter :D

Collapse
 
bgadrian profile image
Adrian B.G.

try it, I heard it is like a drug, you cannot stop using it after you get the hot-reload taste.

Thread Thread
 
kayis profile image
K

I'm used to create-react-native-app and Expo, so this is something I already have.

Collapse
 
heithemmoumni profile image
Heithem Moumni

@BG I have put my question wrong, I will change it

but I mean for a small project, what is the best cross platform between this to code faster?

Collapse
 
aswathm78 profile image
Aswath KNM

I personally favour RN. Because it's JS and React.

I'm in India and talking to some of my friends. Surprisingly many of them favour Angular and Ionic because of its maturity .

Ionic's getting a lot of attention and upgrades in recent days .

Surprisingly people don't know about flutter that much, atleast in my circle.

Xamarian only a handful no of experts prefers it.

Collapse
 
ben profile image
Ben Halpern

I think React Native is the most "mainstream" which has some benefits. Dart is a fresh take which certainly can learn from RN issues and attracts folks who don't like coding in JS (which might be a more "advanced" crowd).

I don't know much about the Ionic tech or community but it strikes me as a pretty good tool which hasn't always found the consistent "why you should use this" message.

Collapse
 
maxlynch profile image
Max Lynch • Edited

Ionic's pitch as always been pretty simple: want to use standard web development tools/technology/libraries for mobile (and PWA/Desktop)? Ionic is a great fit.

Collapse
 
kayis profile image
K • Edited

I'd say, it depends.

I don't know much about Ionic or Flutter, just that Ionic got voted to be a rather bad framework in the Stackoverflow developer survey. Also, RN was created because frameworks like Ionic have bad performance.

When things like React-Native-DOM get traction, RN will also add a reliable way to make Web apps with one code-base.

On the other hand I only heard good about Flutter, the only thing that keeps me from it is Dart, hehe.

Collapse
 
maxlynch profile image
Max Lynch

Ionic wasn't mentioned at all in the last SO survey. If you're referring to Cordova, it was on both the most dreaded and most loved, so maybe there's a correlation.

Collapse
 
kayis profile image
K

Ah okay, I had the impression Ionic was always used with Cordova.

Collapse
 
jess profile image
Jess Lee

haha @nitya i bet you have feelings on this one!

Collapse
 
nitya profile image
Nitya Narasimhan, Ph.D • Edited

OMG where do I start? One of these days my opinions will get me in trouble but here goes..

Done. Yikes. That was too long right? I guess that will make you think twice before tagging me again :-)

Collapse
 
nektro profile image
Meghan (she/her)

No :D It was amazing!

Collapse
 
nitya profile image
Nitya Narasimhan, Ph.D

Somewhat related - an interesting thread:

The speculation was on the future of React Native.


It was instantly debunked from a Facebook/React authority.


My bigger takeaway from this discussion is this:

  • The "multi-platform native apps" model is evolving fast. We'll likely see many twists and turns in the roadmap for all technologies involved and that is normal

  • Using or dog-fooding technology in a non-trivial (complex & large-scale) app is key. It continues to be the proof-point for validating the health and viability of any technology

Collapse
 
twigman08 profile image
Chad Smith

Flutter has been gaining a lot more traction and even just browsing YouTube I am seeing videos of using Flutter create something a lot more.

I looked at it when it was still even newer and did a couple things with it. I liked how it tended to do things. I picked up dart in no time. Seems like a good language. I am also a C# developer. I see a lot of different influences from other languages in it.

To me a big thing to consider on frameworks is how easy it is to setup and get going. I got flutter up and going when I had never used it or Dart before in 10 minutes and had their hello world app going.
I followed the steps for React Native on Windows and had constant issues. Left a bad taste in my mouth. That might be unfair but I am a huge fan of a framework being really simple to setup and get going. It scares me away when something just doesn't work when following official documentation (I think a lot of JS based frameworks and libraries suffer from this).

Collapse
 
mbtts profile image
mbtts • Edited

This talk explains it in more detail, but the key trade-off is that React Native makes use of native platform widgets whereas Flutter rolls its own widgets. It is an oversimplification, but:

  • React Native has more chance of looking and working like a native application.
  • Flutter has more chance of meeting the performance requirements of a native application.

Inherent to understanding the trade-off is that in order to use platform native widgets React Native needs to bridge or map calls between interpreted JavaScript and platform native code, which has a performance cost.

React Native

Flutter gains performance both avoiding the overhead of this intermediary layer and also (in production/release mode) by running compiled code (hence Dart).

Flutter

Neither is likely to ever be as good as writing a native application, but both have the potential to be good enough.

Collapse
 
aswathm78 profile image
Aswath KNM

Flutter is still a developing ecosystem. Even though it is backed by Google there is no great community(its growing, but not complete).

For example I wanted to build a book reader for Mobile.(I don't use ionic so...) React Native is the obvious solution.

But the PDF parser or epub parser is not available in dart-lang(which flutter uses)

Companies or agencies with experienced developers or someone who can write everything from scratch, Flutter is your optimal solution. Because its performance is awesome(compared to react-native).

For Beginners React-Native or Ionic and Xamarin for C# devs.

Collapse
 
papafe profile image
Ferdinando Papale

I haven't used Flutter, Ionic or React Native, but I found myself pretty comfortable with Xamarin. I've been using it at work for a fairly big project and I didn't have many issues regarding it.
It also definitely improved over time since I've started working with it (about 4 years ago). All that I've said is mostly related to Xamarin native (Xamarin.iOS and Xamarin.Android), as I didn't touch Xamarin.Forms for a couple of years. Even though it's an amazing tool for prototyping, it really becomes a mess when one wants to customise more the UI, and then it becomes a mess. Besides, it's considerably slower than the native ones.

Collapse
 
gktim profile image
gkTim • Edited

Wrote some apps in ionic and really liked it.
It's fast enough (ionic team has done a great job with version 4 and capacitor)

It is pretty easy to ship the same app for web/desktop and mobile with one codebase which is awesome.

Until today we have never regret to switch to ionic. We had used Xamarin before and needed to write to much platform specific code (but it's been a few years now so I think it has changed)

A nice thing is with angular/ionic/nestjs we share the same stack between web/mobile and backend.

But you can also write ionic apps with react or vue if you like.

I would suggest try some in a small project and decide :)

Happy coding!

Collapse
 
richardtallent_70 profile image
Richard Tallent

I would choose Vue-native or Xamarin, depending on the app, since those align well with my normal web-based work. But honestly, I’m putting my long-term cards on PWAs.

Collapse
 
droidmakk profile image
Afroze Kabeer Khan. M

I've worked on React Native. I chose this platform after i went through lots of reference and core understanding. Though RN is mostly based on Native UI and JavaScript, it has a feature called component based rendering. Which makes it easy to design great UI's and Whole lot of community support. Also as the ReactJS framework's motto Learn once and write anywhere makes it even more preferable. Though, I think we must go with flutter if we are looking at an optimal mobile application. These are my thoughts critics most welcome!

Collapse
 
tejavenkatlanka profile image
tejavenkat lanka

React no

Collapse
 
devoresyah profile image
DeVoresyah ArEst

for now, I prefer to use React Native because of the community already big, have many dependencies, etc. but still have a plan to move to Flutter, idk when... just wait till many of people use it