Shulou(Shulou.com)06/03 Report--

This article will explain in detail how to deeply understand the data monitoring on Flutter. The content of the article is of high quality, so the editor shares it for you as a reference. I hope you will have some understanding of the relevant knowledge after reading this article.

Preface

Recently, when I looked at the company's Flutter project, I found that it was very difficult to analyze the data, either missing data or abnormal data. As a mature enterprise, this is very dangerous. Without data, it is like a ship that has no direction while sailing at sea, and will become at a loss as to what to do. So I spent some time this week to optimize.

What data do we want to focus on? for a component like Flutter, there are only two items of data we need to focus on:

Performance data exception data

These two data are the most basic and important indicators for us to monitor the excellence of the entire Flutter application. Performance data can help us analyze whether Flutter has advantages over frameworks such as Native,RN,Weex, while abnormal data reflects the health of the project. In many cases, problems are not exposed during project development and testing, but there will be problems online. Without exception monitoring, it is difficult for applications to recover quickly from errors.

Performance data

For performance data, we can split it into the following two points:

Rendering time page frame rate

As for the frame rate of the page, I haven't thought about it carefully so far. I will introduce the content of this section in a later article.

For the rendering time, we can monitor the rendering time of the first frame of the page through the system callback given by Flutter. Android is the following method:

GetFlutterView () .addFirstFrameListener (new FlutterView.FirstFrameListener () {@ Override public void onFirstFrame () {/ / first frame rendering callback}})

IOS is about the same. For details, you can refer to the examples on the Internet.

Abnormal data

For abnormal data, we can split it into the following points:

The number of times a page has been opened, the number of times an exception occurred on a page, the number of times an exception occurred in Framework, the number of times an exception occurred in crash.

Counting the number of times the page is opened is to enable us to better observe the data of the whole market, and use it as the denominator to get the success rate of our entire Flutter project rendering, which is a very important indicator.

But let's think about it. If we use navigator to open a page in Flutter, we won't be able to perceive that a Flutter page is open if we don't do any processing, so we need to listen to the opening and closing of the page by registering the observer of nevigator:

Widget build (BuildContext context) {return new MaterialApp (navigatorObservers: [new MyNavigatorObserver ()], home: new Scaffold (body: new MyPage (),););}

In MyNavigatorObserver, the didPush method is used to report the buried point where the page is opened.

After we have the opening data of the page, the next thing we need to count is the number of exceptions. In Flutter, exceptions can be roughly divided into three categories:

Dart exception Framework exception crash

For Dart exceptions, we can catch them through the global onError function:

RunZoned (() async {runApp (new MyApp ());}, onError-: (error, stackTrace) async {/ / listening DartError})

But the callback here is that error will be triggered as long as there is a Dart layer, which brings a problem: many unimportant error that do not affect the user experience will be counted by us, thus affecting the accuracy of our data. With regard to the above question, my idea is that since we want to count the error that affects users, we can make use of the characteristics of Flutter itself. We know that if an exception occurs in Flutter during build, a red screen widget will be displayed. This widget is ErrorWidget. All we need is the generation of hook, this widget, and report the burying point we need when the widget is displayed:

ErrorWidget.builder = (FlutterErrorDetails flutterErrorDetails) {/ / Statistical Dart error return ErrorWidget (flutterErrorDetails.exception);}

We can even rewrite the ErrorWidget here to show our custom error page.

After talking about the Dart exception, we go on to deal with the Framework exception. This exception is special and should be unique to Android, because in Android we need to load the dynamic library to complete the initialization of the Flutter, so here we can capture the loading of the dynamic library. If an exception occurs or the loading fails, it will be counted as an exception in the Framework layer.

The last one is the runtime crash, for this part of the exception, all we need to do is to capture the stack and determine whether the crash is caused by Flutter, and if so, report the burial point.

Through the above statistics, we can calculate the following data of Flutter application:

Page rendering time, page frame rate, page opening times, page anomaly rate, page collapse rate.

With the above data, we can optimize our business according to them and go a step further.

On how to in-depth understanding of data monitoring on Flutter to share here, I hope that the above content can be of some help to you, can learn more knowledge. If you think the article is good, you can share it for more people to see.

Welcome to subscribe "Shulou Technology Information " to get latest news, interesting things and hot topics in the IT industry, and controls the hottest and latest Internet news, technology news and IT industry trends.