X

Flutter: faster multi-platform mobile apps

Flutter is a framework for mobile UIs. If you check the description on their site, they present flutter as:

Flutter is Google’s mobile app SDK for crafting high-quality native interfaces on iOS and Android in record time.

I have used Cordova, Ionic/Ionic 2 and React native and was trying out QT Mobile. I was looking for some tool that did not have the huge performance hits that come with Cordova and Ionic, and that was cross-platform.
Qt Mobile is very fast, but it forces you to use Qt Creator (QT’s IDE) and there are some details that are more complicated to set up to get started (like making https requests).

React Native is pretty good too, and if you have worked on React before, it will be easy to get started, but I wanted to give a chance to the new kid in the block, some framework in beta status that promises to deliver “native” apps using Dart.

I started out checking what is flutter about. It has some weird syntax (Dart syntax has a lot of shorthands, i.e. constructors), but the conclusion from that first revision is that everything is a Widget and that all you have to do is to build your widget based on other widgets.
Flutter has material design support out of the box, so you can actually make pretty decent looking screens without much effort from the start.

This is not a code tutorial so I won’t dig into that. There are several resources out there already. Instead, I will share what I found out the most useful features when using flutter.

Going from zero to having an app in app/play store in 3 weeks

I started working a couple hours at night, and by the end of the second week I had an app with 4 screens and completely functional (nothing complex, but still). That much time is not a lot, given that it was my first attempt at using flutter. I had my application ready to live in the stores.

On the third week, I focused mainly on platform specific setup, configuring tools like firebase, crashlytics, etc. Also, the process with releases to the play store and the app store always takes some time.

One thing that I love about flutter is that you focus mainly on behavior, while the UI just works. I spend more time changing the flow of my application and adding new features than fighting the UI.

In release mode, applications are FAST (I mean it). I compared it to a pretty recent React Native application we worked recently, and it was way faster. Also, the generated package is pretty light, unlike Cordova that started at 30ish MB last time I checked, flutter starts at around 9.

 

Hot reload / Hot restart are really hot

Unlike the painful live reload on ionic, flutter’s hot features are a real time saver. You can reload your app when you make a change in your application, and see the changes in a second. There are some limitations that require a hot restart but in general, you can always have an updated version running.

 

Dart is easy

When you are getting started with a new language, there is always a learning curve, but if you know javascript and maybe a little java, you already know most of what Dart requires to get started. Dart is typed, which gives you the power of static analysis. Combine that with the runtime checks and you will have a guarantee that the variables which you have annotated with a type will always be of that type when evaluated, or an exception will be raised. This will prevent your app from entering an invalid state.

 

It runs easily on Android and IOS

In the past, I have had trouble running the “cross-platform framework” on any device. With flutter, just connect a device or start a simulator/emulator and run:

flutter run

You will have the app in your mobile device with no further commands to run. It will download the dependencies that you provide to your project and run it if it is correct.

To configure dependencies, you need to update the pubspec.yaml file. You can configure a lot of things in there, and having that centralized is pretty useful.
The only issue I had was installing native plugins for the app which requires modifications build.gradleto some plist file, but that has to be done anyway.

 

Try it! You won’t regret it

Flutter is still in beta, but it will probably become mainstream in the following years. It is a real time saver and will speed up your development process. No doubt the best mobile framework I have tried so far!


Tags: android developmentdartflutterhybrid appsionic alternativeios developmentmobile developmentreact native alternative