Flutter vs React Native-What to choose in 2020?

Maitry B. Bhamore -

Flutter Vs React-Native is the constant ongoing tug of war between two hottest cross-platform app development technologies ever since Flutter arrived on the scene in December 2018.

Google tried resolving the issue of cross-platform app development by introducing Flutter, which otherwise remains a major challenge for app developers.

We know Apple and Google have native tools and technologies to build apps, whereas iOS app developers build apps using X code and Swift, while Android developers use Android Studio and Kotlin/Java.

But, this requires developers to learn two different sets of technologies. And, developers are looking for an alternative to build mobile apps, especially for iOS and Android (with faster speed and less resources).  

As a result, developers started adopting cross-platform solutions over the native solutions to build apps for both iOS and Android faster using a single language. And here comes the cross-platform app development to the rescue.

Cross-platform app development has gained popularity today, as it can develop mobile applications for multiple mobile platforms.  

So, it is clash of the titans kinda battle here- where the opponents are Google’s Flutter and Facebook’s React-Native.  

React-Native has been there done that! It is quite popular among bigger brands like Facebook, Instagram, Skype and Bloomberg etc.

On the other hand, Flutter has a long way to go before it becomes everyone’s darling technology for app development.

Nevertheless, many developers have already started considering Flutter as the future of mobile app development.

React-native is an open-source framework released on GitHub that unites both iOS and Android platform’s native APIs.

Whereas, Google’s Flutter has been a revolutionary move, which allows you to create Android and iOS highly responsive native apps at the same time using the same code.

What is Flutter and React Native?

Flutter

As per Wikipedia- Flutter is an open-source UI software development kit created by Google. It is want to develop applications for Android, iOS, Windows, Mac, Linux, Google Fuchsia and for the web.

The first version of Flutter was referred to as code name “Sky” and ran on the Android OS.

Flutter is Google’s UI toolkit for crafting beautiful, natively compiled applications for mobile, web, and desktop from one code base.

Flutter works with existing code, is employed by developers and organizations round the world, and is free and open source.

React Native

As per Wikipedia- React Native is an open-source mobile application framework created by Facebook.

It is used to develop applications for Android, iOS, web & UWP by enabling developers to use React along with native platform capabilities.

React Native helps developers reuse code across the web and on mobile, and they won’t have to build the same app for iOS and for Android from scratch – reusing the code across each operating system. And the specialty feature is that there is very little difference between a finished app built in Objective-C or Java and one built using React Native.

Flutter vs React Native – Programming Language

Flutter is built upon the Dart language, which was made by Google too. The language is considered a  niche in the developer community but is in no way a tough language.

If  you have any experience with object-oriented programming, then learning Dart will be a cakewalk. A thorough guide, along with examples can be very easily found at the official documentation.

React Native, on the other hand, uses JavaScript as its base language. Over the years, JavaScript has gained immense popularity due to its easy learning curve and  widespread usage.

If someone is well versed with JavaScript, they can  start developing applications using React Native without wasting much  time getting accustomed to the framework.

Therefore,  we can say that in terms of programming language, React Native takes  the point as it is much easier to get into, compared to Dart and  Flutter.

Flutter vs React Native – Documentation

Prior  to beginning a project, there are a lot of essential steps that include  configuration of the framework in use along with its peripheral  requirements.

This can include trivial tasks like setting up an IDE for  proper syntax highlighting. Even trivial tasks like these can become  extremely hard to figure out without proper documentation.

Flutter  makes up for its infancy as a framework and choice of niche language  for development with a well structured, detailed and easy to understand documentation.

If one were to religiously follow the documentation, no  stone would be left upturned. The getting started guide provides  intricate instructions on IDE setup, project configuration, etc.

Flutter  also has a command line based tool called Flutter Doctor,  which guides the user through the whole configuration and setup process  by showing what has been installed, and the elements that still need to  be installed.

React Native, doesn’t even come close to Flutter when it comes to structured documentation. Comparing the ‘beginner’s guide‘  to both, we find that React Native assumes a lot about how much the  developer knows and hence seems to lack essential information.

For example, there is little to no information on the Xcode command  line tools. The documentation directly jumps to the step of creating a  new project.

Flutter vs React Native – Installation

Installation  is a big part when comparing two frameworks. Installation should be  easy, and devoid of complicated configuration processes. Above that, the  whole installation process should be well documented in the official  documentation.

Flutter can be installed by downloading the binaries for your respective platform from their official page and then setting a few path-variables. Meanwhile, React Native can be easily downloaded using NPM.  

Developers with a JavaScript background will find it extremely simple  to get React Native up and running. On the Mac OS side of things, React  Native has to be downloaded using Home Brew.

Android App Development Certification Training Instructor-led Sessions Real-life Case Studies Assignments Lifetime Access

Both Flutter and React Native lack one-liner installation with native package managers for a specific OS, but Flutter installation seems to require  extra steps for adding the binary to PATH and downloading it from the  source code. Hence, my point goes to React Native again.

Flutter vs React Native – Architecture

Flutter uses the  Dart framework which has most of the components inbuilt. So, it’s bigger  in size and often does not require the bridge to communicate with the  native modules. The Dart framework uses Skia C++ engine which  has all the protocols, compositions and channels.

The architecture of  the Flutter engine is explained in a detailed manner in their GitHub Wiki. In short, Flutter has everything needed for app development in the Flutter engine itself.

