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

This article mainly introduces the relevant knowledge of "how to do Flutter High availability SDK". The editor shows you the operation process through an actual case. The operation method is simple, fast and practical. I hope this article "how to do Flutter High availability SDK" can help you solve the problem.

There's a reason.-Why are we doing Flutter High availability SDK?

In fact, mobile APM is already a very mature proposition. In the development of the Native world these years, there have been many SDK for monitoring online performance data. However, because Flutter has made many revolutionary changes compared to Native, the performance monitoring of Native has almost completely failed on the Flutter page. Against this background, we launched a project called Flutter High availability SDK last year to make Flutter pages as measurable as Native pages.

What kind of SDK do we need?

Since performance monitoring is a mature proposition, it means that we have sufficient resources to learn from. We draw lessons from the performance monitoring SDK, including EMAS High availability, Wechat's Martix, Meituan's Hertz, etc., and combined with the actual situation of Flutter, we identified two questions, one is what performance metrics need to be collected, and the other is what characteristics SDK needs to have.

Performance metrics:

Page sliding fluency: traditionally, sliding fluency is mainly reflected through Fps, but Fps has a problem that it is unable to distinguish between a large number of light stutters and a small number of serious stutters, but it is obvious that there is a great difference in somatosensory for users, so we also introduce Fps, sliding time and frame dropping time to measure whether it is smooth or not.

Page loading time: page loading takes time. We choose the interactive time that can better reflect the user's body feeling. The interactive time refers to the period from the time when the user clicks to initiate the routing jump behavior, to the time when the page content is loaded to the end of the interaction.

Exception: this indicator should not need to be explained.

SDK features:

Accuracy: accuracy is a basic requirement of a performance monitoring SDK. Misreporting or misreporting will cause developers to spend a lot of unnecessary troubleshooting time.

Online monitoring: online monitoring means that the cost of collecting data should not be too high, and monitoring should not affect the original performance of App.

Easy to expand: as an open source project, the fundamental goal is to expect everyone to participate and contribute to the community, so SDK itself should be easy to expand, while a series of specifications are needed to help you develop.

Look at SDK from a single indicator

First you need to implement a FpsRecorder and inherit it from BaseRecorder. The purpose of this class is to obtain the timing of the Pop/Push of the page in the business layer and the time when the page provided by FlutterBinding starts rendering, ends rendering, and clicks occur, and calculates the source data through these timing. For instantaneous Fps, the source data is the time of each frame.

Class FpsRecorder extends BaseRecorder {/... @ override void onReceivedEvent (BaseEvent event) {if (event is RouterEvent) {/...} else if (event is RenderEvent) {switch (event.eventType) {case RenderEventType.beginFrame: _ frameStopwatch.reset (); _ frameStopwatch.start (); break; case RenderEventType.endFrame: _ frameStopwatch.stop () PerformanceDataCenter () .push (FrameData (_ frameStopwatch.elapsedMicroseconds)); break;}} else if (event is UserInputEvent) {/...}} @ override List subscribedEventList () {return [RenderEvent, RouterEvent, UserInputEvent];}}

We can get the length of each frame by laying down the start point in beginFrame and the end point in endFrame. You can see that after collecting the length of each frame, we encapsulate it into a FrameData and push it into the PerformanceDataCenter. PerformanceDataCenter distributes this data to Processor that subscribes to FrameData, so we need to create a new FpsProcessor subscription and process the source data.

