INTRODUCTION
Since its official release in December 2018, Flutter has been taking the mobile development community by storm. While watching the stunning Flutter Live ’18 launch event, we had this one crazy idea.
Our team @ Innuva IT Solutions was tasked with building quite a large mobile solution (40+ screens) for the largest church community in Egypt (10 Million members). The app was expected to work on Android, iOS, all screen sizes (phones and tablets) and support much older and slower devices — Imagine a Samsung Galaxy S3 (2012) running Android 4.4 (KitKat).
The app is a Sunday School management solution. It serves students, teachers and priests, allowing them to manage churches, activities, classes, lessons, media, assignments, attendance, points, badges and much more.
Trying a new technology on such a large app was quite a risk. Although the technology is backed by google, we know from history that google had few flops (Google Graveyard) — 171 to be exact. Still, the promise is quite seductive for clients, managers and developers.
Build beautiful, natively-compiled applications for mobile, web, and desktop from a single codebase.
So we put Flutter to the test for two weeks and tried building some of our app’s toughest screens using Flutter and it was very promising actually. Although it was an early release (1.1), we could do pretty fabulous stuff in such a short time. Four months later, the app is now live on both Google Play and App Store, running on about 5K devices and is being rolled out to tens of thousands of users in the next few months. Taking this risk paid off and we are happy to share the results.
Are you considering Flutter for your next project? Wondering how much investment you need to put in? Will you really save time and money by using Flutter? Is Flutter suitable for any app? Does it deliver what it promises? Is it ready for production? Will my clients feel the difference between this and native app?
If these are the kind of questions going through your mind, If you are looking for insight from an actual product using Flutter, continue scrolling!
EVALUATION
Our team identified 10 points to evaluate the Flutter experience. We thought the following points will help in evaluation and decision making about using Flutter UI Toolkit.
- Learning Curve and Tooling
- Single Code base
- Application Testing
- Framework Maturity and Support
- Third Party Support
- Look and Feel
- Performance
- The Promise for other platforms
- Who uses Flutter?
- Known Limitations
LEARNING CURVE AND TOOLING
Deciding to get involved with a new technology brings a lot of questions. How much do I need to invest in learning? Any prerequisites for this specific technology? What would be the expected quality for my first task?
Our team has a diverse knowledge of native and cross mobile platform development. Learning yet another framework is just the norm. The assigned team all agreed that working with Flutter is a smooth, easy and even fun experience.
- Flutter developers use Dart language, a language similar to Java. That makes it more familiar to Android developer and relatively easy to learn for iOS developers as well.
- Since you can write Flutter apps with any Android IDE, the development experience for android developers may be a little smoother. Knowing that Xcode is not much of a splendid experience for iOS developers, switching to Visual Studio Code or an IntelliJ IDE can be quite a relief.
- Flutter UI Toolkit is very easy to learn as it is quite expressive. Actually Android and iOS are both migrating to similar UI frameworks, Android Jetpack and SwiftUI.
- Hot Reload lets you make live changes to the app on your device without rebuilding it.
- You can use fewer Mac Machines for development, since you only need them only for building and submitting your app. You can develop and test most of your app features on Windows/Linux development environments.
SINGLE CODEBASE
The promise of one code base was solidly kept by the Flutter UI toolkit. It’s everyone’s dream to write once, run on both iOS and Android. Fix issues once and add new features once. That promise makes both the customer and the project manager happy. Project Manager handles only one development team instead of two, i.e. less communication. Customer pays half the price and sometimes get the product in half the time. That benefit alone makes Flutter based proposals much more attractive than Native ones.
APPLICATION TESTING
The fact that Flutter renders the UI using its own high-performance graphics engine (Skia) rather than the native platform’s UI elements makes the UI consistent across different platforms.
That architecture makes testing less dependent on each platform, hence minimizing testing/rework cycles. Consider also backward compatibility as a bonus when testing newer devices and newer OS versions.
Platform specific features, such as notifications, device storage access, GPS, Camera, using any of the device’s hardware in general should be carefully tested on Android and iOS separately. However, overall experience is smoother and better than other cross platform technologies.
For our project, Flutter helped us reduce testing time by 30% and the number of platform specific issues were reduced by 80%. Our test team was more productive and more confident about how solid Flutter works across a variety of devices, platforms and OS versions.
FRAMEWORK MATURITY AND SUPPORT
A challenge for any new technology is community support. When we started our project, the Flutter community was still growing. Our team had many questions, yet few or no answers. To make it up to its early adopters, Google was generous in providing extensive documentation and tutorials.
Adoption is still not comparable to react native for example in terms of community support, but check the graph below from StackOverflow Questions growth for Flutter vs React:
The Flutter development team is working hard to crunch open issues and stabilize Flutter. In the recent 1.7 version alone, they closed 1,250 open issues! Still a long way to go, but it’s just a matter of time.
Upgrades are usually smooth and effortless, nothing breaks, you only need to watch for compatibility of third party plugins while upgrading. More on that in the next point.
THIRD PARTY SUPPORT
Third party plugins are a significant part of the Flutter ecosystem. All plugins are open-source and you can select from a versatile collection.
For our app, we needed to use Amazon AWS and Firebase. At the beginning, there were few limited options. Over time, more options became available. The plugin repository is continuously growing and support for the latest Flutter version is continuously provided.
You may face issues with version conflicts between plugins and Flutter versions. That may affect other plugins you are using if you decide to downgrade or upgrade. However package management errors are very descriptive and can help you find the problem easily.
LOOK AND FEEL
Flutter can provide a seamless user experience for a variety of application designs. If your application has a simple native design you can select from the various widget collections from the Material or Cupertino libraries. If your application has a custom UI that is common for both platforms, you can still construct it quite easily, and in any case you can customize your theme flexibly to brand your app as desired. The screens below show UI components from our app with custom theming.
Flexibility in Flutter isn’t just about theming and matching your UI design. Flutter also provides highly reusable components and flexibility of design for several screen sizes. It also provides the ability to compose very complex widgets from very granular UI components as simple as you would construct a picture in a puzzle.
Flutter also adds a very flexible API for adding animations, so with little code you can add simple but impressive animations. In addition, Dlutter takes advantage of Flare, a powerful design and animation tool which allows designers and developers to easily add high-quality animation to their apps and games. The screens below show various animations and effects used in our app.
PERFORMANCE
Flutter aims to provide 60 frames per second performance. However, bad code can result in bad performance. So, Flutter provides performance profiling tools to help you spot and fix performance issues in Flutter apps — running on real devices.
We tested our app on Samsung Galaxy S4 running Android 4.4 (KitKat), it works flawlessly.
THE PROMISE FOR OTHER PLATFORMS
…build beautiful, natively-compiled applications for mobile, web, and desktop from a single codebase
That promise alone is an actual Turn-ON for any business/developer wanting efficient/fast/cost effective product. But when?
Flutter for iOS/Android, CHECK, we think it’s already there, a single codebase, strong enough to handle both platforms flawlessly, considering the inherent differences of the original platforms.
Flutter for Web is an early technology preview released on May 7th, 2019. It’s nice to play with, but not ready yet to be used in actual production. No words from Google yet on when it will be a stable release, we expect sometime in 2020.
Flutter for Desktop currently supports ChromeOS only. It will target Mac OS, Windows and Linux Apps, but that project is still in its early stages. The APIs are still in the process of development and are subject to change without warning. No backwards compatibility, either API or ABI, will be provided — yet.
Developers should expect any code using these libraries to need to be updated and recompiled after any Flutter update.
WHO USES FLUTTER?
Google built apps with Flutter, but Facebook built apps with its own ReactNative and Microsoft built apps with its own Xamarin. Alibaba is apparently an early adopter of Flutter since it was announced, but It would be hard to find other companies of that magnitude using Flutter now (7 months after release).
History reminds us that it takes time to build trust with this category of frameworks. Once large companies start adopting it, others will follow. However if you are in doubt, make sure to visit the community driven website for apps built with flutter. 700 apps strong and counting. If not for the reputation of the developer or the download count, at least you can get a feeling of what Flutter can offer in real apps. Even the “History of Everything” demo presented in Flutter Live ’18 was impressive enough to want to try Flutter.
KNOWN LIMITATIONS
Some limitations to the Flutter UI Toolkit will go away as it matures, few others will just remain as a consequence of being a cross platform framework. We will just mention the ones in the first group. Most of the items are being addressed.
- Developers community is still limited, but steadily growing.
- Directly calling Native APIs from Dart in not supported. you can always write a plugin as a workaround.
Embedding Native UI elements is still in preview - No support yet for tvOS, CarPlay, Android Auto, WatchOS
- Third party plugins are limited when it comes to apps using GPS, Bluetooth, speakers and other hardware APIs. It is a safer choice to go for native development with hardware-centric apps. Doing a POC is a good approach before making that decision.
- There are limited options for payment gateway integrations for some regions such as Africa.
WHERE TO GO FROM HERE?
Flutter is still new but it is becoming stable and mature everyday. If you made up your mind about using Flutter for your next project, you can either start learning it, or hire a freelancer to help you out.
If you have a large Mobile Project and you need a FREE advice whether Flutter is a suitable fit, or if you should go Native or even use a different framework, please drop us a line here.
USEFUL REFERENCES
Awesome Flutter is a good place to go hunting for plugins and resources for flutter.
This article is co-authored by Michel Habib, co-founder, Innuva IT Solutions.
Caroline Adel
Latest posts by Caroline Adel (see all)
- 10 Reasons to Use Flutter for Your Next Big Mobile Project - August 7, 2019