Sep 15, 2023

By Alberto Méndez

Flutter introduction

Serie: Flutter

Flutter is a mobile app development framework created by Google. It utilizes the Skia rendering engine to directly paint each view of the application on the screen, enabling the creation of highly customizable and flexible user interfaces from a single codebase.

It was initially announced by Google in 2015 as an experimental project to explore the possibilities of such frameworks. After several years of development and community feedback, Google released the first stable version, Flutter 1.0, in December 2018. Since then, Flutter has gained significant traction in the developer community due to its unique approach, performance, and the promise of write once, run on multiple platforms.

Flutter’s primary purpose is to empower developers to create engaging and high-performance applications for iOS, Android, and the web from a single source code. This significantly reduces the time and resources required to develop and maintain applications across multiple platforms. Furthermore, by offering a complete set of widgets that adhere to the design guidelines of Material Design (Google) and Cupertino (Apple), Flutter makes it easy to create apps that feel natural and familiar to users, regardless of the platform they are using.

While Flutter has made significant strides and established itself as a leading solution for mobile development, it is still in its early stages when it comes to web and desktop platforms. In the mobile space, developers can rely on a wide range of tools and robust features that make efficient and effective iOS and Android app development possible. However, for the web and desktop, the platform is still maturing and may lack some of the common features or optimizations that developers expect.

One of Flutter’s most distinctive and powerful attributes is its ability to compile to native code. Unlike some hybrid solutions that depend on “bridges” to interact with components of the operating system, Flutter translates the source code directly into instructions that hardware can execute without intermediaries. This direct approach means that applications built with Flutter can achieve performance levels comparable to native apps, benefiting from smooth execution and fully utilizing the device’s capabilities. Furthermore, by eliminating additional layers of abstraction, Flutter ensures greater consistency in the user experience, regardless of the platform on which the app is running.

However, it is essential to note that Flutter’s versatility comes at a price. Although applications compile to native code and offer optimal performance, the final executable tends to be heavier compared to traditional native apps. This size difference is because Flutter has to incorporate its rendering engine and other essential components to ensure the app functions consistently on various platforms. This means that while developers gain portability and design consistency, they may face challenges in terms of size optimization, especially on devices with storage limitations or in regions where data economy is crucial.

Flutter is open source and operates under a 3-clause BSD license, one of the most permissive licenses in the world of software. This means that developers have the freedom to use, modify, and distribute the software on their own terms, with very few restrictions. This license not only demonstrates Google’s commitment to the developer community but also ensures that Flutter can be adopted and adapted by companies and individual developers without fear of legal limitations. The framework’s source code is available on GitHub, where developers not only have access to the code but can also contribute improvements and fixes, further strengthening the ecosystem. Additionally, being open source means that if Google were to ever abandon or deprioritize the project, the community has the ability to continue its development, ensuring longevity and evolution independent of corporate decisions.

Since its launch, the Flutter community has experienced exponential growth. This active community has contributed a vast number of packages and plugins that simplify many common and advanced app development tasks. These additional resources, along with comprehensive documentation and active discussion forums, ensure that developers have the necessary support to tackle challenges that may arise during development. Numerous industry-leading companies have adopted Flutter as their preferred development solution, demonstrating the framework’s viability and reliability in high-level production environments.

For those with previous programming experience, adopting Flutter offers a smooth and efficient transition. The framework, based on the Dart language, leverages familiar programming concepts, allowing developers to leverage their existing knowledge.

Dart is a powerful programming language developed by Google known for its versatility and efficiency. Originally conceived as an alternative to JavaScript for web development, it has evolved to encompass multiple platforms, with its most notable use in mobile development with Flutter.

The choice of Dart as the primary language was not arbitrary, as it offers features that facilitate the development of high-performance applications:

• JIT (Just-In-Time) and AOT (Ahead-Of-Time) Compilation: Thanks to JIT compilation, Dart allows the “Hot Reload” feature, greatly speeding up the development process by reflecting changes almost in real-time. On the other hand, AOT compilation enables applications to be fast and efficient once deployed.

• Object-Oriented Programming: Dart follows an object-oriented programming approach, making it familiar to developers coming from languages like Java, C#, and others.

• Strongly Typed: Although Dart is flexible, it is strongly typed. This means that you are expected to define the data type for your variables and function returns, which can help detect errors at compile time. However, it also allows you to omit the data type and let the compiler infer it for you.

