Flutter vs React Native: Which one is better?

Photo by Piret Ilver on Unsplash

When it comes to defining the tech stack for your cross-platform mobile app, the choice between Flutter vs React Native is not obvious. Both promise you a fast development cycle, lower cost compared to native app development, and a beautiful and performant app as a result.

Yet, React Native and Flutter are very different from a technology point of view. We discussed their upsides and downsides with Islam Rustamov, an experienced React Native Developer at Proxify and made a quick comparison. Hopefully this article will help you decide which technology may bring more benefits to your future app.

Will Flutter replace React Native?

The rule of thumb in the fast-changing tech world is to avoid choosing either dying or immature technologies. While the former may get you into trouble with long-term maintenance the latter may appear unreliable and cause difficulties at the development stage.

At this time, neither React Native nor Flutter falls into undesirable categories. Those projects are backed by big corporations (Facebook and Google), have active communities, robust functionality, and healthy development paths with regular releases of new features and fixes.

Despite being a younger technology, Flutter may soon take the lead in popularity ratings. According to Statista’s worldwide developer survey, it almost leveled up with React Native in usage, in 2020.

GitHub’s popularity metrics for both projects are also very close, with 95.2k stars and 20.4k forks for React Native vs 110k stars and 15.6k forks for Flutter at the beginning of 2021. But what makes Flutter and React Native so attractive for developers and which one is cooler from the technology perspective?

Is Flutter better than React Native?

Let’s quickly go through the list of characteristics often used to compare Flutter against React Native and see how they influence mobile app projects.

Programming language

• React Native uses JavaScript, the world’s most widespread programming language.
• Flutter uses Dart, a powerful programming language, however less known and popular.

It’s easy to find developers proficient in React Native as many programmers have picked it up for five years. Hiring Flutter developers may appear a bit more challenging as not that many people have got proficient in it for just two years of its existence.

“In contrast to JavaScript (which is mostly a declarative programming language), Dart is more of a C-like language and therefore is imperative. It means that Dart code is less readable for a human than JS code. But it gives an advantage when it comes to building animations. Using imperative approach allows you to achieve a higher frame rate (FPS) for smoother motions.” – Islam Rustamov, React Native Developer

Software dependencies

• React Native works as a wrapper for platform-specific components, extensively uses third-party libraries with different components for iOS and Android.
• Flutter uses a universal Skia graphic library to independently render all app widgets without third-party libraries or platform-specific modules.

As Flutter doesn’t rely on native platform widgets, you’ll be able to build a more brand-driven UI that doesn’t break on different devices and requires less testing than the UI made with React Native. That said the UI created with React feels more ‘native’.

Developer productivity

• React Native has a big ecosystem with numerous ready-to-implement solutions that speed up the development process.
• Flutter has the killer hot reload feature that allows developers to quickly apply code changes to experiment and debug faster.

Although React Native also has the hot reload feature developers often complain that it doesn’t work as well as that of a Flutter and doesn’t speed up development as supposed.

“Imagine you face a simple task. You need to create an action sheet or a picker. With React, you’ll look for ready-to-use packages and may come across some outdated, not supported, or unpopular (having about 20 or even less downloads per month). With Flutter, you won’t need to install a separate package to create a picker because it already has one picker widget from Material UI (Android devices) and another from Cupertino (iOS devices). All you have to do is to show the widget that corresponds to your platform.” – Islam Rustamov, React Native Developer

Code architecture

• React Native has two proven approaches to architect maintainable and scalable apps using Flux and Redux.
• Flutter allows choosing between multiple approaches to architect your app, such as BloC, Redux, GetIt, Provider, etc.

Flutter is often recommended for prototyping, while React Native for building scalable and maintainable apps. This is because Flutter gives a lot of freedom in deciding how to architect apps, which may lead to building apps with inconsistent or mismatching architectures.

Automated testing

• React Native requires using third-party tools, like Appium or Detox, that don’t have official support for testing apps UI and integrations.
• Flutter has a robust framework for the automated unit, widget, and integration testing with detailed documentation.

React Native apps are harder to fix bugs and the process takes longer than with Flutter apps because they have more third-party dependencies. Also, React Native’s documentation is less clear and helpful.

Build and release

• React Native’s documentation doesn’t cover deployment and release automation, however, it can be done with a third-party tool Fastlane.
• Flutter offers its own properly documented build automation tooling as well as official instructions on how to use Fastlane to deploy apps.

Flutter promises a more flawless deployment and release experience, whereas with React Native it will depend much more on your developers’ proficiency.

App performance

• React Native relies on a JavaScript bridge to compile code into native code at runtime using the JIT method, which slows down the app.
• Flutter has a built-in C++ engine that compiles code into native code using the Ahead-of-Time (AOT) method to ensure quick startup time.

Flutter apps have a faster startup time and, in general, are considered more performant and stable than React Native apps. This is caused by React Native’s additional JavaScript layer that processes app calls into a native API to communicate with OS modules.

“From the developers’ perspective, it is relatively easy to jump onto Flutter from React Native. There are a lot of common concepts, such as widgets/components with or without states, the way your UI rerenders due to state changes, styling of your screens, and more. JavaScript developers usually find Dart pretty similar to JS. Personally, I perceive it as an object-oriented version of JavaScript or even, I’d say, TypeScript.” – Islam Rustamov, React Native Developer

Need help with choosing a tech stack?

Our React Native vs Flutter quick comparison might help you make some conclusions about which framework or development kit to choose. Still, as every app is unique, you shouldn’t make fast decisions.

If you are still in doubt about the right technology, let us help you. On Proxify.io you can get a free-of-charge consultation on your project tech stack as well as feel your Flutter developers or React Native developers hiring needs. Feel free to reach out with your questions and get a few steps closer to your app launch.