• First, talk about cross-platform development
  • Second, learn about Flutter
    • 1. The Flutter
    • 2. Advantages of Flutter
    • 3. The disadvantages of Flutter
  • Iii. Overall structure and principle of Flutter
    • 1. The Framework layer
    • 2. Engine layer
    • Principle 3.
  • Why Flutter
  • Five, the summary
  • Vi. Introduction to personal articles
    • 1. Content introduction
    • 2. Contents of articles

First, talk about cross-platform development

To put it simply, cross-platform development is “killing two birds with one stone”. In the early days without cross-platform frameworks, developers had to write code for each platform (Android, iOS, Windows, etc.) of the same application. This is time-consuming and costly work for the developer and for the companies that have invested in the app.

Cross-platform development means that it can run on multiple platforms, such as Android and iOS, using only one set of code, avoiding high maintenance costs and saving a lot of time and resources.

Cross-platform development is one of the most popular and widely used frameworks today. Cross-platform development frameworks include Cordova, Ionic, Weex, DCloud, React Native, Flutter, etc. There are a lot of frameworks that have fallen by the wayside due to various reasons such as poor performance. But the Flutter framework remains strong and popular.

Second, learn about Flutter

1. The Flutter

Flutter is Google’s open source UI toolkit launched in 2015. As a new generation of cross-platform solutions, Flutter helps developers efficiently build beautiful applications for multiple platforms through a code base that supports mobile, Web, desktop, and embedded platforms. Flutter is the default development software for the future operating system Fuchsia.

Flutter was first unveiled at the Dart Developer Summit in May 2015, originally called “Sky” and later renamed Flutter.

Google released the first version in May 2017, followed by stable 1.0 in early December 2018 and 1.2 at MWC 2019. As of this writing (2021/02/13), the official version of Flutter 1.22 has been released.

Google is currently promoting Flutter as one of the most cutting-edge development tools available. There are also many large projects that use Flutter development in China, such as Alibaba’s Taobao, Toutiao’s Douyin, Tencent’s NOW Live, PubG and QQ Music. In addition, several other small and medium-sized companies are also using Flutter.

2. Advantages of Flutter

Flutter was voted one of the most popular frameworks among developers in StackOverflow’s 2019 Global Developer Survey, ahead of TensorFlow and Node.js. Flutter has been embraced by so many developers because of its obvious advantages:

  • Cross-platform development

A real set of code can run on Android and iOS platforms at the same time, avoiding high maintenance costs and improving development efficiency.

  • Superior performance

Achieve smooth UI with high frame rate through “self drawing UI+ native system”, performance is closer to native. Use Skia as the 2D rendering engine, Dart language as the runtime, and Text as the Text typesetting engine.

  • Hot overload fast development

Flutter uses Google’s Dart, launched in 2011, as its development language. Dart can be AOT (Ahead Of Time) or JIT (Just In Time) compilation, which allows Flutter to achieve sub-second levels during developmentThermal overload, and will not lose state, thus greatly improving the development efficiency.

  • Access native features and SDKS

Make apps powerful and easy to use with platform-specific apis, third-party SDKS, and native code. Flutter allows reuse of existing Java, Swift or ObjC code, access to native system features and system SDKS on iOS and Android.

  • Nice UI

Flutter has many beautiful Material Design and Cupertino (ios-style) widgets built into it, providing a customizable UI framework that is no longer tied to mobile platform controls. Developers can quickly build elegant user interfaces to provide a better user experience.

  • Support for mixed development

Flutter has a wealth of tools and libraries that make it easy to implement ideas and creativity on both iOS and Android systems. If you don’t have any mobile development experience, Flutter is a quick and easy framework to help you build beautiful mobile applications. If you are an experienced iOS or Android developer, you can use Flutter as a View layer and use what has already been done with Java, ObjC, or Swift for a unified app development experience.

  • Low learning cost

Readers with front-end or native development experience will learn Flutter with less effort.

3. The disadvantages of Flutter

