Flutter is a new mobile UI framework from Google, that allows developers to create a mobile app for Android and iOS using the programming language Dart.

For Tweakers Developer Summit, I gave a talk about Flutter. The talk was focussed on the differences between a Flutter app and a native app.

Programming language Dart

Flutter apps are written using the programming language Dart. This language is quite different then Swift or Kotlin and more common for developers that are used to program in Typescript.

Before you are able to start programming a Flutter app, you’ll to understand the basics of Dart. The language is developed by Google and is type-safe and supports asynchronous programming using Futures.

Compile code just-in-time

A big benefit of Dart, is that it’s possible to compile both just-in-time and ahead-of-time. Using the method just-in-time, the code is compiled by the compiler when needed. This allows you to build the app fast and make use of hot reload. A disadvantage of just-in-time, is that the app may be slower in refresh rate, because everything that needs to be displayed on the screen, must first be compiled. Using hot reload, the development of your user interface can be much faster because you don’t have to recompile your whole app after one design change.

Also ahead-of-time compiling is supported, which will first compile the whole app and after that, the app is able to run. Using ahead-of-time compiling, you can compile your app to machine code. Native apps for iOS & Android are not supporting just-in-time compiling.

Interface

Flutter draws each view on the screen, instead of using the ‘real’ view like React Native does. Because of this, there are two UI libraries available for Flutter, the material and cupertino UI library.

The material UI library contains all the UI elements that you also can use when developing a native Android app. The cupertino UI library is the library that contains all the UI elements that are available when developing a native iOS app. The name cupertino was conceived by Google, because Apple did not give a name for the iOS user interface.

Because every element is drawn, it is possible to show an iOS alert on an Android device. To prevent this, you can check which platform is used, to show a material or cupertino alert to the user.

Example:

void showAlert() {
  if (Platform.isAndroid) {
    showMaterialAlert();
  } else if (Platform.isIOS) {
    showCupertinoAlert();
  }
}

Conclusion

Flutter is a great framework to start developing mobile apps if there is less budget available. Currently it feels for me as the best alternative for native development, because of the performance with 60 frames per second and the feeling that the app is native.

Also development can be done fast as soon as you have enough knowledge of Flutter & Dart, using the hot reload functionality.