Why I Ditch React Native for Flutter
Tags: reactnative, flutter, mobileapp
Published: 2020-08-12 09:35:58

---
title: Why I Ditch React Native for Flutter
published: true
date: 2020-01-08 19:00:00 UTC
tags: reactnative, flutter, mobileapp
canonical_url: https://flyingnobita.com/posts/2020/01/08/mobile_dev_framework
cover_image: https://dev-to-uploads.s3.amazonaws.com/i/96zqykdoasc9ik9h8qyg.jpg
---

Deciding between React Native and Flutter turns out to be a lot easier than I expected!

## Table of Contents 

1. [Requirements](#requirements)
2. [React Native](#react-native)
3. [Flutter](#flutter)
4. [Summary](#summary)

In a [previous post](/general/2019/02/04/building_google_lens.html), I talked about building my version of Google Lens because it lacked a few features that I wanted and was also not readily accessible in phones unless it was a Pixel. Fast forward a year, Google has made a lot of improvements to the app and I can also install it in all my phones (various Android & iOS).

While I was looking for ways to build the mobile app quickly, I realized it was going to take a bit more effort than a day or two. Mobile app development is something that I was always intrigued by, but never took the time to learn.

It’s about time.

## Requirements

Picking a framework took some time as it has to satisfy my requirements:

### 1 - Cross-platform (Android & iOS)

It doesn’t make sense to create a mobile app today that can only be used by some and not others. Maintaining two separate code base also doesn’t make sense for an individual or a small team of developers.

As I won’t be creating any complex games that require super-fast response time or apps that use advanced hardware features, a cross-platform framework fits the bill nicely.

One can also get around this problem by building a web app. However, I think the performance and native experience from a native app is a significant advantage over problems such as app fatigue. [Progress web app](https://medium.com/james-johnson/a-simple-progressive-web-app-tutorial-f9708e5f2605) might be a possible solution at some point.

### 2- Reputable and Trust Worthy Provider

With so many cross-platform frameworks out there, it is important to pick one that is gaining momentum, or at least it’s not showing any signs of [death](https://github.com/jquery/jquery-mobile/releases). No framework will last forever, but you want to pick the one that lasts long enough so you aren’t forced to migrate in the coming few years.

![Google Trends Platform Comparison for last 5 years](https://res.cloudinary.com/flyingnobita/image/fetch/c_limit,f_auto,q_auto,w_768/https://flyingnobita.com/assets/images/posts/mobile_dev_framework__platform_trends_comparison.webp)<figcaption><p>Google Trends of the past 5 years</p>
</figcaption>

### 3 - Large eco-system

It is hard to build any apps today that only use what’s provided in the framework. One usually makes use of various plugins/libraries that are written by other open-source developers so to speed up the development process (numpy and pandas library are what made Python so popular amongst people who work with data).

![Python Scientific Ecosystem](https://res.cloudinary.com/flyingnobita/image/fetch/c_limit,f_auto,q_auto,w_768/https://flyingnobita.com/assets/images/posts/mobile_dev_framework__scipy-ecosystem.webp)<figcaption><p>Python Scientific Ecosystem (Source: Jake VanderPlas, PyCon 2017)</p>
</figcaption>

### 4 - Modern, Lightweight & Friendly Experience

Since I’m starting from scratch, and I intend the projects that I develop to be for my personal use, I can dismiss corporate-friendly languages such as C# or Java, and look for a language and framework that provides the best experience for an indie-developer or small team.

## React Native

When considering all the above, I thought React Native would be best. React uses Javascript and JSX, which will get me more familiar with Javascript. It is a spinoff of React, and thus I can take this opportunity to get to know React better and build web apps with it later. Two birds, one stone. Besides, the ecosystem is probably the biggest with Facebook putting a lot of resources into it.

Unfortunately, I had a lot of hiccups getting started. I followed the official tutorial and started with [Expo](https://expo.io/), which is supposed to make it easier for beginners to learn RN. Unfortunately, I had problems getting it to run on my device (while it was working fine on the simulator) and it took a good night to get it to work. Debugging the infrastructure while trying to learn the framework isn’t fun.

Nonetheless, I continued coding for the next few weeks and made some good progress in getting a prototype with a few basic features to work.A major thing that bugged me is RN’s implementation that surrounds components. Everything in RN is a component, and all components are controlled by its props (properties) and state. In a component, you define the view, style and behaviour (logic) all in one place. I find this to be very confusing.

Also, everyone seems to have their state management system, and it isn’t easy for someone starting new to pick the right one. I used Redux initially but quickly I found myself wanting to switch.

## Flutter

During the midst of crawling along with RN, I noticed that more and more people were using Flutter, now that it has some time for people to use it after it went out of beta in Dec 2018. One drawback of Flutter is that it is made by Google. Google has a horrible history of [killing products](https://gcemetery.co/), even if there is a significant amount of people still using them.

Flutter also uses Dart, a language that I have never used before. Though I was promised that it was an easy language to learn. After following their tutorial, I find myself spending a fraction of the time it took to rebuild my existing RN prototype! Moreover, I also got it to work on my iPhone without much hassle. It has been a while since I lasted worked with a static typed and compiled language, as a good chunk of the last decade or so I’ve been programming in VBA, Python & JavaScript. SQL is probably the closest to static define types as I got. And to be honest, I was quite happy about it, the same was I was happy about the introduction of Type Hints in [PEP 484](https://www.python.org/dev/peps/pep-0484/) from Python 3.5.

Unfortunately, things are not all rosy with Flutter. One thing that Flutter still falls behind is its ecosystem, especially when compared to RN. For example, I was looking for integration with Stripe for payments but the plugins available at the time only provided credit card payments that require the user to input the card details each time, definitely not ready for production use.

## Summary

While not everything is perfect with Flutter, it has instilled good faith in me. I watched some of [Flutter Interact 2019](https://www.youtube.com/playlist?list=PLjxrf2q8roU0o0wKRJTjyN0pSUA6TI8lg) live and I have increasing confidence that Google will not be killing this product anytime soon. The Flutter community is also growing quickly. [Flutter Web](https://flutter.dev/web) has also been making good progress and entered the Beta phase. If the current pace continues, I will be able to launch mobile, web and desktop apps with a single codebase pretty soon.