Every cross-platform framework has its advantages and disadvantages, and Flutter is no exception. Generally speaking, Flutter has the following disadvantages:

  • The Flutter framework is relatively new and some functions may be lacking.

  • Flutter does not support application development on Android TV or Apple TV.

  • Flutter currently has fewer packages available than JS and TS.

These limitations still stem from the fact that Flutter has only recently been available, but as a framework supported by Google, they will be addressed one by one.

Iii. Overall structure and principle of Flutter

The Flutter Framework is divided into two parts: the upper layer is the open source Framework and the lower layer is the Engine. You can think of it as developing an application based on the Framework and running it in Engine.

1. The Framework layer

The Framework layer is implemented by Dart and contains visual libraries (Widgets), rendering, animation, drawing and gestures. The visual library is divided into Material style and Cupertino style. The Framework contains a large number of apis required for daily development. It is OK for common application developers to be familiar with the use of these apis. However, many special controls need to be customized according to the actual situation.

The Framework includes two sets of visual libraries: Material is Android style and Cupertino is iOS style. On this basis, developers can encapsulate their own style of system components.

Framework layer source address:

Github.com/flutter/flu…

2. Engine layer

Engine layer is implemented by C++ and is the core Engine of Flutter, including Skia graphics Engine, Dart VM, Text rendering Engine, etc.

If you want to learn more about Flutter, you are advised to read the source code for Flutter. Source code address:

Github.com/flutter/eng…

Principle 3.

Both iOS and Android provide a platform View to the Flutter layer, and page content rendering is done by the Flutter layer itself. Therefore, Flutter has better performance than React Native frameworks. The graphics rendering process in Flutter is as follows:

The general process is as follows:

  1. The GPU Vsync signal is synchronized to the UI thread.
  2. The UI thread uses Dart to build an abstract view structure;
  3. The view structure performs layer composition in GPU thread.
  4. The synthesized view data is provided to Skia graphics engine for processing into GPU data.
  5. The data is then provided to the GPU for rendering through OpenGL or Vulkan.

Why Flutter

Flutter is a new cross-platform solution, but it is relatively mature. The Performance of the Flutter is obviously much better than React Native. Additionally, Flutter has several other features that make it the ultimate choice for cross-platform development:

  • Native ARM code

Flutter has a feature called native ARM that makes sense for startups and tech companies. It makes it easier for developers to implement their ideas, bringing the most significant benefits to application projects.

  • Web View Component

This feature makes it easy for users to view Web content in mobile applications. Flutter also makes it easier to jump to and stabilize pages in your app.

  • The Android application package

Flutter supports the Android application pack, a new upload format that contains all the compiled code and resources for your application. This format speeds up the process of packaging APK and publishing it to Google Play.

  • No need to manually manage multiple APKs

These features allow users to download smaller, more optimized VERSIONS of APK. Developers also do not need to build, publish, and manage multiple APKs to support multiple devices.

  • Reduce the APK size

The APK split mechanism used by Android application packs can reduce the size of applications and support new features such as dynamic delivery of Android applications.

  • Dynamic functional module

This feature allows developers to separate certain functions and resources from the application’s base modules and add the former to the application package. For example, if your app includes a camera feature, you can set it as a dynamic module. Users can then download and install the feature on demand.

Five, the summary

To sum up, Flutter is the perfect solution if you want to build powerful cross-platform applications quickly, in less time, and with less code, commercially or not!

Vi. Introduction to personal articles

1. Content introduction

I had no systematic knowledge of mobile development and was not familiar with Java before I came to Flutter, but for some reason I wanted to create my own application, which had better be cross-platform. Finally, the author chose the frame of Flutter. The specific reason has been explained in detail above.

The author wrote on Flutter on the one hand to urge myself to learn Flutter on the other hand to share resources with the vast number of developers and fans. I target my column at mobile developers with zero foundation, and if you are not learning zero foundation, then my article will be more friendly to you.

2. Contents of articles

  1. Why Is Flutter the ultimate cross-platform development choice?
  2. Advance of Flutter (2) — Build the Flutter development environment
  3. Dart Language quick Start with Flutter

For more resources and articles, please follow my wechat official account “Flutter Advanced” :