Flutter is the new and upcoming cross platform mobile application development platform built and supported by Google. With the increasing number of cross-platform solutions in the market like Xamarin, React Native and now Flutter, we, at Innominds, have updated our skills for our internal proof of concepts (POCs) and advocating them to our customers, as and when required.
Our experience in these new technologies and ramp up has made us excited about the prospect of Flutter as it takes the easiest path for starting and building apps. Looking at the ease of developing the UI on both platforms, we have initiated embracing Flutter as the top solution to build rapid prototypes for our internal and external project proof of concepts.
Why Flutter?
While there are many valid reasons for using Flutter for building the next application, this blog will majorly deal with the business point of view. Some of the features of Flutter are as follows:
- Easy to install and flat learning curve
- Established UI components to choose from and easy customization
- Shorter turnaround time for screen development
- Openness to changes, both functionally and aesthetically
- Developer-run cycle time (amount of time it takes to see changes reflected on app)
Let's look at each of the above attributes that lead to embracing Flutter.
Installation
Installing Flutter is fairly easy with detailed instructions and steps put up at a single place. Getting Started helps in a lot of ways to install the whole environment in easy steps. Once the initial setup is complete, one can always run Flutter Doctor to ensure all the steps are complete. Overall, the installation takes about two hours of time with a decent internet connection. If you already have the developer environment setup for iOS and Android, it takes comparatively less time.
Learning Curve
Dart (language for Flutter) is an easy to learn programming language with a lot of tutorials. For people with a programming background of any functional language (C, Swift, Kotlin, Java, C#, JavaScript, etc.), it looks very familiar and easy to use. Following are some of the URLs to start learning Dart:
Established UI Components and Customization
Flutter offers a lot of components (widgets) with creative material designs. Starting with the regular text boxes to the more complex UserHeaders and Drawers for application, the components are easy to use and customizable according to the app specifications. The dev site also offers cookbooks to showcase the UI and their usage examples.
Screen UI Development
With its declarative syntax, Flutter makes it easy to build UI with a lot of customization within the element. Everything related to a widget is in a single block and this ensures that developers can declare all the attributes of an element in a single place and re-use them elsewhere.
Development Time
With the hot reload feature, it takes hardly two seconds to see the changes made in the code to be visible on the screen. This has a huge impact on the development cycle. In some of the approaches (native and Xamarin), the app needs to be re-run and navigated to the specific screen to look at the changes done.
All of the above reasons make it clear that Flutter helps reduce development time and effort. Additionally, it reduces the cost of development, which is already half since it is cross platform development and has a positive effect on the budgets. A company has more time and money to add new features.
To prove this at the next level, we conducted a simple experiment as described below.
Rapid Prototyping Experiment
To understand the amount of time and effort saved with Flutter when compared to other approaches, we conducted a simple experiment. The experiment was to build a single screen application that fetches and displays a list of users from the Internet.
We chose a random list of users from randomuser.me as we wanted to display a list with picture, name and email address along with a refresh button to refresh the user list.
The UI of the application was a simple list as shown below.
The following metrics were computed for the different approaches as part of the outcome of the experiment.
|
|
Xamarin |
Flutter |
iOS |
Android |
React |
|
Code lines |
150 |
101 |
190 |
160 |
160 |
|
Time (minutes) |
35 |
22 |
90 |
90 |
80 |
|
Executable size (Mb) |
51.6 |
53.7 |
23.1 |
4.3 |
52.4 |
Though the above experiment does not consider the other factors like performance, developer skills, memory usage or pixel perfect design, we still see a tremendous difference in the amount of time it took us to build the above screen.
Considering the number of advantages stated throughout the blog, we, at Innominds, consider and recommend Flutter for developing apps with material design, great UI and simple interactions at least for small apps and POCs for now. As the platform matures, we will consider it for bigger and more complex apps.
Conclusion and Future Plans
Change is the only constant with any software development. With Flutter, we, at Innominds, are equipped to solve your mobile app needs faster, more consistently and with an openness to changes. At present, our engineers are preparing components that can build the apps even faster and have the customization abilities needed for your app. Keep looking into this space for our further advancements on Flutter.
About Innominds
Innominds is a leading Digital Transformation and Product Engineering company headquartered in San Jose, CA. It offers co-creation services to enterprises for building solutions utilizing digital technologies focused on Devices, Apps, and Analytics. Innominds builds better outcomes securely for its clients through reliable advanced technologies like IoT, Blockchain, Big Data, Artificial Intelligence, DevOps and Enterprise Mobility among others. From idea to commercialization, we strive to build convergent solutions that help our clients grow their business and realize their market vision.
Interested! For any demos or project discussions, please write to us at marketing@innominds.com and know more about our offerings.
