React Native vs. Flutter — Deviniti score
Applications are reaching popularity peaks. New apps are released every minute, and the need for efficient app development is ever-growing. You must stay within budget, deadlines, and still deliver user-friendly software. The situation gets difficult when your product is aimed at various platforms. Rewriting codes is expensive, so cross-platform frameworks for apps are gaining interest. The most recognized ones are React Native and Flutter. Both have their capabilities, limitations, communities. But which one is better? In this article, we will rate both frameworks in detail to provide you with unique insights and help you decide which one will work best for you.
Cross-platform frameworks — making things faster
Considering how many devices we have nowadays, cross-platform frameworks are becoming a standard. Designing software for a single platform isn’t cost-efficient when more platforms come into play. Who would want to rewrite a mobile app from one system to another? With cross-platform frameworks, you can start single projects and reuse large portions of code between specific platforms. As a result, you can quickly launch several versions of your app. This comes with drawbacks: cross-platform apps are often slower and harder to design than single native ones. However, the pros in terms of saved time and money usually outweigh them.
There are several cross-platform frameworks in existence: Cordova, Ionic, Xamarin, RubyMotion, React Native, Flutter… Each of them provides programmers with essential tools and libraries to build fully operational cross-platform applications. The currently trending ones are React Native and Flutter. Their use is slightly different yet comparable. That is why it’s a good idea to analyze these two frameworks in different aspects.
What is React Native?
We’ll begin with the older one. React Native is a cross-platform framework for building mobile applications, created by Facebook in 2015. React Native started as a prototype for iOS platforms, introduced by John Walke during an internal Facebook hackathon in 2013. React Native is mostly based on JavaScript — a popular programming language. It allowed for building mobile apps for business giants such as Facebook itself, Instagram, Tesla, Walmart, or AirBnB. The last stable React Native version (0.64.2) was released on 3 Jun 2021.
What is Flutter?
Now let’s move on to Flutter’s definition. It is also a cross-platform framework for building mobile applications, created by Google in 2018. It started as a framework called “Sky” for Android platforms at a Dart developer conference in 2015. Flutter is mostly based on Dart — a young but easy-to-learn programming language. Famous companies which built their apps with this framework include Google itself, Groupon, Alibaba Group, eBay, and BMW. Flutter was also used to build Google Fuchsia — a promising (most likely cross-platform) operating system. It’s still a work in progress, but it might soon compete with Chrome OS or Android. The last stable Flutter version (2.5) was released on 8 Sep 2021.
React Native vs. Flutter — common things
Before we dive into the differences between these frameworks, let’s see what they have in common. Both React Native and Flutter:
- Allow for creating desktop, mobile, and device apps;
- Provide good-looking and native-like graphics and navigation;
- Enable reusing the once created codes;
- Are open-source and available at GitHub;
- Are popular among developers and very likely to grow fast.
Another interesting similarity is that we use both frameworks in our daily work at Deviniti. After completing quite a few projects using them, we decided to rate the platforms and pick our favorite. Our top developers, Sebastian Kondracki and Wojciech Zahradnik, compiled a very detailed report on React Native and Flutter. They gave each framework scores collectively amounting to 100 points in 9 different categories. These scores will help you decide which framework will work best for you. So, which one is our winner? Let’s start with technical specs!
React Native vs. Flutter — technical specs
General reliability
Google — the creator of the Flutter framework — is highly technology-driven and constantly develops new tools and solutions. It has released many apps, however, some of them are no longer supported and sometimes end up in Google Cemetery. This might be the case with GWT — another Google framework — which seems to be put on hold. That’s why Flutter’s reliability is also questionable.
On the other hand, the situation with React Native seems to be only slightly better. It’s a well-known fact that Facebook likes to surprise us with changes. For this reason, the fate of React Native might be uncertain at some points. However, React Native is still less likely to be discarded than Flutter, so this time we are voting React Native.
Source code and repository
When it comes to the programming language, Flutter is dominated by Dart while other languages constitute less than 1% of all. The situation with React Native is less extreme — almost half of the users prefer JavaScript, and the other half is mostly occupied by Java and C++ (all data as of 21 Oct 2021). These languages have been in existence for quite a while, and Dart is still young. Yet, Dart is quickly gaining popularity.
As we mentioned before, both React Native and Flutter are open-source and available via GitHub. When we look at their scores: Flutter is leading with 131,000 stars granted by users, and React Native is following with 98,700 user stars (results as of 21 Oct 2021). So, Flutter has almost 1/3 more votes. We support this score — the winner of this round is Flutter.
Source for React Native and Flutter
Supported Operating Systems
React Native can successfully support mobile applications for iOS and Android (but not necessarily Windows). Nevertheless, creating web and desktop applications can be difficult due to the lack of formal methods. There are several ways of working it around, but you need to use third-party libraries. So, building more demanding React Native-based web apps, mobile apps, or others means relying on external resources, and thus becomes a serious drawback. Still, React Native has one important advantage — it relies on JavaScript, so large development teams can build their shared libraries for both mobile and web projects.
Flutter seems more versatile in supporting platforms. It goes well with mobile apps (iOS and Android) as well as web and desktop apps (Windows, Mac OS, and Linux). Although the support for Flutter-based desktop apps and Flutter-based web apps needs further development, the framework provides a native-like experience across all platforms. All this is due to Flutter widgets which can efficiently imitate native features regardless of the operating system. The current development of this framework is also promising when we consider achieving the full cross-platform experience. So this time, Flutter takes the crown.
Graphical User Interface
As we all know, User Experience plays a vital role in application success. The market is highly competitive, so companies need to make their apps not only functional but also easy-to-use and appealing. That’s why a lot of pressure is put on Graphical User Interface — how the app looks and works.
Let’s start with React Native. We already know that the framework uses JavaScript to create native components within a specified platform (Android or iOS). As a result, the application’s appearance depends on the user’s phone model. If the phone gets an update, the application components will change as well. That’s why the same app can come in different shapes and forms across various systems/devices. This can be a blessing as well as a curse — users might not get proper customer support due to different-looking GUIs. Nevertheless, applications on the users’ phones very often look similar at the component level because of their close connection with the OS. This resemblance is very convenient. There is one more significant feature of React Native — its GUI often relies on third-party libraries. This also brings mixed feelings: on the one hand, the interface supports app nativity, but on the other hand, it can also generate serious problems.
Going from the end now, Flutter is independent of third-party libraries thanks to a rich set of its very own components. What’s more, any application built using this framework will appear the same regardless of the device or the OS version. Only the development team can introduce changes to the GUI. The interface similarity benefits both the users (less confusion during customer support) and developers (fewer manuals to be written). Another interesting feature is the graphical smoothness (up to 120 fps). Thanks to a rendering engine written in C++, applications running on older versions of devices/operating systems still look sharp and work fine. These features gained our appreciation — we are awarding the Flutter framework again.
Application performance
Application performance greatly depends on the framework architecture and functioning. There is one feature that puts React Native at a serious disadvantage. Namely, this framework uses a special JavaScript bridge to translate the code to the compiler, and then to the user interface. This process works both ways leading to greater consumption of time and resources. Consequently, this bridge causes React Native-based apps to slow down — it becomes an obstacle while running them.
Flutter is free from such burdens. Since it works with rich native libraries, it can successfully cut down on time and resources. Consequently, Flutter application response and load times are shorter, and the created files use less space. This was proven in several tests — simple apps with similar functionalities written both in React Native and Flutter had to perform the same tasks. The Flutter framework ran desktop apps as well as mobile apps faster than React Native. That’s why, in terms of application performance, victory undoubtedly belongs to Flutter.
Continuous Integration and Continuous Delivery
Continuous integration (CI) and Continuous Delivery (CD) are essential in modern programming, especially when we talk about complex IT projects. Unfortunately, framework creators don’t always supply the materials necessary to follow these practices.
React Native suffers from the aforesaid problem as it lacks official tools and documentation. This situation makes it difficult to carry out the CI/CD processes. Luckily, you can integrate React Native with popular third-party CI/CD services, such as GitHub, GitLab, or Fastlane.
Flutter is a bit more developed in this area. It offers official documentation (both internal and external sources) on CI/CD processes. What is more, it has a fully operational interface with a command-line supporting the CI/CD integration. The icing on the cake is CodeMagic — a CI/CD system designed by Nevercode and revealed during Flutter Live 2018. CodeMagic provides great support in terms of CI/CD integration. It’s compatible with Flutter, but also React Native and several other frameworks. Nevertheless, the framework developer’s documentation is a hard-to-replace advantage, so we are showing a bit more appreciation for Flutter.
Flutter vs. React Native — market specs
Although Flutter is relatively younger than React Native, it remains in our favor thanks to its well-thought technology. However, technology on its own doesn’t determine the success or failure of a specific framework. Another crucial factor is the market — entry barriers, community support, and talent acquisition. Let’s have a look at these right away!
Barriers to entry
React Native uses JavaScript — one of the most popular programming languages. For this reason, some programmers might be more willing to learn React Native. However, those of you who are already fluent in JavaScript — beware! Firstly, React Native often requires extensions supporting the development of mobile applications. You need to take those into account as well. What is more, if you aren’t familiar with the latest JavaScript constructs, it may be hard to get through. Let’s take the example of React vs. React Native — being an efficient web developer in React doesn’t automatically mean that you will excel at React Native. So, the barrier to entry isn’t that high in general, but you must constantly learn React Native and avoid taking anything for granted.
Things get more complicated with Flutter. The default Flutter programming language is Dart which is object-oriented and relatively young. Dart was designed as a natural language, similar to C++, Java, or JavaScript. Programmers usually find it quite appealing and easy to learn. Nevertheless, understanding it still requires some time, so the barrier to entry rises dramatically. This doesn’t discourage developers — Dart has ranked the 7th most beloved programming language out of 25 on Stack Overflow Insights. It is also worth mentioning that Flutter itself ranked the 3rd most beloved framework out of 25. Although Dart is gaining popularity, it’s still killing the motivation of some programmers to learn Flutter. So, the round of applause goes to React Native!
Labor market
Since we are speaking of barriers to entry, let’s discuss the people who are already working or would like to work with these frameworks. We will consider people who are hiring (employers) as well as people seeking jobs (employees).
When we look at the charts, React Native seems to be less popular with potential employees. Google Trends shows that the average number of daily searches for the query “React Native Developer jobs” within the last 12 months (data as of 21 Oct 2021) amounts to 16 searches per day. In the case of “Flutter Developer jobs”, the number reaches 34 searches per day.
The trend is similar for employers. The number of React Native Developer job offers published on Polish LinkedIn within the last month (as of 21 Oct 2021) amounts to 3,000. It is much higher for Flutter — over 5,000 Flutter Developer job offers. If we look at the global scale, the number of job offers around the world (for remote work as of 21 Oct 2021) is similar for React Native Developer and Flutter Developer: they both got over 33,000 positions. The highest contrast is visible in the US: 35,000 React Native Developer job offers against 90,000 Flutter Developer job offers. When we look at these numbers, it’s a definite win for Flutter.
Community
Quite a significant measure of a framework’s success is its community. The opportunity to get support from others encourages users to work more with given tools. Not to mention the access to professional materials which can teach you everything from scratch.
The common opinion about these two frameworks is that React Native has a wider and more active community due to being a few years older than Flutter. You can also observe an abundance of tools for this framework on GitHub (including React Native Elements, Navigation, Maps, or Calendars). However, statistical data shows that this may not be the case. At the end of 2020, we can observe a large increase in the number of questions regarding Flutter on Stack Overflow. They show the growing numbers of people willing to learn Flutter as well as experts sharing their knowledge, e.g. in Flutter tutorials.
Another example of the Flutter community taking the lead is the high number of Flutter tutorials, blog articles, knowledge bases, and other educational materials. The quantitative data shows that 80% or more Google search results relate to the topic of Flutter rather than React Native. This might be encouraged by the fact that Google is putting a lot of effort into making Flutter a well-known and widely used framework. It’s enough to compare the websites of React Native and Flutter to notice that Flutter is doing better. In our opinion, the Flutter framework should get the next prize.
Flutter vs. React Native — And the winner is…!
When you look at the numbers, Flutter scored more points in 7 out of 9 categories. In many cases, it was almost a tie, but Flutter still won. Does it mean that we should all switch to Flutter now? Definitely not. We must always remember the inherent differences between these two frameworks. Specific features might be the decisive factor when choosing the right framework for you. What are they exactly? Let’s summarize.
What is React Native good for?
The best idea to use React Native is in situations when your app should always be adjusted to the native elements, needs to be updated along with the device OS, and requires the use of third-party libraries. This framework is also a good idea when the app should be lightweight (React Native supports animations only to some extent), and your developer team is proficient in JavaScript (not everyone is fluent in Dart).
What is Flutter good for?
Flutter will become your best tool when you want to have an app looking the same on all OSs and going beyond mobile devices — wearables, PCs, cars, etc. You will find this framework useful whenever you are aiming at heavier apps (Flutter-based animations are usually the most efficient), or you are lacking access to third-party libraries. And if you are willing to try out a new and exciting programming language like Dart, Flutter is the best choice for you.
Go for what’s best for you!
Remember that React Native and Flutter are only tools to achieve a goal. Carefully analyze your project and decide which framework will get the job done. If either of them is good, look at the specifics of your future app. Remember that the devil lies in the details and once you start developing your app in a specific framework, it might be difficult to go back. Both React Native and Flutter are constantly developed, and their market situation keeps changing. Be on the lookout for the latest updates, and you will certainly choose your best option.
If you need any help with developing apps, explore our consulting services. If you prefer to have an app built for you from scratch, view our development services. No matter how you want to get your app, we have your back! In the meantime, enjoy our articles on apps:
Mobile applications trends for 2020
