Introduction: application performance monitoring platform is used to help customers improve quality and stability is an important part of the application performance, as a mobile terminal developers use and has a wealth of operational experience, hope that through this article to share the past experience and the use of comments, let me to participate in the development of U – APM this product, as a reference can help more developers in the medium and long term planning.

Author: Ameng + technical expert Qian Xiang

An overview,

Application performance monitoring platform is used to help customers improve quality and stability is an important part of the application performance, as a mobile terminal developers use and has a wealth of operational experience, hope that through this article to share the past experience and the use of comments, let me to participate in the development of U – APM this product, as a reference can help more developers in the medium and long term planning.

(The following content is only for the use of stability monitoring platform platform experience and experience, the platform mentioned in the article is for reference only)

Second, product audience

1. Get to know them

Users of application performance monitoring platforms are often developers who are at the forefront of mobile terminals, and they need to pay attention to stability, user performance, experience and other aspects. Good tools can help them in day-to-day operations.

1.1 Responsibilities of the mobile developer team

The audience for such products is mainly mobile developers, and mobile developers are divided into front-end and client, with responsibilities assigned according to the characteristics of the technology stack they use, although the advent of cross-end technology makes the boundaries less clear.

1.2 Mobile Developer’s daily work

The daily responsibilities of developers are mainly divided into two parts: development and operation and maintenance. Problems in development can generally be located and solved through debugging environment, while in operation and maintenance stage, online codes are compressed, confused and encrypted, and become difficult to identify and cannot be directly located. Different systems, operating environments, network conditions, and low quality code can lead to unpredictable performance issues, quantitative reporting of operations and maintenance work, and so on. These are the challenges that mobile developers face on a daily basis.

1.3 Scenario Summary

If the application performance monitoring platform is divided into pre-launch and post-launch scenarios, ** lists the above scenarios.

1.4 Application Performance Monitoring Platform

Most application performance monitoring platforms in the market or within the company can solve the above scenarios

2. Case sharing

Below, I will share three cases combining the scenarios mentioned above

2.1 Case 1 (Single Device Error Detection)

The single-device error troubleshooting scenario has high requirements for the person/developer on duty, such as the urgency of troubleshooting time, familiarity with development links, and completeness of troubleshooting tools. (This scenario is often seen with important customer or leader feedback)

2.2 Case 2 (Performance Optimization)

2.2.1 Optimization background

  • Technology Stack: React Native
  • Advantages: RN has the ability to write three-terminal execution at a time, dynamically deploy and logically deliver to the client, which solves problems such as low efficiency of client version review and update, inconsistent three-terminal development technical solutions, and repetitive labor in three-terminal common requirements
  • Disadvantages: RN execution stage can be divided into RN loading stage and RN running stage, and the corresponding RN pages face different performance problems

2.2.2 RN framework loading process

In order to have a clearer understanding of the problems in the loading stage of RN, let’s first analyze the loading mechanism of RN

In the process of entering the entire RN page, the RN frame load goes through the following steps:

  • Download and decompress the package: The system downloads and decompresses the package from the server if no corresponding package file is found on the local PC.
  • Get initialization engine: RN’s pre-initialization engine feature, which creates an initialized engine ahead of time and caches it, then releases it after 2 minutes on the exit page.
  • Load the business package: Load the JS code of the business into an initialized engine. This link is limited by the size of business JS and device performance, and the loading time is generally long.
  • Run the business package: Execute the runApplication() method in the business JS to start rendering the Native page. This process is limited by the complexity of business JS and device performance. If many components are rendered for the first time, the loading time will be longer.

2.2.3 Indicators and dimensions commonly used in RN framework

  • Page loading time is the most intuitive feeling of the performance of RN loading stage
  • Therefore, RN technology not only brings various advantages, but also has some performance and experience problems, which requires some optimization methods and indicators to support the stable operation of the business

Different terminal technology stacks need to tailor their own performance indicators and dimensions according to their key stages of loading and running. This allows developers to monitor every step of the page loading and running process for optimization.

2.2.4 Optimization process & Results

Problem discovery:

  • The page loading time (90th percentile) is about 1.2s for a long time, which is within 1s of the required standard threshold
  • After multi-dimensional screening by referring to RN loading process, it is found that many users are visiting this page for the first time, and it takes a lot of time to download the code package, especially for low network. Therefore, we need to advance the time when users download the bundle and reduce the size of the bundle.

Solution:

  • It’s much easier to know where the problem lies. We’ve put together a combination of package size optimizations, package pre-download times, etc., which we won’t expand on here.

Optimization results:

  • Optimization result: ** page load time (90th bit) ** Reduced time to 0.5s

2.3 Case 3 (Report)

Reporting can be generally divided into two forms: report and on-duty push. It mainly tracks and synchronizes important performance indicators of the monitored page or business line in real time or regularly, which is convenient for the responsible team to take the next action (such as optimization and error repair).

Online promotion Day duty scenario (a marketing promotion day XXXX.xx.xx)

One week before the marketing promotion

  • Summarize the services of each mobile team
  • List the pages covered by the business of each mobile terminal team and confirm whether the monitoring is covered
  • The technical duty leader of each team confirms the data indicators and alarm thresholds of each technology stack (H5, Native, RN, etc.) and sets application performance monitoring to periodically report and push the duty group
  • Each group determines the duty day arrangement, tracks the abnormal situation of the duty group threshold in real time, and responds in time.

The above is the introduction of this issue. I hope the technical content written by umENG + r&d team can better help developers solve problems. Umeng + will accompany developers to progress and grow together. Stay tuned for the next episode.

The original link

This article is the original content of Aliyun and shall not be reproduced without permission.