Flutter is a cross-platform framework. Its development technology stack integrates Native and front-end technologies. It not only involves the development knowledge of Native (Android, iOS), but also draws on many front-end (such as React) technical concepts and frameworks. On this basis, it has been improved, forming Flutter's own unique technical thinking. For this reason, in this booklet, we will talk about Native development knowledge in Flutter and front-end development knowledge. The most important thing is to explain Flutter's own unique technical thinking. Only by mastering the technical thinking of Flutter can you master Flutter development. In order to better help readers learn Flutter, the examples in each chapter of this booklet have example codes, and the codes have been uploaded to Github (Github link is in the following chapters), which can be easily downloaded and used.

Flutter is a good practice

Readers may already know flutter, it is a cross-platform rendering framework. Correspondingly, there are many similar schemes in react-native. But in terms of internal implementation, Flutter is still quite different from other solutions.

Its biggest highlight is that its father is Google. Sufficient resources and capabilities have led to a very low-level and radical design plan. So its implementation is not to do view mapping, but to directly adjust GPU rendering. So in general, performance is the best among all cross-platform solutions.

In fact, various solutions have been exploring cross-platform since more than ten years ago, most of which are solutions for mapping between webview and native view. However, flutter's aggressiveness is probably the most reliable and hopeful solution.

From a market point of view, Google is pushing flutter vigorously. I also decided to try a wave after listening to flutter's speech at Google Developers Day 2018 shanghai. Experience the new solution.

Flutter experience

• Hot reload

The hot reload of flutter doesn't really feel very strong to me, after all, I have been doing web development for a long time. Friends of the native client may be more interested in this feature, after all, a small change means recompilation and execution. But when I was developing windows uwp, the xaml code update was also real-time, and it was only the view update, which was the same as the flutter StatelessWidget update.

So although hot reload may be a big feature, it is not very attractive to people like me who use it frequently. This should be the case.

• package manager

Flutter comes with pub for dependency management. Compared with golang next door, dart pub is not as good as a Google product. Pub even provides mirror images for domestic users in semi-official form!

Since I have been using npm for a long time, I am deeply aware that the code quality of the node community is out of the sky. However, since dart is a static language and few beginners play dart, in my opinion, the code quality is at least much better than npm.

And as long as a certain dependency is installed, vscode can directly import the required package, which is exactly the same as the IDE, which is very considerate.

• IDE support

In addition to directly importing the required packages mentioned above, you can also run flutter packages get directly when the dependencies change to automatically pull new packages.

Moreover, the refactor function is very well done, with the mutual conversion of StatelessWidget and StatefulWidget, and even the intimate and simple function of directly wrapping a layer of new view on the currently selected view.

Many times I write a StatelessWidget by hand and use the refactor provided by vscode to convert it into a StatefulWidget. The process is very friendly and comfortable. Dartlang is indeed a pretty good language.

• Marketing

Google's marketing is still in place. Starting this year, flutter has its own presence on various Google developer occasions of all sizes. The topic also focuses on its advantages-single code base, hot reload, performance these three topics. And Google is an international company, so the scope of influence is relatively wide. It is also because domestic developers have a special feeling for Google, so listening to the expression of the flutter team, it seems that Chinese developers are the most active and enthusiastic.

In fact, after thinking about it carefully, mongoDB may only be better than Google in technical marketing.

• Performance

Performance has always been a strong point of the Flutter team. Of course they do have the strength to blow so.

The underlying implementation of Flutter does not rely on the so-called multi-threading (WeChat applet), nor does it rely on View mapping (react native), but directly compiles it into arm code and calls GPU for direct rendering. Such a radical plan may only be done by Google, and they have at least one team dedicated to GPU coding. Skia is the bottom layer of flutter rendering. In almost all Google GUI products such as chrome and Android, the steps to the GPU are handled by Skia. These endorsements also prove that Skia is a pretty reliable rendering engine.

And judging from the content of the speech, many of the Flutter team should have been transferred from the Skia team. So if these people get together, the performance will almost be shameful. Many benchmarks do show that Flutter performs well.

• Learning cost

What is different from the perception of many people is: I think Flutter may be the lowest learning cost among all cross-platform frameworks.

Beginners may see dartlang's scalp numb, after all, you have to learn a new language, but in fact, when you think about it, Dartlang and java are relatively similar, and similar to most OOP languages. Most of the concepts of types, interfaces, statics, and declarations are learned by engineers with programming experience within a few days after looking at the documentation.

One big advantage of flutter is that you can write flutter without understanding the native stuff (at least at the UI level). If readers have tried to write react native, they will understand what I mean: it is difficult for an experienced web developer who has never contacted native development to get started with react-native.

Take an example: long list rendering. The API of react native is cumbersome and requires concepts such as dataSource, delegate, etc. Because it is mapping, developers need to know UITableView and understand its design ideas. So if you haven't learned iOS development, you will be very confused when you encounter React Native ListView. But it's all in flutter, there is ListView.buildno concept of native development at all , and there is no need to understand native implementation except for learning API definition.

At the same time, the recent project Clippingkk does require a client, so I started a project with flutter when I came back.

To sum up

The main reason I gave up flutter is that it is still in a fairly early stage, with nothing but the view layer. The second reason is that the cost of native development is quite low, and relatively speaking, I can understand the idea of ​​native better, after all, it is more mature.

As for performance, it may be my least value.

Of course, Flutter is a very good practice. It directly changes from the bottom and hopes to unify multiple platforms. If Google gives enough support and long enough, flutter will develop better, and finally it may be able to unify multiple platforms.

I sincerely hope that Flutter can develop better and faster. Such excellent engineering works deserve to be taken seriously.

However, commercial products are still not suitable in my opinion. Or a simple view layer to bridge is also acceptable.