The Tragic team is no stranger to building hybrid and cross-platform solutions. Many years ago, we built hybrid business applications using Ionic Framework and, more recently, we have leveraged NativeScript to make our Angular applications cross-platform.
Previously, we discussed the value of Progressive Web Apps and Flutter. Teams can benefit from leveraging a single codebase that can be deployed on multiple devices and operating systems.
Those posts have started a lot of conversations with our audience. While most people seem to have a basic understanding of Progressive Web Apps (PWAs), the feedback on Flutter demonstrated there was a lack of understanding between traditional "cross-platform" and "cross-platform native" applications.
We hope to explain the differences between traditional "cross-platform" apps (e.g., ones that are hybrid or JavaScript native) and show why we are excited about the continued evolution of Flutter’s new cross-platform native approach.
JavaScript Native Overview
JavaScript native app development was first introduced with React Native, an open source framework from Facebook that allows you to use JavaScript to create native iOS and Android applications. With React Native, a business could extend its React web app to provide a native mobile interface re-using much of the same codebase.
JavaScript native was an evolution of hybrid app development and solved many performance and UI issues that plagued hybrid apps. As a result, this new type of development gained steam and grew the community around "cross platform" thinking.
The original React for web was launched in May 2013, with React Native following in 2015. Today, the React Native community has grown to over 2,100 contributors and boasts apps such as Walmart, Bloomberg, Airbnb, Uber Eats, and Pinterest.
Facebook uses React Native extensively for its own apps, including Facebook and Instagram. The JavaScript native community also developed solutions to facilitate the same cross-platform approach with other popular frameworks like Angular and Vue.
Flutter Overview
Flutter is an open source framework from Google that allows you to use Dart, a modern programming language, to create native apps for iOS, Android, web (beta), and desktop (alpha). This UI toolkit has created a new, cross-platform native approach to application development.
The first version was released in May 2017 with many notable updates since then. Flutter has hundreds of GitHub contributors and usage from enterprises such as Tencent, New York Times, Square, Capital One, Ebay, BMW, and – of course – Google itself.
The Differences between React Native and Flutter
As briefly mentioned, React Native and Flutter are different. It is important to keep in mind that both are frameworks and people can/remove features as they need when building applications.
Programming Language & Developer Community
React Native is built on JavaScript and builds off the foundation that Facebook built with React. Because of its ties to JavaScript and React, React Native has a larger developer community complete with more libraries, extensions, and tutorials.
In addition, it can be easier for web developers to pick up React Native.
Flutter is built on Dart, a modern programming language developed by Google. The language was designed from the ground up to build cross-platform applications. Many developers have strong opinions, one way or the other, about the language.
We are seeing the Dart community rapidly expanding and we think that both ecosystems are well-served.
Our Take: While React has a more robust community and is easier to pick up for Javascript developers. We find Dart very similar to TypeScript (which we love) and the development environment is best-in-class.
Cross-Platform Approach
React uses a native shell with an embedded JavaScript web application. The web app leverages a bridge to communicate with native features, such as contacts, calendar, and widgets.
In this respect, Flutter works more like a game engine than app framework. The native wrapper that hosts the Dart virtual machine runs on a C++ engine. There are no native components per say, instead the Flutter widgets draw the UI directly on its Skia Canvas.
With this approach, Flutter can stay more performant and can keep a more consistent visual experience.
Our Take: React Native still has several of the core downfalls of a hybrid app. We love that Flutter has completely broken out of that paradigm, trying to create a more stable and consistent cross-platform approach.
Performance & Speed
Both frameworks are performant and utilize modern features to provide a great user experience to the end user. That said, Flutter is much faster than React Native.
As mentioned above, React Native relies on a bridge to communicate to native features - which slows down the whole experience. Flutter works directly with native components, providing a much faster and more immediate user experience.
For example, Flutter aims to provide up to 120 frames per second (FPS) on devices with 120Hz displays.
Our Take: This section needs no opinion, the data speaks for itself. Flutter is more performant.
Release Cycles & Support
Again, both frameworks are backed by massive companies and large open source communities.
Facebook released React Native sooner, and it has a large ecosystem around it. However, they have been notoriously slow in implementing key features. In general, we have seen that the release cycles are long for Facebook-built open source projects.
Flutter is a newer ecosystem, but we have been impressed by the support it has received from Google. In a few short years, we have seen more frequent updates and releases for their native web (beta) and desktop (alpha) solutions.
Our Take: We are definitely biased and have always valued Google technology over Facebook. Much of this goes down to documentation, support, and iterations. But both technologies are stable and well-backed.
The Future of Application Development
In the last ten years, application development has gone through major changes.
As mobile devices became more popular, companies had to evaluate building dedicated teams for each platform (costly, time-consuming) and using half-baked solutions like wrapping JavaScript apps in a thin native client (slow, clunky).
Today, we are on the brink of true cross-platform native applications. The future of app development is investing heavily in your core offering and leveraging modern frameworks so you do not have to reinvest the wheel every time.
Businesses have always favored cross-platform solutions as they drive more value and cost less. However, in the past there were always big negatives that had to be weighed and often a true native application was the best choice. We believe cross-platform frameworks, like Flutter, will become even more essential in the coming years as hardware and software continues to proliferate. Native applications will always hold some value, but as cross-platform approaches become more sophisticated the benefits will soon vastly outweigh any downside.
Using modern tools allows you to spend less money, release sooner, and focus on what really matters - providing an excellent user experience to customers.
Want to learn more about cross-platform native applications? Tragic is providing a free consultation so you can explore how to save money when building applications for web, iOS, Android, and desktop.
