We have already introduced Flutter in our previous post and now in this post we will talk about Flutter vs React Native. We will contrast major differences between Flutter and React Native regarding Performance, Ecosystem Support, Ease in Development, etc. We will also draw some similarities as well.
Flutter was released on December, 2018 while React Native was already in this game 3 years before first release of Flutter.
Comparing the number of number of packages built (or developers using them), React Native is a clear win. You install packages in React Native using NPM.
However, more and more packages are being pushed in Flutters daily. You can browse packages for Flutter here.
Number of in-built components provided by React Native is not as big (but sufficient) as widgets provided by Flutter library. But there are numerous packages in library in React Native that will meet your requirement.
Flutter has large sets of built-in widgets tailored for Material Designs. It also has good amount of widgets designed for iOS apps. However, Flutter’s widgets are non-adaptive to orientation. Developers need to switch manually to fix the layout.
Both support Hot Reload
But what really compiled in machine code are UI elements. The communication between UI thread and JS thread are done through React Native bridge.
Flutter uses Dart and it is compiled to ARM C/C++ Library which is consumed by Native Code.
Unlike React Native, it does not create separate Dart thread that requires communication with main thread. The whole thing is built into an .ipa for iOS and APK for Android.
When launched, the app launches the Flutter app. Any rendering, input or event handling, and so on, are delegated to the compiled Flutter and app code. This is similar to the way many game engines work.Flutter Team
Clearly Flutter is the winner in terms of performance.
5. Writing Unit Tests
Flutter has built in support for writing Unit Tests. Even the UI widgets can be easily tested by the use of the Widget Keys. In the case of React Native apps, we can use external libraries to write these tests.
6. State Management
Both React-Native and Flutter are based on “unidirectional data flow” architecture of Reactive Programming.
[Coming Soon: Reactive Programming in Flutter]