Taking Flutter for a testdrive

Why now?

For about a week I've been taking Flutter for a test drive. Flutter is Googles new take on mobile cross platform development for both iOS and android. I've been reading and watching videos about Flutter since is was first announced, but never written any code until now. Xamarin and especially Xamarin Forms has been my goto for app development since 2015.

As I'm stating on a project of my own I decided to spent some time to see if flutter is mature enough and how the development cycle is. This post will cover my first impressions based on a week of usage. Be aware, there are parts of the framework I haven't used yet. Below is a diagram that shows the internals of the Flutter architecture.

Installation

Installation of Flutter is more or less just to follow the guide from this homepage. Most of it, is running a few commands from a terminal and during installation everything can be verified running flutter doctor, a health check tool for Flutter. Flutter doctor will list missing iOS or android parts in your development environment. I had some minor issues with android until I read in the amazing Flutter documentation an installation of Android Studio was recommended. This fixed the issues I had for android. For iOS I had some issues which was fixed after 30 minutes on Stackoverflow and especially an update of HomeBrew. One reason the issues were easy to fix, were because the error descriptions are very good, and easy to put into a google search. The good error description is also the case when you have compile errors.

Compared to the early days of Xamarin and installation, this was a much better experience and compared with todays Xamarin error descriptions Flutter is in front. I even did my first update of Flutter and is was just a simple command from the terminal. I know Xamarin has improved a lot and still does, but I have to compare the developer on boarding process from when I first started with Xamarin.  

Tooling

When it comes to writing code there are multiple options. The most used IDEs are Android Studio, IntelliJ and Visual studio Code. I'm using Visual Studio Code with the extensions required for Flutter And Dart. And let me say, it works like a dream! Compared to Visual Studio 4 Mac which I'm using for Xamarin, vscode is very fast and lightweight. It's not an IDE with a lot of tooling as vs4mac. But for actually writing code it's very good and this is what I think it should be like. The keyboard shortcuts works very well and is exactly what I'm missing in vs4mac, I think I mentioned it in a couple or surveys lately :). Secondly it very stable and just feels great on a daily usage with a much smaller memory footprint.

I still have to see how it works when it comes to the non coding part of app development. vs4mac has very good integration with fastlane tooling but I'll have to wait and see.

Flutter and Dart

Flutter apps are developed using the programming language Dart. I'm a long time C# developer and this was also what got me into Xamarin development. To learn and use a new programming language might be a bit scary at first sight. So far learning Dart has not been a roadblock at all. If you have a background writing C#, Java or JavaScript it's pretty easy to start writing Dart. Of course the syntax is a bit different, but not much. Dart seems very mature with support for generics and async/await just to name a few of its features. As both UI and business logic is written using Dart it's easy to get going, compared with Xamarin Forms where I'm using both C# and XAML. I know the XAML part can be written in C# but I've always used XAML with Xamarin.

One area I'm still digging into with Flutter is 3rd party components. Xamarin has a comprehensive number of packages. So far I have only used a few number of Flutter packages but one of the reasons is because the core packages already includes a lot of UI components easy to use and customize. No doubt Xamarin is more mature in this area.  

App infrastructure

Writing UI in Flutter is very easy and flexible. Compared to Xamarin Forms it's a lot faster to write and I don't feel limited as I often do with Xamarin Forms. Of course this is also because of the model Flutter is using to draw the UI compared to how Xamarin does it. Xamarin Forms has come a long way compared to its early days, but still I find it much easier to make UI in Flutter especially custom UI.

One part of an app is the UI, as with all code you can easily end up writing unmaintainable spaghetti code, Flutter is no excuse. You have to keep in mind that the build method of your widgets will be called multiple times and you should avoid writing network or similar code in here. This leads to how you should structure the internal of your app. I started out with just writing to learn, not thinking in any patterns or structure. I started with basic state management, upgraded to ScopedModel which makes it a bit easier to keep track of the state. And state is important, as Flutter is using a reactive approach, where widgets are rendering its current state. I still found myself a bit challenged with ScopedModel looked around once again. I found the BLoC pattern recommend by the flutter team to be what I was looking for. This pattern separates UI and business logic using streams where events are emitted to a streamcontroller inside each Business Logic Component  and then published to listeners of the streamcontrollers stream. So far this has been a very good approach and I haven't had any issues with it so far.

In Xamarin Forms I've been using MVVM with PrismLib. As much as I love this BLoC and reactive will be my goto for Flutter. The learning curve is average and it's a great challenge.  

HOT HOT HOT HOT HOT HOT Reload

One of the first things mentioned when Flutter came out was Hot Reload. Its ability to instantly run your code on either simulator or device as it is saved in the editor. Hot Reload is a dream to work with, in a few milliseconds any code change is live, it's simply a joy to use. In Xamarin Forms I've used LiveXAML together with XAML. It helped a lot but only works for UI, not business logic. I would call Hot Reload a game changer and I really hope Xamarin will make something similar. After all you save so much time using this single piece of technology every day as an app developer.

Can you help me?

We all run into issues from time to time and especially when learning. With Flutter I find it very easy to find help from either StackOverflow or just simple google searching. The community is growing and it's growing fast. This is a part where Xamarin has been great, I really love the community and all its contributions.

But Flutter is only Beta?

Yes Flutter is still in beta, but it's moving forward. I find it very stable and I wouldn't be afraid to use it in production. Flutter is having some big announcements December 4th 2018 and I really hope one of them will be the release of 1.0, fingers crossed. You can find the event here

Is this the end of my Flutter journey?

Not for me. I really love what I've learned the past week and I will continue the challenge as I decided to use it as the technology for my current project, more on this project in a later post. I started out with a couple of tutorials but quickly decided it was better to build something real with Flutter. This decision has been good, as I quickly got into a lot of real world challenges instead of basic how-to. If you haven't already tried Flutter I think you should. I haven't stopped using Xamarin and I will continue to follow along, but for now Flutter is where I spent most of my app time.