CookieDev

Cross-platform development. Flutter or React Native?

9 min to read

If you decided to go with cross-platform development an can't choose which framework to choose - here is an article with summurized info about Flutter and React Native.

What is Flutter?
Flutter - it's an open-source UI software development kit created by Google. Using for developing cross-platform web and mobile apps.
Flutter was presented only in alpha and beta versions for a long time. The first stable version was released on December 4, 2018. Examples of Flutter apps: Google Ads, KlasterMe, Reflectly, Xianyu by Alibaba, Postmuse – Instagram photo editing app, Hamilton, Lunching, Pairing, Watermaniac, Cryptograph.

Pros of Flutter:
- Middle speed of development, which saves time and effort. It's a cross-platform development so that's allowed using the same code base for building simultaneously iOS and Android apps. This helps to speed up the whole process of the development.
- The "hot reload" feature allows making changes in code and receiving the result in the app preview, without recompiling the code. This helps simultaneously fix bugs, changing UI and other features at the same time.
- Full customization & fast rendering thanks to Flutter's layered architecture. It gives you control over every pixel on the screen and lets you overlay & animate graphics, video, text and controls without limits.
- You can also use Flutter for Web. For checking how native controls work it offers proper documentation- What's more, it also separates UI from native controls, which eliminates a lot of nuances and errors made by smartphone manufacturers. These might not happen too often but are difficult to omit with native development. Separate UI also means having a unified view of all system versions without an effort.

Cons of Flutter:
- Flutter is still an immature framework, that's why it's still unstable. That means a number of more or less problematic issues remain, along with a lack of more advanced features that leverage the capabilities of operating systems. Many of these features are not yet supported, with plenty of libraries being in the pre-alpha stage and showing limitations when comparing them to native counterparts (i.e. Google Maps).
- Dart language is also pretty immature. The existing functionality are not exactly well-refined. If we compare it to Kotlin or Swift it's the step back.- The size. Apps that are build using Flutter are large. They occupy a lot of space, take a long time to update or download.
- The difference between Native and Flutter components. Flutter doesn't create native components. It is represented in different versions of the system where text fields or buttons are different one from another, yet stay the same in Flutter.
- There are no documentations or recommendations that can be problematic during the dev flow.
- Dart language is fast-changing, which creates a problem if long support of the source code.

React Native - is a JavaScript framework for writing real, natively rendering mobile applications for iOS and Android.Examples of React Native apps: UberEats, Instagram, FaceBook, Walmart, Pinterest, Coinbase, Shopify, Discord.

Pros of React Native
- Faster to Build
The major selling point of React Native is the shorter development time. The framework provides numerous ready-to-apply components that can speed up the process. React Native still lacks some solutions, so you'd probably have to construct them scratch, but RN is based on JavaScript, which gives access to the largest package ecosystem in the world. Having access to such an extensive base of packages, you can rescue much time, and it'll only obtain better. As the RN community is growing and Facebook regularly introduces new s, we may discover prepared components for most of the solutions we necessity one day.

- One Framework, Multiple Platforms
React Native allows you to reuse the codebase (or just a part of it) between iOS and Android. Developing with JavaScript also provides an opportunity to share the codebase not only between mobile platforms but also React web applications. Active development of tools like React Native Web seems to point in this direction. This also allows the same developers to work both on web and mobile applications, as the technologies are very similar.

- Fast Refresh
One of the top React Native pain points was that the Hot Reload feature was broken. Most developers had it turned off as it was unreliable. The response to these complaints is Fast Refresh. This tool fixes all the issues that Hot Reloading has and provides a great developer experience that speeds up both building new features and bug fixing.

- Smaller Teams
If you choose React Native, you will mostly need JavaScript developer, who can write the code for both platforms. Obviously, apps with more native features will require more help from native developers as well. That said, in most cases, the team will be smaller in size, and thus easier to manage.

- Fast Applications
React Native code might hinder an app's performance. JavaScript won't be as fast as native code, but you won't see the difference in most cases, anyway.We ran a test and compared two versions of a simple application, written in React Native and Swift. Both apps achieved very similar performance results. Differences in performance were slight, almost unnoticeable to an average user. In the case of more complex applications, the framework might be less efficient, but you can always transfer some code to a native module, and it won't be an issue anymore.

- Simplified UI
React Native is solidly based on creating a mobile UI. In native development, you will need to create a sequence of actions in the application. RN employs declarative programming in which such an order of implementing actions is obsolete. As a result, it is much easier to spot bugs on the paths a user can take.

- Large developer community
React Native is an open-source JavaScript platform that allows developers to contribute their knowledge to the framework's development, which is freely accessible to all. If a developer experiences a problem, they can turn to the community for support. There will always be someone who'll be able to help them resolve their issues – this also has a positive impact on improving coding skills.

Cons of React Native
- Compatibility & debugging issues
Despite React Native is used by top tech players – it's still in beta. Your developers might come across various issues with package compatibility or debugging tools.

- Lack of Some Custom Modules
Lack of some components or underdeveloped. Perhaps you won't have a problem with that, as the majority of custom modules you need are available, well-documented, and working properly.

- Native Developers Still Needed
Implementing some native features and modules necessitates having detailed knowledge of a particular platform. The lack of out-of-the-box support for many native app functionalities (e.g. push notifications) used to be a significant issue with React Native development.
As the community grows, more and more open-source libraries provide easy access to native platform features. Nevertheless, the implementation of some more advanced features might still require help from iOS and Android developers. Their input depends on the complexity of your project, but you need to bargain for them when kicking off with React Native. This might be an issue for small teams, in which developers don't have any native mobile experience.

Which is better: Flutter or React Native?
Currently, React Native is more mature and stable - not to mention that it takes advantage of the most popular programming language, JavaScript, and already has a large community of users and supporters behind it. While Flutter is still immature and unstable.
Tetyana Holovchenko
Co-founder, Marketing specialist at CookieDev
Made on
Tilda