Introduction

Google announced Flutter in 2017, and it skyrocketed to the top of the list of the fastest application development platforms. Currently, it is the third most popular app development framework. Flutter is a high-level native UI platform that is open-source for Android and iOS devices and is powered by Dart. It is correct to say that without Dart, there will be no Flutter.

Concept of Flutter

Flutter has an amazing rich user interface that makes app development simple for developers. Also, Flutter offers reactive and declarative programming techniques, which makes it quite comparable to React Native. Flutter is also a portable user interface toolkit with many widgets and features. It offers a platform for programmers to easily create and distribute natively built, aesthetically pleasing applications for various platforms.

Features of the Flutter framework

Hot reloading

Developers are able to view their results on the screen in real-time and this is as a result of Flutter’s Hot Reload functionality. Developers can also add features, address bugs and do a lot more without worrying about memory constraints.

Rich widgets

A native app developer can combine different widgets according to the client’s needs to create a very beautiful and expressive user experience using Flutter.

Efficient user interface

Developers can work with many interfaces at the same time thanks to the portable and well-organized GPU (Graphics Processing Unit) rendering in Flutter.

Available for all platforms

Unlike many other platforms, Flutter can work with iOS, Windows, Linux, Android, and macOS.

Single codebase

With Flutter, developers can construct strong enterprise-grade apps for Android and iOS mobile applications utilizing a single code base. This means that with flutter, companies don't need to hire different developers for Android and iOS. Developers can manage their code more efficiently because they don’t have to write separate code for both platforms.

Concept of Dart

Google released Dart as an open-source, platform-neutral, and object-oriented programming language. With Dart language, you can create apps for both iOS and Android using the same codebase. Dart code can be converted into native code for desktop and mobile platforms. Also, thanks to direct compilation, Dart can connect with any platform thanks to direct compilation without a separate bridge, unlike React Native.

Features of Dart language

Extensive library

Dart comes with many helpful pre-built libraries, including Math, Convert, HTML, SDK, Core, and others. Dart also enables developers to properly name-space and group Dart code into the necessary libraries. Developers can reuse the libraries by using the import statement.

Versatile compilation

Dart has the resilience needed to compile code at lightning speed. It supports the JIT (Just in Time) and AOT (Always on Time) compilation techniques. This feature makes it simple for developers to transmit and effectively run the Dart programming language in several web browsers.

Security-based language

Dart is a type-safe programming language that allows developers to employ runtime and static type checking to ensure that a variable’s value always matches its static type.

How Flutter and Dart Work Together

The term Flutter refers to two major things/concepts which are;

1. Flutter SDK

2. Flutter Framework

Flutter SDK: is a collection of tools that allows you to build any kind of app for both Android & iOS platforms in one codebase.

Flutter Framework: Basically it provides all the predefined widgets/widget library, utility functions & packages.

At this point, we know flutter uses Dart as a programming language. And apps built by flutter can be run on Android & iOS. And so, we need to compile the dart code to the native machine android/iOS code. And the compilation task is done by the Flutter SDK. There are two kinds of operation/compilation and they include;

• Static Compilation

• Dynamic Interpretation

Static Compilation: Statically compiled programs are all translated into machine code before execution. Ex: AOT(Ahead of Time) - C/C++.

Dynamic Interpretation: is executed by one-to-one translation. Ex: JIT(Just in Time) - JavaScript/Python.

These compilations enable Dart code convert into machine code. Flutter on the other hand, does not use web view or native controls of the operating system but is dependent on its own high performance rendering engine called Skia to draw widgets which can only be guaranteed with the help of Dart. Flutter’s engine hosts Skia — a 2D graphics rendering library — and the Dart language VM in a platform-specific shell. Any shell implements the respective platform APIs and handles the system’s application lifecycle events. Using the Dart language allows Flutter to compile the source code ahead of time to native code. The engine’s C/C++code is compiled with Android’s NDK or iOS’ LLVM. Both pieces are wrapped in a “runner” Android and iOS project which ultimately results in an apk or ipa file respectively. On app launch, any input, rendering, or event is delegated to the compiled Flutter engine and app code. Having to package the engine with the app’s apk/ipa file currently leads to an increased app size of 4MB. Fast startup and execution of an app are the benefits of compilation to native code. The UI is refreshed at 60fps, mostly using the GPU and every pixel on the screen is owned by the Skia canvas which leads to a smooth and highly customizable UI.

Summary

This article explicitly explains the relationship between flutter and dart and how they work together by highlighting their concepts first. We also explored the connection that makes flutter dependent on dart and how dart compilations enable flutter create widgets using its host engine Skia.