Class FpsProcessor extends BaseProcessor {/... @ override void process (BaseData data) {if (data is FrameData) {/. If (isFinishedWithSample (currentTime)) {/ when the interval is greater than 1s, calculate FPS _ startSampleTime = currentTime; collectSample (currentTime);}} @ override List subscribedDataList () {return [FrameData];} void collectSample (int finishSampleTime) {/. PerformanceDataCenter () .push (FpsUploadData (avgFps: fps));} / /.}

FpsProcessor collects the time length of each frame and calculates the instantaneous FPS within 1 second (for specific statistical methods, please refer to the implementation of the previous article mentioned above, which is not described too much here). Similarly, after calculating the FPS value, we encapsulate it into a FpsUploadData and push it into the PerformanceDataCenter again. PerformanceDataCenter will hand over the FpsUploadData to the Uploader that subscribed to it for processing, so we need to create a new MyUploader subscription and process the data.

Class MyUploader extends BaseUploader {@ override List subscribedDataList () {return [FpsUploadData, / / TimeUploadData, ScrollUploadData, ExceptionUploadData,];} @ override void upload (BaseUploadData data) {if (data is FpsUploadData) {_ sendFPS (data.pageInfoData.pageName, data.avgFps);} / /.}}

Uploader can select the UploadData you want to subscribe to through subscribedDataList (), and receive the notify through upload () and report it. In theory, a Uploader corresponds to an upload channel, and users can report data to different places as needed, such as LocalLogUploader, NetworkUploader, etc.

An overview of the overall structural design of global-SDK

SDK can be divided into four layers, and the publish-subscribe model is widely used to connect with two Center. The advantage of this model is that it can decouple the layers completely and make the data processing more flexible.

API

There are mainly some exposed interfaces in this layer. For example, init () requires the consumer to make a call before runApp (), and the business layer needs to call the pushEvent () method to provide some opportunity for SDK.

Recorder

The main responsibility of this layer is to collect the corresponding source data using the timing provided by Evnet and hand it over to the Processor that subscribes to the data for processing. For example, the time length of each frame in FPS acquisition is the source data. The design of this layer is mainly to make the source data can be used in different places, for example, the length of each frame can be used not only to calculate FPS, but also to calculate the number of stutter seconds.

When using it, you need to inherit BaseRecoder, select the subscribed Event through subscribedEventList (), and process the received Event in onReceivedEvent ().

Abstract class BaseRecorder with TimingObserver {BaseRecorder () {PerformanceEventCenter () .subscribe (this, subscribedEventList ());} mixin TimingObserver {void onReceivedEvent (BaseEvent event); List subscribedEventList ();}

Processor

This layer mainly processes the source data into data that can eventually be reported, and gives it to the Uploader that subscribes to the data for reporting. For example, the FPS acquisition is calculated according to the time length of each frame collected, and the FPS value during this period of time is obtained.

When using it, you need to inherit BaseProcessor, select the Data type of subscription through subscribedDataList (), and process the received Data in process ().

Abstract class BaseProcessor {void process (BaseData data); List subscribedDataList (); BaseProcessor () {PerformanceDataCenter () .registerProcessor (this, subscribedDataList ());}}

Uploader

This layer is mainly implemented by the users themselves, because each user wants to report the data to different places, so the SDK will provide the corresponding base class. You only need to follow the specification of the base class to get the subscription data.

When using it, you need to inherit BaseUploader, select the Data type of subscription through subscribedDataList (), and process the received UploadData in upload ().

Abstract class BaseUploader {void upload (BaseUploadData data); List subscribedDataList (); BaseUploader () {PerformanceDataCenter () .registerUploader (this, subscribedDataList ());}}

PerformanceDataCenter

A singleton is used to receive BaseData (source data) and UploadData (processed data) and distribute these opportunities to the Processor and Uploader that subscribe to them for processing.

In the constructors of BaseProcessor and BaseUploader, the register method of PerformanceDataCenter is called to subscribe. This operation stores the corresponding instance in two Map of PerformanceDataCenter. This data structure enables a DataType to correspond to multiple subscribers.

Final Map _ processorMap = {}; final Map _ uploaderMap = {}

When the PerformanceDataCenter.push () method push data is called, it is distributed according to the type of Data and handed over to all Proceesor/Uploader subscribed to that data type.

PerformanceEventCenter

Singleton, the design idea is similar to PerformanceDataCenter, but here is to receive the Event provided by the business layer (corresponding timing) and distribute these opportunities to the Recorder that subscribes to them for processing. The main types of Event are: (the business status needs to be provided by the user, and the collection has been completed within the SDK at other times)

App status: App switching between foreground and background

Page status: frame rendering starts, frame rendering ends

Business status: Pop/Push occurs on the page, sliding occurs on the page, Exception occurs in the business

Different opinions-the way SDK is opened

If you are a SDK user, then you only need to focus on the API layer and the Uploader layer, you only need to do the following steps:

Reference highly available SDK in Pubspec

Before the runApp () method is called, call the init () method to initialize the SDK

In your business code, use the pushEvent () method to provide SDK with some necessary opportunities, such as routed Pop and Push

Customize a Uploader class to report the data to the data collection platform you use in the format you want.

If you wish to contribute to the high availability of SDK, we hope you will comply with the following design specifications and propose Push Request to us. We will carry out Review in time and give you feedback.

Using the publish-subscribe model, the publisher first gives the data to the corresponding data center, and then the data center distributes it to the corresponding subscribers.

Data flows from Recorder to Processor and then to Uploader, which is driven by data. API drives Recorder,Recorder through Event, drives Processor,Processor through BaseData and drives Uploader through UploadData.

This is the end of the introduction to "how to do Flutter High availability SDK". Thank you for reading. If you want to know more about the industry, you can follow the industry information channel. The editor will update different knowledge points for you every day.

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.