React Native architecture heavily relies on JS runtime environment architecture, also known as JavaScript Bridge. The JavaScript code is compiled into native code at runtime. React Native uses the Flux architecture from Facebook.

There is a detailed article on the core architecture of React Native. In short, React Native uses the JavaScript Bridge to communicate with the native modules.

Flutter  engine has most of the native components in the framework itself and it doesn’t always need a bridge to communicate with the native components.  

React Native, however, uses the JavaScript Bridge to communicate with  native modules, which results in poor performance.

Flutter vs React Native – Features and API Components

Choosing a cross-platform approach to develop an application comes with a few compromises, the biggest one being no direct access to native features like Bluetooth, various sensors, etc. Most  cross-platform frameworks provide supplement APIs that provide access to  these features.

In the  case of Flutter, its API is rich in everything that is needed to access  these native features.

The framework is bundled with UI rendering  components, device API access, navigation, testing, stateful  management and loads of libraries. If you happen to choose flutter as  your choice of framework, then you will find everything you need in  Flutter itself, without relying on third-party applications.

React  Native provides the bare minimum when it comes to features and API components.

With React Native, a developer is just provided with UI  rendering and device access modules. For native features, React Native  is heavily dependent on third-party libraries and modules.

This clearly makes Flutter the winner when it comes to Features and API.

Flutter vs React Native – Developer Productivity

Flutter is  a relatively new framework. So,  while the easier stuff can be achieved  in almost no time, as your application gets more complicated, it  becomes a tedious job to keep up for some developers.

If the developer  is not accustomed to Dart, he/she might have to spend a good chunk of  time researching and learning how to implement the things he wants.

On the other hand, React Native is based on JavaScript and hence thrives from the resources available. Also, since JavaScript is  considerably easier to learn, any new feature that might need to be  implemented, can be easily learned and quickly implemented.

So, React Native is the way to go if your focus is developer productivity.

Flutter vs React Native – Community Support

An  active community means quicker bug reports, more creative feature  suggestions and most of all, a good chance at troubleshooting  complicated doubts.

Flutter being the  newer of the two frameworks, obviously has a smaller community than  React Native. None the less, the Flutter community is going through tremendous growth.

With the backing of a company like Google, Flutter is  also garnering the trust of many to implement it in their projects.

At  this moment, React Native surely has a much more diverse community that even hosts international meet-ups. Though, given enough time, I think  Flutter will emerge with an equally thriving and active community too.

Flutter vs React Native – Testing

Flutter, being the feature-rich framework off the two, also comes along with testing modules. This helps in unit testing, widget testing and also integration testing. Above that, the usage of these modules is clearly explained in the documentation.

React Native isn’t so expansive when it comes to testing. It provides a  few unit testing functionalities through JavaScript frameworks and  snapshot testing can be done using tools like Jest.

For other sorts of  testing, applications built using React Native heavily depend on third-party applications like Appium.

Ergo, Flutter is much more convenient if the testing of your application is a major concern.

Flutter vs React Native – Release Automation Support

Releasing  a native application to the respective application store portals – Play Store for Android, and App Store for iOS, is a tedious process. With a  cross-platform application, it can become a grueling task and automating  the process can be tons of help.

Flutter  has a strong command line interface. We can create a binary of the app  by using the command line tools and following the instructions in  Flutter documentation for building and releasing Android and iOS apps.

On top of this, Flutter has officially documented the deployment process with Fast lane.

React Native, natively doesn’t support any sort of release  automation.

The process found on their documentation is a completely  manual one. None the less, third-party applications like Fast lane can be used for automating the build and release process.

Flutter vs React Native – CI/CD Support

The  DevOps cycle has brought about a major change in how applications are  released and then maintained so that they comply with industry  standards. An essential process in the DevOps cycle is continuous  integration/continuous delivery or CI/CD in short.

Flutter has a section on Continuous Integration and Testing which includes links to external sources.

However, Flutter’s rich command line interface allows us to set up CI/CD easily. React  Native doesn’t have any official documentation on setting up CI/CD.

However, there are some articles which describe CI/CD for React Native  apps.

React Native and Flutter both have their pros and cons, but  Flutter came out as the winner in this match.

Many industry experts have actually predicted that Flutter will bring about a revolution in the mobile application development industry.

Given the comparison we performed on various parameters, we can conclude that the prediction has a good possibility of becoming a reality.

Final Outcome:

After going through this Face-off comparison on Flutter Vs React-Native, we can easily say that it is very tough call here to pick one out of the two great technologies. But Flutter has come out stronger in this analysis report.

Although both have a fair share of advantages & disadvantages to their credits but the idea is to fill the gap between Android & iOS platforms. And Flutter seem to have an edge as Google recently announced the Flutter Beta 2 ( to combat its earlier alpha versions, which took longer to complete a project), that offers even better and improved developer tools and asset system.  

Following are the points to be considered before making any final decision for your projects this 2020-

  • Some of the industry experts have predicted that Flutter is the future of mobile app development.     
  • We must not forget that Flutter is fairly new technology in app development industry &  React-Native is a seasoned player with a huge base of achievements to  showcase its prowess.  
  • React-Native takes lesser development time, which is a huge USP.  
  • Although, many developers declare Flutter as the future of  app development, the final choice has to be made by the developers  based on their specific requirement