• Libraries and Packages: Dart boasts a rich ecosystem of libraries and packages that simplify common tasks and extend the language’s capabilities. pub.dev is the official repository where developers can find and share packages.

• Concurrency: Dart uses “Isolates” instead of traditional threads to achieve concurrency, allowing it to perform multiple tasks without sharing memory and without the risk of blocking.

Skia is an open-source graphics library that provides low-level APIs and utilities for drawing graphics. Initially developed by Skia Inc. and later acquired by Google in 2005, this library has served as the foundation for numerous Google products, including Chrome, Chrome OS, and, of course, Flutter.

Skia plays a crucial role because, unlike other frameworks that rely on native rendering capabilities provided by underlying platforms like iOS or Android, Flutter employs Skia to directly render widgets and other graphical elements on the screen. This design choice has several significant implications.

One of the most evident benefits is cross-platform consistency. By utilizing the same rendering engine across all devices, Flutter ensures that applications have a uniform look and behavior, regardless of the operating system they run on. This uniformity is essential for maintaining a consistent user experience across all platforms.

Performance is another area where Skia shines. Optimized for speed, the engine allows Flutter to render interfaces, even the most complex ones, at a rate of 60fps or even 120fps on compatible devices. This ensures a smooth and fluid user experience, crucial for modern interaction in mobile applications.

The use of Skia also enables unprecedented customization in app design. By not relying on native UI components, developers have the freedom to design and customize every aspect of their application, from simple widgets to detailed animations. It’s this freedom that has led to some of the most distinctive user experiences created with Flutter.

Furthermore, Skia benefits from deep hardware integration. It can directly leverage a device’s graphical capabilities, such as GPU acceleration, to deliver seamless transitions and animations. Finally, an indirect but crucial advantage of Flutter’s approach with Skia is its ability to adapt quickly. Developers can implement changes in appearance or behavior without waiting for platforms to update their native components.

This is where Material and Cupertino components come into play. These two sets of widgets represent the design guidelines of Google (Material) and Apple (Cupertino), respectively. Built from the ground up in Flutter, and not merely wrappers for native components, they have the ability to look and function identically on any platform. Whether you’re running your app on an iPhone, an Android device, or a web page, a Material button will have the same appearance and behavior.

This level of consistency and customization would not be possible without Skia’s ability to paint directly on the screen. When a developer chooses a Material or Cupertino widget in Flutter, they are not selecting a native system component but instructing Skia to draw that specific widget according to the corresponding design guidelines. This means that Flutter apps have the power to fully adopt the aesthetics of Material Design or the iOS style, or even blend them if desired, without sacrificing coherence across different devices.

In addition to all of the above, it’s important to highlight how Flutter aligns with current trends in the world of software development. With the growing demand for high-quality mobile and web apps delivered quickly, Flutter’s “write once, run anywhere” approach is more relevant than ever. The ability to offer a solution to platform fragmentation with a single codebase is a value proposition resonating with an increasing number of companies and developers.

However, like any framework or tool, Flutter is not without its criticisms. While its ability to deliver consistent apps across multiple platforms is impressive, some developers argue that it can never fully replace the native development experience for iOS or Android. Native apps, developed specifically for a platform, have the potential to integrate more closely with the unique features of the operating system, which can offer certain advantages in terms of performance and functionality.

There are occasions when developers may need to access specific OS functionalities or leverage native libraries and SDKs that are not directly exposed to the framework. For these situations, Flutter doesn’t leave developers in the lurch; instead, it provides an elegant and efficient solution called “Platform Channels” that allows us to create native code.

As technology advances, so does Flutter. With Google actively supporting the framework’s development, we are likely to see increased integration with emerging technologies, such as augmented reality, virtual reality, and perhaps even platforms that have not yet been invented. Furthermore, as the Flutter ecosystem matures, the line between native development and Flutter is likely to become increasingly blurred, offering developers the best of both worlds.

In the next chapter, we will become familiar with Widgets, the different types that exist, and how to use them to build the structure of our applications by combining them with each other. This is an essential part of development with Flutter, and we must master it in order to create high-quality applications.

You can use the comments section below to ask questions or share your thoughts about this chapter. If you liked it, please consider sharing it with others using the social media buttons at the bottom of this page.

Happy Coding!