Mobile development increasingly relies not on native development, but on the use of frameworks that help create applications for multiple platforms at once. Today I want to say a few words about Flutter, which is gradually starting to win the market from React Native. Details - under the cut.
When the project for developing a mobile application starts, it is necessary to make a decision on which platform we will program. Often this question is influenced by the customer himself, who wants to see software created natively for each platform, or, conversely, wants to save money and asks to develop on React Native.On the project website you can find out that Flutter is actively using not only Google itself, but also some other companies. For example, Flutter has written the new The New York Times app, as well as mobile versions of eBay and Aliexpress. But in general, the list does not look very impressive, because it includes no more than 20 companies.
Nevertheless, the experience of developers from our company shows that in some cases Flutter is better and more convenient for creating mobile applications. Neti's collective mind totaled 8 pluses of this younger framework.Performance
Flutter-developed applications run much faster than using React Native. Speed advantages are achieved through our own engine and the use of another programming language. Unlike React Native, which works with bridges and the Java Script language, Flutter allows you to quickly solve application problems, especially those related to the user interface. Native compilers are already built into the framework, and code written in Dart turns into native instructions for ARM processors.By the way, interesting comparative tests were carried out by guys from InVerita. Their article on Medium compared the performance of finished applications on real iPhone 6 and Xiaomi Redmi Note 5 devices.
As you can see, the Gauss test on iOS runs on Flutter even faster than on Swift, and RN shows a lag of 20 times!
In the case of Android, Flutter requires 20% more time to complete the test than Java and Kotlin, but it still works 15 times faster than RN.Application size
As a result of the previous paragraph, applications created on the basis of Flutter and written on Dart contain fewer intermediate components. Compiling up to native ARM instructions allows you to store nothing more. As a result, application binaries themselves take up to two times less space on the device’s drive than when developing on React Native.Quick animation
In a sense, this plus follows from the previous one. We decided to use Flutter for applications that have a lot of animation built in. The fact is that Flutter stably demonstrates 60 FPS, which means that users do not have to look at the twitching picture, as is often the case with React Native.Typed Programming Language
The basis of Flutter is Dart, a typed programming language already popular among enthusiasts. On Dart, coding turns into object-oriented programming ... and here, of course, we could recall TypeScript and argue that it is also typed. But, alas, ultimately, it is transcompiled and still turns into untyped JavaScript. That is, all the advantages of TS remain at the convenience level of the encoder and do not affect performance. Dart, by contrast, is natively typed. The programming language is actively developed, supported by the community. You can write much more structural code on Dart, which means you can create more complex applications and hierarchical structures.Excellent documentation
For those who want to deal with the new platform on the Internet, there are video tutorials, the possibilities for working with code online are thought out. The community led by Google has developed comprehensive instructions and guides. Moreover, the network even has a ready-made recipe for switching from React Native to Flutter. You can see it here . Of course, there is documentation for React Native too, but it is often useless due to descriptions such as “removeClippedSubviews - This may improve scroll performance for large lists.” The Flutter community has a much more serious approach to documentation.Uniformity UI
The well-known advantage of React Native is the ability to conduct development for several platforms at once. However, no one guarantees that without finalizing with a file you will immediately get the same interface. An application written in Flutter, by contrast, looks and works the same on both iOS and Android. Our programmers have never rewritten the code to make the application work on iOS just like on Android. In the case of React Native, everything is different. Such improvements have to be done with enviable regularity.Support for a large number of platforms
Flutter already supports Android, iOS and Web. Judging by the discussions in the community, support for MacOS, ChromeOS, and Windows will be available very soon. And, most interestingly, Flutter already supports the future Google Fuchsia platform. So any development can be immediately ported to the new OS.Developer Tools
The last thing I want to note is the developed DevTools. Flutter boasts a good ecosystem of developer tools. You can look at them here . By the way, Facebook is trying to do something similar, but as far as we can see, RN has only the beta version of DevTools so far, and by functionality they do not reach the Flutter counterparts.Code example
For example, below is the code “Hello, World!” for React Native and Flutter frameworks
import React from 'react';
import { StyleSheet, Text, View } from 'react-native';
export default class App extends React.Component {
render() {
return (
<View style={styles.container}>
<Text>Hello world!</Text>
</View>
);
}
}
const styles = StyleSheet.create({
container: {
flex: 1,
backgroundColor: '#fff',
alignItems: 'center',
justifyContent: 'center'
}
})
And here is how this code will look in Flutter
import 'package:flutter/material.dart';
void main() {
runApp(
Center(
child: Text(
'Hello, world!',
textDirection: TextDirection.ltr,
),
),
);
}
Does Flutter have any cons?
Of course they are. Flutter is a young platform. There are not enough ready-made solutions for it. For comparison, the same React Native already has a lot more ready-made templates, recipes, implementation options.Writing a UI on Flutter takes more time. And the very writing of Dart code is longer. In React Native, an application is built as a constructor from web components. Flutter still requires thorough programming.In addition, Flutter requires deeper programming skills. In the case of React Native, you can entrust development to any specialist with knowledge of Java Script. With Dart, things are more complicated, since this language has a higher entry threshold than JS. The programmer must have more in-depth training.But at the same time, the vacancies for developers on Flutter are still quite small. There is no confidence on the part of Russian companies on the new platform yet. However, this does not prevent us from conducting part of the development on this framework. And the results so far are more than positive. If you have experience developing on Flutter, please share your impressions in the comments.