Choosing the right Mobile App platform

Well! You must have heard a lot about different mobile app development SDKs like Flutter, React Native, Native till now, but are you still confused about choosing the most suitable platform SDK? We at TBO had a similar question in our mind when we decided to choose hybrid mobile development approach. This article will highlight why at TBO, we need cross-platform SDKs and evaluate the pros and cons for Flutter and React Native. We have also added points for native development platforms at some places for better comparison. This comparison helped us in late 2019 to decide which framework to choose for our future products.

Quick Introduction

React Native

React Native (RN) is an open-source UI software framework created by Meta Platforms, Inc. It is used to develop Android, Android TV, iOS, macOS, tvOS, Web, Windows, and UWP (Universal Windows Platform) by enabling developers to use the React framework and native platform capabilities¹. (Developer Site)

Flutter

Flutter is an open-source UI software development kit created by Google. It is used to develop cross-platform applications for Android, iOS, Linux, Mac, Windows, Google Fuchsia, Web platform, and the web from a single codebase². (Developer Site)

What is Cross-Platform and WHY?

Cross-platform means a single code base that can run on various operating system. Typically for mobile apps, this would suggest writing a single code and running it on Android and iOS instead of developing different app versions for each platform. Below are some essential points to consider:

Faster Development: Single code base means development will be much faster. Instead of discussing with two different teams (Android and iOS), you would do brainstorming with a single team and saving much time and faster development. Time to Market is significantly less in this case.

Development Cost: Since a single team is aligned for the development instead of two, the development time and resource cost will be almost half. Indeed, the verification process will be shorter for the second platform as you have already verified business logic and are now left with only platform-specific testing. Start-ups can benefit a lot from this.

Maintenance: Single code base is always better maintainable as both platform works in sync and yields better productivity. Any bug fixes in one platform resolve it for another platform as well. Hence, saving a lot of engineering bandwidth.

Sync Both Platforms: Ideally, in Native, development speed would differ for both resources. It affects release planning as well. While one app might be ready for release, you must wait for another platform to complete. With a single code base, both apps would be prepared simultaneously.

Proof of Concept (POC): If you are a start-up and pitching for your idea, you can quickly have a prototype ready for demo instead of having a full-fledged app. Build a Minimum Viable Product (MVP) promptly with cross-platform. You can even trail it in the Market before investing big-dollar budgets for bigger teams.

The Comparison

Programming Language

Flutter is based on Dart language. Dart is an object-oriented programming language designed for client development — web and mobile apps. Read more about Dart.

RN is based on JavaScript (Node.js) and React. Here is the original article by Meta (Earlier FB) published- https://engineering.fb.com/2015/03/26/android/react-native-bringing-modern-web-techniques-to-mobile/

Native App language is platform-dependent, and Android apps can be built using Kotlin or Java. Typically, the  iOS app uses Swift for the native app. As a single developer, you need to learn two different languages if you want to build for both platforms.

Learning Curve

There is no substantial proof that one platform is simpler than the other. So in this respect, we would consider all platforms equal. It depends on individual capabilities and, more importantly, one’s searching ability to find relevant tutorials and solutions for your problem. However, both platforms are easy to start with, and any developer with little experience can kick start.

Prebuild Components

Flutter has a rich range of prebuild components available and open source at https://pub.dev/ while RN has limited components available.
App Popular ~ Industry Acceptance
React Native is currently being used by companies like Meta (for Facebook, FB Ads Manager, Instagram), Bloomberg, Discord, Pinterest, Walmart, Delivery.com, Wix, Salesforce, Skype, Tesla, UberEats, Shopify etc. to name a few.

Companies like Google are currently using Flutter (for Google Ads, Google Assistant, Google Pay, Stadia etc), Tencent, Nubank, Alibaba (for Xianyu), SpaceX Go, ByteDance, Hamilton, New York Times, BMW, Dream11, Groupon, eBay, Philips Hue, Toyota, Ubuntu, Reflectly, Kotak Bank, PostMuse etc. to name a few.

Documentation

Flutter provides excellent documentation support. The official http://flutter.dev/ itself is enough to kick start development. However, React Native documentation is very weak. Although RN has an official website, https://reactnative.dev/docs/getting-started is trying to catch up now.

Technical Architecture

Flutter is based on Skia (2D rendering library), which is also used on many other projects like Chrome, Android, Chrome OS, Mozilla Firefox etc. RN is based on Redux/MobX(a JavaScript Library)

Device Features

Flutter provides inbuilt support for many device features via its libraries. One of the significant disadvantages of RN is that developers have to depend on 3rd party plugins for these features. Many times, your app break because of these dependencies.

Performance

The performance of Flutter and React Native is almost identical. Both have a framework that is optimized to work best in cross-platform.

Maintenance

Flutter projects are always backward compatible. However, RN projects can cause issues in this case. The main reason is its dependency on 3rd party libraries.

Hot Reload

The best thing about Flutter and RN is the hot reload functionality. The hot reload feature helps developers quickly and easily experiment, build UIs, add features, and fix bugs. It makes cross-platform development much faster than native development.

UI/Experience

Flutter app, by default, gives the same user experience for both Android and iOS apps. Flutter works on the theming principle (Material, Cupertino etc.). So, Flutter apps looks precisely the same on both platforms. However, RN converts UI into the respective platform. As a developer, you would not be sure about UI visible on different OS/Platforms.

Screen Control

Flutter gives you pixel-level control on the screen while RN controls component level.
Community
One of the most significant aspects is the developer support and community. As of Feb 2022, the following are community status for both projects.

Github stars:

Stackoverflow followers:

Launch Date

RN was launched in 2015, F8 Conference whereas Flutter was launched in 2018 in Google I/O.
As TBO Group, we choose to bet on Flutter, looking at its advantages. It was a good bet looking at the business cases we have to cover and in-house skills set us had. This bet was taken at the end of 2019, and now most of our products work on Flutter, and they have a successful User Experience.

Summary

Below is the quick summary of this article:

  Flutter React Native
Programming Language Dart JavaScript and React
Learning Curve Easy Easy
Prebuild Components Very Rich 3rd Party
Documentation Excellent Novice
Technical Architecture Skia as rendering engine Redux/MobX (JS Library)
Device Features Inbuilt support 3rd Party dependency
Performance Great Great
Maintenance Backward Compatible Breaks easily
Hot Reload Great Great
UI/Experience Same in all devices Respective to platform
Screen Control Pixel-Level Component Level
Community Strong Good
Launch Date Google I/O 2018 F8 2015
UI/Experience

[1] https://en.wikipedia.org/wiki/React_Native

[2] https://en.wikipedia.org/wiki/Flutter_(software)