Flutter is introduced

Flutter is a cross-platform, high-fidelity, high-performance mobile application development framework launched by Google and open source. Dart allows developers to develop apps, a set of code that runs on both iOS and Android. Flutter provides a wealth of components, interfaces, and developers can quickly add native extensions to Flutter. The Flutter also uses a Native engine to render views, which is a great experience for users.

Cross-platform paint engine

Flutter differs from most other frameworks for building mobile applications because Flutter uses neither a WebView nor the native controls of the operating system. Instead, Flutter uses its own high-performance rendering engine to draw widgets. This ensures UI consistency on Both Android and iOS, and avoids the limitations and high maintenance costs associated with native controls dependency.

Flutter uses Skia as its 2D rendering engine. Skia is a Google LIBRARY of 2D graphics processing functions that provide efficient and compact representations of fonts, coordinate transformations, and bitmaps. Skia is cross-platform and provides a very friendly API. Google Chrome and Android both use Skia as their drawing engine.

A high performance

The high performance of Flutter is mainly guaranteed by two points. First, Flutter APP is developed with Dart language. Dart is almost as fast as JavaScript in JUST-in-time (JIT) mode. But Dart supports AOT, and when running in AOT mode, JavaScript can’t catch up. The speed increase is helpful for view data calculation at high frame rates. Second, Flutter uses its own rendering engine to draw the UI. Layout data is directly controlled by Dart language, so it does not need to communicate between JavaScript and Native as RN does during the layout process, which has obvious advantages in some sliding and dragging scenarios. Since layout changes are often caused by sliding and dragging, JavaScript needs to constantly synchronize layout information with Native, which is the same problem as frequent DOM manipulation by JavaScript in the browser, which will bring considerable performance overhead.

Developed in Dart language

This is an interesting but controversial question. Before we understand why Flutter chooses Dart over JavaScript we will introduce two concepts: JIT and AOT.

At present, there are two main ways to run a program: static compilation and dynamic interpretation. Statically compiled programs are all translated into machine code before execution. This type is usually called AOT (Ahead of time). Execution is interpreted by running it sentence by sentence as it is translated, a type often referred to as JUST-in-time (JIT), or “just-in-time compilation.” AOT programs are typically developed in C/C++ applications that must be compiled into machine code before execution, while JIT is widely represented, such as JavaScript, Python, etc. Virtually all scripting languages support JIT mode. However, it should be noted that JIT and AOT refer to the way a program is run and are not strongly related to the programming language. Some languages can be both JIT and AOT, such as Java and Python, which can be compiled into intermediate bytecode at the first execution and then directly execute bytecode at the later execution. Bytecode among some might say, is not the machine code, the program execution time still need to dynamically change the bytecode into machine code, yes, this is not wrong, but usually we distinguish whether as AOT standard is to see if that need to compile the code before execution, as long as it needs to be compiled, regardless of its compilation product is bytecode or machine code, belong to AOT. Here, the reader need not tangle with concepts, concepts are invented to convey the spirit, as long as the reader can understand its principle, forget its form.

Now why did Flutter choose the Dart language? Based on the official explanation and my own understanding of Flutter, I summarize the following (Dart and JavaScript are mainly compared because other cross-platform frameworks use JavaScript as their development language) :

1. High development efficiency

The Dart runtime and compiler support a combination of two key features of Flutter:

Rapid DEVELOPMENT cycle based on JIT: Flutter is adopted in the development phase, adopting JIT mode. This saves development time greatly by avoiding compilation for every change.

Aot-based distribution: Flutter generates efficient ARM code via AOT to ensure application performance when it is released. JavaScript does not have this capability.

2. High performance

Flutter aims to provide a smooth, hi-fi UI experience. To achieve this, Flutter needs to be able to run a lot of code in each animation frame. That means a language that provides high performance without periodic pauses that drop frames, and Dart supports AOT better than JavaScript at this point.

3. Fast memory allocation

The Flutter framework uses functional streams, which makes it heavily dependent on the underlying memory allocator. Therefore, it is important to have a memory allocator that can efficiently handle trivial tasks. Flutter will not work effectively in languages without this feature. Of course, Chrome V8’s JavaScript engine does a good job of allocating memory. In fact, many of the Dart team members come from the Chrome team, so Dart is not an advantage over JavaScript in allocating memory. It needs that, and Dart has it.

4. Type safety

Because Dart is a type-safe language that supports static type detection, some type errors can be found before compilation and potential problems can be ruled out, which may be more attractive to front-end developers. JavaScript, on the other hand, is a weakly typed language, and the front-end community has developed many extension languages and tools that add static typing to JavaScript code, such as Microsoft’S TypeScript and Facebook’s Flow. Dart, by contrast, has built-in support for static typing, which is an important advantage.

5. The Dart team is at your side

It doesn’t look like much, but it matters. Thanks to the Dart team’s active input, the Flutter team has more and easier access to support. As stated on the Flutter website, “We are working closely with the Dart community to improve Dart use in Flutter. For example, when we first adopted Dart, the language didn’t provide a toolchain to generate native binaries (which is great for achieving predictable performance), but now it does, because the Dart team built it specifically for Flutter. Similarly, the Dart VM was previously optimized for throughput, but the team is now optimizing the VM’s latency time, which is more important for the Flutter workload.”

conclusion

This section mainly introduces the features of Flutter. If you feel that some aspects of Flutter are not well understood, don’t worry. As you learn more about Flutter in the future, you will have a better understanding of it when you come back.

Note that the Release package of Flutter is compiled in Dart AOT mode by default, so it does not support dynamic behavior. Dart also has JIT or Snapshot operation modes, which support dynamic behavior.