Flutter, a revolution in cross-platform app development

Nahuel Biladóniga
6 min readJul 23, 2021

--

Cross-platform development frameworks have been around for quite a while. However, using a single codebase for every platform (desktop, mobile and web) used to be a dream. With the introduction of Flutter 2.2, that is now a reality.

Flutter is a game-changing framework for the development of native mobile, web and desktop applications.

What is cross-platform development and why you should use it?

Cross-platform development allows applications to run on multiple platforms and operating systems. It offers several benefits, including:

  • Faster development

One of the main advantages of cross-platform development is that it’s less time-consuming. To create a ready-to-launch digital product you have to leverage only one codebase, which requires fewer developers.

  • Lower development costs

This advantage is connected with the previous one. Development time is extremely expensive, so naturally, faster development translates into lower costs for business owners.

If you want to expand your app to another platform you won’t need to invest heavily, since it will only take a few minor, inexpensive tweaks, and it will be ready to go.

  • Cost-effective updates & maintainable code

Most people assume that developing software requires only an upfront fee of the total cost of building the desired solution. Unfortunately, this is only half of the story. Updating and maintaining apps is critical to keeping your user base hooked. Therefore, cross-platform development also saves you the cost of hiring multiple developers to maintain the software updated across all platforms.

On another note, the same code you used for previous projects might be reused in completely different products on new platforms. This, once again, translates into saving time, which will in turn be reflected in lower production costs.

  • Access to larger Audiences

The biggest edge when it comes to cross-platform development is the possibility of maximizing your market reach. You don’t need to be an expert to know that a higher reach might lead to higher revenue and a broader user base. By having your MVP hosted on various platforms, the chances of succeeding and revealing which platform your users frequent the most are much higher.

  • Better Prototyping

Cross-platform development also provides a more effective and quicker way of prototyping and presenting ideas to investors. Usually frameworks like Flutter or React Native come with built-in Widgets/Components that allow you to swiftly build a functional prototype, bringing your idea to life.

About Flutter

https://flutter.dev/

Flutter is an SDK built by Google, released in 2018, which focuses on creating cross-platform development with the same exact codebase. More and more companies have opted for Flutter, to the point where 1 in 8 Google Play Store apps are developed using Flutter.

One code to rule them all

Flutter apps use one single code for multiple platforms and use Dart as the programming language. This boosts development since developers only need to learn one language, which in turn allows them to become proficient at Flutter at an extraordinary rate. Additionally, Dart is an extremely simple language to learn due to the fact that it is heavily influenced by C# and Javascript, which feels familiar even to those who have never used it before.

Introduction to widgets

Flutter comes with an innovative concept called Widgets. Widgets are a way to declare and construct the UI at a smooth pace. They are very similar to components in React Native, with a major difference: Widgets are actually objects, where structure, styling and logic are all defined as parameters within the Widget. As a result, there is no need to learn external languages or tools to build powerful code, a stark contrast to the regular segregation of HTML, CSS and Javascript.

This concept was mind-blowing for me. With a background in web development, I had experience with the above-mentioned technologies, before Flutter. The possibility of using widgets to create powerful stylings while at the same time, being functional, all with the same language, considerably increased the value I could add to the product.

A mobile-first approach

https://css-tricks.com/how-to-develop-and-test-a-mobile-first-design-in-2021/

Flutter’s design approach is best suited for mobile-first design. This helps provide a better, more focused experience for the user, allowing for a more natural cohesion between the desktop and mobile versions of the same app.

A solid native compile feature

As we mentioned previously, however, cross-platform development has a significant downside: lower performance. React Native, for instance, uses an in-app browser that renders Javascript code with the React Library. This negatively impacts user experience because apps suffer considerable time delays.

However, Flutter solves this problem by harnessing the power of Dart. It can compile with multiple strategies that adapt to each situation, one of the most remarkable being the ability to compile ARM and x86 code for iOS and Android, respectively. This allows Flutter apps to perform as smoothly as any native app, thus improving the overall user experience. Flutter can also be compiled to HTML, CSS and JS for web apps.

Hot Reload: an extremely useful, time-saving feature.

By using hot reload, the developer can make changes while the app is running and see the changes immediately, helping them identify and fix bugs in record time, improving their efficiency. This feature is widely adopted by most frameworks. What differentiates Flutter from the rest is that it compiles natively and allows for hot reloading as it runs on Javascript while in debug mode, thus taking the best of both worlds.

On a more personal note, I had to find a breaking bug that required following a series of hard steps to replicate it. Thanks to the hot reload feature, I could make changes to fix the bug while maintaining the app state, significantly reducing the time I dedicated to this task.

https://buildflutter.com/wp-content/uploads/2018/04/UIChange.gif

A constantly active, helpful community

Flutter has an ever-growing community, adding hundreds of new users by the day. So many developers have gotten the grip on this technology that Flutter went from being a trending tech to a solid, widely adopted development tool. With every new Flutter release, the community has updated the latest packages to ensure compatibility with their latest features, enhancing the development experience. Flutter itself is actually open-source: every developer is free to contribute to a better experience.

Pub.dev is the official repository for Flutter packages, where you can add custom packages to be used by developers around the world. Some memorable contributions on pub.dev are Bloc and Firebase Core. Google is deeply committed to investing in Flutter, providing regular updates, extensive documentation and a wide array of video tutorials to help the community grow and thrive.

https://pub.dev/

Recently, I experienced a technical challenge of the highest level: I had to design the architecture for an app that needed to behave offline exactly in the same way it did online.

To achieve this, I studied network connectivity capabilities for the different devices, as well as how these devices could cache the data locally and how to unlock the device’s capabilities to the fullest extent.

After looking for Flutter packages previously developed by the community to leverage and build my solution, and have an operational app with an offline device. I found multiple tools ready to be used. These helped me build a functional solution, which spared me countless hours and multiple headaches.

Whatever it is your heart desires to do with Flutter, you will find a package for you, courtesy of the community.

In conclusion

As the first mature framework to reach all platforms with a single codebase, Flutter has revolutionized cross-platform development. Many startup projects are migrating from native development to cross-platform and specifically choosing Flutter to help them bring their ideas to life.

Here at CreateThrive we have adopted Flutter as our main tool for mobile development, we’ve had the experience of porting a mobile app to a web version and we have leveraged the cross-platform capabilities of Flutter in order to reduce time and cost while building beautiful, natively compiled applications for mobile, web and desktop from a single codebase.

--

--