2. What are you looking to work on?
The world. It just keeps on changing.
And nowhere is that more true than in the current cross-platform app development world, where a wild-west style showdown is brewing between Sheriff React Native & the mysterious stranger, Flutter. Both are clearly capable of delivering excellent results with big names increasingly, publicly, taking sides.
But which one should you choose when developing your next app? Let’s get to it.
|Released||March 2015 F8 Conference||December 2018 @Google I/O|
|Users:||Microsoft; Skype; facebook; NatWest; nowtv; instagram||BMW; googlepay; eBay motors; alibaba|
|Components Library||Very large inclusive library||Smaller, non-inclusive|
|Adaptive Components?||Some. adaptive automatically||No, manual configuration required|
|Main Architecture||Flux; Redux||BLoC|
|Ecosystem||mature, support of massive companies worldwide. many packages available||new, promising client list. limited packages|
You might know the tricks of the trade - but you need a technology team beside you every step of the way.
New data released in early 2020 shows that we are increasingly using mobile apps to manage and plan virtually every part of our lives. 92 percent of the world’s internet users are now connected via mobile devices, with mobile apps accounting for 10 out of every 11 minutes spent using online services. The average user will now spend only 9% of their time online web browsing on mobile devices, and mobile users now account for 50.1% of time spent on the internet - surpassing more traditional means for the first time.
Nearly 60% of the world’s population is already online and more than 5.19 billion people use mobile phones. This is an increase of 124 million (2.4%) in 2019/20 and will continue to rise. So, as of January 2020, 4.5 billion people are using the internet, half of them are on mobile devices and most of the time they are using an app. But what type of apps? Here are the most popular apps used by category:
It is fair, therefore, to say that apps are here to stay, with 2.96 million published apps on Google's Playstore and 2.2 million on Apple's App Store. In terms of revenue, mobile apps are expected to generate $581.9bn in 2020 with the trend increasing year on year to over $935bn by 2023.
When comparing the options we first need to break down the two forces:
In React Native, Facebook are providing a framework that has been developed primarily as an internal interest but is free to use. This is achieved using existing architecture & language, therefore making it highly accessible and incredibly flexible. In theory - with the correct 3rd party libraries - you can make anything and the bare-bones nature of the framework encourages constructive freedom. But it is up to the developer community to “do” almost everything. Luckily, React Native developers are a passionate & supportive community.
Flutter. The people at Google, who have done what they do so well, are attempting to create a free to use, all inclusive environment packed full of tools & widgets in the form of a User Interface (UI) software development kit (SDK). Eventually, they hope this will lead to the holy grail - true single codebase - and global domination. Which, in itself, is both impressive and terrifying in equal parts.
But what are we actually talking about? What are the fundamental differences between the two options? Is there a reason to use one over the other or is it personal preference? What product is being provided for developers to use?
When it comes to development, almost all developers and businesses are of a similar opinion when it comes to cost. Cost is bad. So only writing and maintaining one codebase for multiple platforms to manage the increasingly identical consumer experience means development costs should be lower. Which is good.
How much lower will depend on a number of factors, including the development team and business structure. But this can also make the development process significantly faster: “…[up to] 40% faster than development with native SDK”, according to Ardiansyah Putra, Mobile Developer at Eunomia International. Startups & SMEs are likely to benefit the most, primarily due to either being able to start from scratch or due to the inherent flexibility of smaller businesses.
Currently, funds allowing, native mobile app development (Android/iOS) is still superior to cross platform apps. So for apps where performance is critical, native solutions (android studio/xcode) are still the only real viable alternative. This is especially relevant for very large businesses where rigid structures are in place, security and stability are vital, or for businesses consisting of several related but fundamentally separate entities (e.g. HSBC) that need consistent customer facing portals.
There are several big problems with native apps. They are mainly:
The significant build and maintenance costs, as well as the likelihood of possibly requiring two developer teams to create, manage & maintain the apps long-term.
Whether Google succeeds or not, cross platform development will continue to exist and humanity now knows a single codebase is possible. So it is just a matter of time before more singular solutions come to market.
Who you will need to contact to obtain these licenses will depend on where you are based.
And that is something only really being proposed by Google. The biggest problem with Flutter lies in the fact that Google has a terrible habit of killing products. The fear of this is so great within the developer community that it virtually guarantees React Native’s safety as the only other viable solution. If Google can, as they appear to be doing, build confidence it becomes difficult to argue against their logic. But it is a big “If” as Google’s eventual solution would see Fuschia - Google’s own Operating System to run across all devices - work alongside and eventually replace Android. Android, of course, is also owned by Google.
But who will do the work for you? And using which cross platform framework? Do you already have a dev team with specific skills or passions? Need an MVP? Do you need to publish your app quickly?
With Flutter the main problem lies within its infancy, exacerbated by the need to learn a new and unique programming language - Dart - and the environment application. As such, from a developer hiring stance, developing a new app from concept to deployment and beyond is more expensive with RN, mainly due to there being less demand, and a smaller pool of experienced devs (at time of writing) using Flutter. At Flutter’s current rate of growth, however, hiring costs will rise proportionally alongside the increased development experience and product stability until both options are similar. It is very difficult to put a price on bespoke app development as there are so many parameters, but once you have an experienced team in place, development can move much faster than native development. This is especially true of Flutter, where an experienced team can work very efficiently.
If you need to build an MVP (Minimum Viable Product) for your app – for a pitch to clients or showcase for potential investors – cross-platform is a good option, particularly Flutter if you need it done fast. There are many examples of Flutter being used to build and publish apps quickly, typically in 9-20 weeks.
"Flutter played a key role in the HuYu project. We were amazed by the speed in which we got the app to market – it took 16 weeks," - Karyn Mukerjee, dunnhumby’s Director of Data Innovation.
So for startups or businesses with a product new to the digital world, Flutter, for now, appears to perform better, uses less resources than React Native and in doing so behaves more like native solutions (Kotlin/Swift). Add to this the single codebase and better use of visually identical native components across both operating systems, and OS generations. So unless you have an experienced RN team on hand, Flutter is probably the most direct and effective solution.
Flutter uses a technique called ‘Composition’ to build a UI with small UI blocks - or ‘widgets’ - and apps share a single codebase, so they look as good on the most current operating systems as they do on older versions. The apps look and behave similarly across iOS and Android thanks to Google’s UI toolkit-bundled Material Design (which implements Google’s design language) and Cupertino (for Apple’s iOS Human Interface Guidelines) widgets, as well as Skia C++ engine which includes all relevant protocols and channels.
With RN, a JS bridge connects the framework to native modules so application components look just like their native counterparts. Therefore, any OS UI update should also upgrade the app’s components. Which is great. However there is a - albeit small - risk of this breaking the UI. Which isn't great.
This will certainly become less of an advantage as more devs become familiar with the dart language and the community grows, but for at least the next six months (not least because the landscape changes every 6 months with new or different players entering/exiting the frame) there is little chance of this changing. Currently, RN's "learn once write anywhere" philosophy is slightly ahead because more people unfamiliar with your project would be able to progress faster should circumstances change.
Although still much bigger than native apps, both RN & Flutter have been bringing the size of their apps down consistently with framework improvements and a simple "Hello World" app now comes in at under 5mb (Flutter) and 7mb(RN).
In a study by Leancode, the average app size comes in at 32MB for React Native and 11MB Flutter. Although apps aren’t always comparable due the differing nature of the apps themselves, these figures are supportive of a general trend as can be seen in the “performance” section, below.
From inVerita's results it is clear that RN is lagging far behind native solutions but Flutter is getting much closer and even outperforming Swift. This is supported by developers:
"React Native is just a wrapper over native methods, so it requires a bridge... this becomes a bottleneck when you have a lot of native calls happening. with Flutter components are designed by Flutter engineers, there are fewer native calls to the bridge," - Ishaan Bahal, Co-founder at Meeve.
In addition to the inVeritas reports, results from Xian Yu’s blog post can be seen below. They go further, showing significantly different performance depending on the hardware used; in this case testing, various performance factors of iOS: iPhone 5C (iOS 9.0.1) / iPhone 6S (iOS 10.3.2) & Android: Xiaomi Mi 2S (Android 5.0.2) / Samsung Galaxy S8 (Android 7.0). Xian Yu summarize that the Flutter team has targeted their approaches for different models in order to maximise the user experience based on the capabilities of the handset.
As can be seen marked in red, in terms of CPU utilization, RN's performance is slightly better than Flutter on low-end models but lower on mid-range models. Although both share similar initial memory on low-end models, suddenly Flutter exceeds React Native by 28MB on mid-range models which is the result of Flutter's memory policies for low-end and mid-range models. But what policies? And what are the 30MB for?
The answer: Dart Virtual Machines (VMs). For low-end models or models with less available memory for processing, a Dart VM uses small amounts of initial memory, allocating memory resources at runtime instead. This results in greater CPU consumption as can be seen above. On mid-range models, more VM memory is pre-allocated thus reducing CPU intervention.
Android results were hugely in favour of Flutter, where in terms of memory usage Flutter initially exceeded React Native by 40 MB at the low-end, but:
"React Native's memory usage soared during tests, while Flutter's remained stable. The React Native code needs to be optimized. For a given set of code, Flutter's memory usage is similar on Android and iOS, while React Native's code needs to be adjusted on one of these two systems."
In terms of CPU utilization Flutter beat React Native on high- and low-end models, especially on the low-end, and in FPS and smoothness performance Flutter also outperformed RN.
When talking about testing and the available tools for Flutter & React Native both score valuable points but for different reasons. Testing is a vital element of development. What both parties do is provide excellent options and this is certainly an advantage cross-platform has over native development.
It really doesn’t matter how good an app looks or if it performs complex calculations - if it doesn’t work, or works poorly, no-one will use it. Programs like Jest (RN) make writing tests much easier, and the easier tests are to write and run the more testing gets done! With Flutter everything is already in place for you out-of-the-box, including testing infrastructure for Unit, Integration and End-to-End tests. And without the need for rendering to the screen.
inVerita published results comparing four applications developed using cross-platform and native, looking specifically at: (i) lines of code and (ii) functional vs cosmetic bugs.
Project A - mobile app for a logistic company (Android/Kotlin)
Project B - mobile app for a tour agency (IOS/Swift)
Project C - mobile app for a tour agency (React-Native)
Project D - software for a clinic network (Flutter/IOS+Android)
The results, frankly, speak for themselves (although inVerita do go into more detail in their post) but in terms of cross-platform competition, inVeritas certainly give Flutter a huge advantage over React Native.
Is RN destined to fall? Is anyone actually jumping ship or is this all just Flutter hot-air? Moving from native development to cross-platform is all well and good, but have many companies migrated from RN to Flutter or is it all just hype?
Actually, no. Although the reasons vary, the overwhelming feeling is that Google's all-inclusive environment, eventual true single code and faster build speed is the future we want. And for good reason.
"....everything is nearly instant to reload, complex UIs get built in hours, and the code itself is very easy to read through and maintain,"
Andrei Diaconu - Founder, Postmuse
The world of programming is at its very core composed of individuals more than familiar with finding unorthodox solutions due to limitations, and in that respect are typical of any industry trailblazers. As industry evolves, dedicated solutions arise and eventually become a ubiquitous standard.
React Native is the perfect example of a mostly fit-for-purpose solution that works, whereas Flutter will be completely built-for-purpose (if and when Google’s larger plan comes together).
But that doesn’t mean Flutter is always the best option. It may not be optimal for apps with very little UI or apps that require complex integrations with the host platform, for example. If you need functionality and heavy use of Swift or Kotlin it would be advisable to pursue native solutions, too. Additionally, due to its age there are still integration issues including a robust solution for in-app purchases, cryptocurrency libraries and there is no support for Apple Watch or tvOS apps compilation (which require Bitcode support).
But several companies have made the jump, including big companies, like AirBnb & NuBank:
"We found the Flutter development experience to be superior, with better hot reload capabilities, robust official documentation, and a more stable API,"
Alexandre Freire - Director of Engineering, NuBank
Start-ups especially are currently experiencing the best results, most quickly. Reflectly, a mindfulness app was originally built entirely in React Native but ran into massive problems and a 6 week delay with the cross-platform compatibility of their UI between iOS and Android. These problems were solved by switching to Flutter:
"...we simply could not output our intended features fast enough [with RN],"
Jacob Kristensen, founder + CPO, Reflectly
Last but not least comes the question of market share and momentum. A study by Jetbrains found that React Native apps are still the most popular when selecting a framework with a 42% share in 2019 & 2020, whereas Flutter occupied 39%, up from 30% in 2019, and surpassed previous best-contender Cordova for the first time.
Contact us for help creating your perfect cross-platform application.
Join global leaders who depend on Lolly Co to transform their businesses with advanced technology & automation.