Flutter vs React Native Development: A Business Perspective

It’s easy to get the appeal of cross-platform mobile development, whether you’re a business executive or a developer. Instead of having ‘two of everything’, that is, separate apps for iOS and Android, you get one team, predominantly one technological stack, shared and reused code between the platforms, and a drastically shortened development time.

Saving time and resources sounds great, but which of the many popular frameworks to choose? There are Xamarin, Qt, Ionic, and many others, all with their own pros and cons.

Today, we’re comparing one of the dominant frameworks in the cross-platform mobile development world—React Native, and a rising star on its way to peak hype—Flutter. Learn what’s common and what’s different between the two, as well as their selling points and bottlenecks, and decide which one will work best for your future multiplatform mobile app.

The framework was created by Facebook and officially rolled out in 2015. It is for building cross-platform applications with JavaScript, and is based on React (Facebook’s own component library for UI development).

Well-established, reliable, and popular with developers and enterprises alike, React Native has been used to create the current versions of Facebook and Instagram for iOS/Android, as well as Uber, Pinterest, Skype, Salesforce, Walmart, Wix, and many other cross-platform mobile apps.

It should be mentioned though, that some high-profile enterprise users, like AirBnB and Udontry, have been moving away from React Native in recent years, opting for native app development instead.

On paper, Flutter and React Native come surprisingly close in the ‘multi’ aspect of the multiplatform development. In addition to the two dominant mobile platforms, Flutter also covers development for Windows, Linux, macOS, web, and the soon-to-be-unveiled Fuchsia. React Native is just a little behind, with React Native for Windows already announced in May 2019, along with established plans to expand to macOS in the near future.

However, if you’re looking to cover ground beyond iOS and Android apps right now, React Native is still likely to be the better choice. Why? Let’s examine the current state of both frameworks, platform-wise, a little closer:

Currently, React Native stably covers mobile (Android, iOS) and web (although there are some gaps and limitations still), which means everything that’s able to run a browser. All the while Flutter is just gearing up to do the same, with many developers considering it not being production-ready just yet. The state of things will likely change in a couple of years, but right now if you’re looking to realize your own project in enterprise mobile application development, React Native is the way to go.

React Native is based on JavaScript, the most widely used programming language as of 2019. In a survey by JetBrains, 69% of respondents were practicing JavaScript, with an additional 5% planning to adopt it soon.

Created in 1995, the language has a long and rich history, countless supported frameworks, ‘enhancements’ (like TypeScript and Flow), and an active community of devoted users. Because of the vast accumulated knowledge, innumerable courses, how-tos and tutorials available, learning and using JavaScript is considered relatively easy and, to a degree, a must-do for developers.

It’s safe to say that prior to the release of Flutter, there was almost no commercial incentive for developers to learn Dart, due to its ‘a solution in search of a problem’ status. It is not nearly as widespread as JavaScript; it’s also almost two decades younger and can be hard to learn for new programmers, despite its admittedly top-notch documentation.

The Dart tutorials and courses are sparse, although new ones are added by the day. Knowing JavaScript prior to approaching Dart can also help, since the latter’s syntax borrows elements from JavaScript yet stays unique overall. For seasoned developers with prior experience, however, learning the language should not pose a considerable problem.

Of the two languages, Dart is considered the faster one. Compared to the interpretable JavaScript, it can be compiled ahead of time (AOT) and just in time (JIT), utilizing the strengths of both methods for better process optimization and faster development.

When choosing between open-source cross-platform development frameworks, the tech-stack considerations should still be a priority, including a comparison of programming languages and such factors as the ease of finding existing developers and training new ones.

Both React Native and Flutter position themselves as frameworks to create natively compiled apps, and there is much truth in it. But their approach to building UI is fundamentally different.

To build interfaces, React Native uses system UI components, while Flutter has its own widgets for it. Where React Native provides a “wrapper” for native, platform-specific UI components of Android and iOS, Flutter essentially creates the elements itself, using the third-party 2D graphics library Skia for drawing them from scratch each time.

The advantages of Flutter’s approach are in the details: developers have two sets of widgets for Android and iOS—named “Material” and “Cupertino” respectively—and can create custom widgets as well as customize the existing ones.

It also means that Flutter avoids one of the main limitations of React Native (and of many other native-component GUI builders for that matter). Namely, the problem of using platform-specific native GUI components of iOS or Android when there are no direct analogs to these components in other platforms.

Where React Native has to either work around such elements or abandon them completely, Flutter just creates the 100% same thing for iOS and Android with no hassle. While this potentially can lead to some inconsistencies in the overall style (like iOS-looking elements in Android apps), it still means less UI testing is necessary, since this is where Flutter’s got you covered.

Flutter was created by Google, so, naturally, Android components are very well-supported and prioritized. However, iOS widgets can be somewhat lacking, especially when it comes down to legacy design, staying behind iOS updates, guideline compliance, and visual consistency.

New iterations of iOS and Android roll out every year, which means UI changes. Flutter’s GUI building will inevitably have to play catch-up or risk making the apps created with it look dated. Striving for a native look as much as possible will come at a cost in terms of more complex code and additional development time, while the results might still not be 100% on the money in the end.

Still, Flutter shows great capabilities in quick prototyping and showcasing, and like React Native, it has the hot reload functionality. Allowing to quickly evaluate the impact of code changes visually, hot reload dramatically speeds up UI testing, which would otherwise take much longer.

In short: if having 100% native UI elements is crucial for your cross-platform development project, React Native is the right choice. If a lot of flexibility at the expense of some ‘nativeness’ is preferable, Flutter is the better option.