React Native vs Flutter: Everything You Need to Know
Multi-Platform Mobile App Development
For the better part of a decade, creating mobile apps has been a fundamental pillar of business within the tech industry. Unfortunately, having multiple platforms for which separate apps need to be developed simultaneously has been an issue for just as long. Besides needing two separate teams developing for Android and iOS concurrently, there will always be gaps between the two applications due to different vetting and updating processes. Thankfully, multi-platform app development kits have been released in recent years that promise to make developing, publishing, and maintaining your cross-platform apps easier than ever. The most powerful, fully featured contenders currently on the market are Google’s Flutter and Facebook’s React Native. Let’s compare some of the strengths and weaknesses of each toolkit for an objective look at React Native versus Flutter.
Initially released in December of 2018, Flutter is Google’s open-source multi-platform reactive development framework built on the Dart language. Google uses Flutter for many of their biggest apps in a constant effort to push it as the ultimate solution to easy cross-platform app development. Flutter is an easy-to-use, portable, widget-centric UI toolkit with a hot reload feature that allows developers to experiment while making adjustments on the fly. It helps developers create apps across mobile, web, and desktop entirely from a single codebase, greatly speeding up the development process. Flutter is officially supported by Visual Studio Code, Android Studio, and IntelliJ Idea to name a few.
When it comes to ecosystems, Flutter is at a slight disadvantage when compared to React Native. React Native released a few years prior to Flutter and therefore has a more robust lineup of packages available. However, Flutter’s growth is exploding and is on pace to compete with React Native in the near future. Flutter seems to draw in a particularly dedicated group of developers who have made many core packages for mobile development available for public use. In fact, there are 14,189 packages already available from the Dart website.
Flutter takes a rather different approach than React Native. Flutter apps are compiled using ARM C and C++ libraries which gives it improved native performance. When building apps using Flutter, it’s not just the UI that’s compiled, but the whole thing. It can be hard to judge whether or not Flutter performs better than React Native simply because the needs of developers vary from one project to the next, but most developers seem to agree that Flutter has the upper hand when it comes to performance. Beyond that, Flutter has incredibly thorough documentation. Picking it up with zero programming experience at all may be a tough challenge, but developers with even moderate experience should be able to hit the ground running thanks to the vast amounts of literature available online.
Flutter is still young which means developers are still uncertain about the best architecture to implement for your app. Fortunately, there are a few architectures that seem to be widely popular among Flutter devs. First and foremost, there’s BLoC architecture (Business Logic Component). First unveiled at Google’s I/O Conference in 2019, BLoC architecture takes the business logic out of the presentation layer and instead shifts it toward business logic components. BLoC focuses on organizing data flows which makes it the most popular pattern for Flutter development. There are, of course, other architectures such as Redux/Flux that are usable so long as you download the Flutter packages that make them compatible, but BLoC is the clear winner here.
React Native has been around a bit longer than Flutter so it has more robust community support. It can use virtually any editor you want and it also features built-in hot reloading. When strictly comparing the number of packages available, React Native is the clear winner here. A quick search will turn up dozens of online communities with repositories full with all kinds of literature and compatible packages. Overall, for the time being React Native is a more mature and stable platform than Flutter, but that could very well change in the near future.
When it comes to building native applications with React Native, there are two main patterns. There is Flux, which was built by React Native’s creators at Facebook; then there is Redux, which is the community-created version. Overall, Redux seems to be the more popular option and has won over most of the community. Both of these frameworks center around unidirectional data flow, stateless app components, and the ability to store your application’s live state for easy access. There is even a new Context API feature that helps developers in managing state.
At Lithios we value outside opinions. This blog was written by one of our guest bloggers, Jonathan Baker, with feedback from the Lithios team.