Native apps with Flutter and React Native?

When you get to the Flutter website, you’ll find a quote “Build beautiful native apps in record time” and on the React Native site “Build native mobile apps using JavaScript and React”.

Both frameworks seem to promise native apps? Let’s see is how’s that possible.

Does it mean that you’ll be able to ditch ObjC/Swift and Java/Kotlin, and just write the same in JavaScript (React Native) or Dart (Flutter)? No. That’s not it. It’s true that depending on the app you’re about to build, you may not need to write any platform specific code. But that’s not the reason why they claim you can build native apps.

Each of these frameworks have a different reason as to why they say that you can build a native app.

First let’s look at React Native. Even though you’ll write JavaScript code, no WebView is used. Instead every UI component (that’s how they call it in React) is mapped to a native widget.

React Native communicates with the platform using a so called “Bridge” in order to specify which widgets and how should be used. This way, you’ll get an app that’s composed of nothing else but native widgets, and hence it’s a native app.

Thanks to this “mapping system” you can also take any existing Android or iOS component, and use it in your React Native app. This is mostly used for some complex UI components that would cause performance issues if implemented directly in React Native (due to the bridge).

Flutter avoids performance problems caused by the “Bridge” by using a compiled programming language — Dart. Dart supports AOT (ahead of time) compilation into native ARM code. This also improves application startup time.

Even though Dart is AOT compiled for production builds, it also supports JIT (just in time) compilation for fast development iterations. (In the next article, we’ll look into how that’s useful.)

Are you happy with this explanation? For more information visit React Native site or Flutter FAQ. Or if you have questions, please leave a comment below.