Cocos platform integrated AGC performance management (1)-Cocos application release

Looking at the official introduction on the homepage of the Cocos Creator product, Huawei AppGallery Connect (hereinafter referred to as AGC) has been supported since the V2.4.1 version, and a number of AGC services have been provided. I carefully searched the official documents and found that there are really many supported AGC platform services. As shown in the figure below: For

the purpose of verification and trial, I plan to use the "performance management" service to practice and monitor the performance data of the Cocos application. First understand what is the performance management service.

AGC Performance Management Service

The AGC performance management service can provide minute-level application performance monitoring capabilities. Developers can view and analyze the application performance data collected by the performance management service in the AGC background to fully understand the performance characteristics of the developed application and quickly and accurately repair the existing performance of the application Problem, continue to improve the user experience of the application.

To put it bluntly, the AGC performance management service can help you monitor the performance data of your application, including application performance data in scenarios such as application startup, page loading, and network requests. It can be inferred that for applications such as games that pay special attention to user experience, it is possible to accurately find out the areas that need improvement in application performance. In order to test its functions, we first tested the AGC's support for Cocos applications.

Download and install Cocos Dashboard

1. Cocos Dashboard is the interface development tool of Cocos. The download address of Cocos Dashboard is as follows: https://www.cocos.com/creator/ (The latest version is V2.4.2)
   

2. When installing Cocos Dashboard, you need to install Visual Studio to obtain Cocos dependencies. The installation steps and instructions are as follows:
   
   

3. After the installation is complete, click "Run Now" to open the Dashboard.
   

Download and install Cocos Creator

1. Open the downloaded Dashboard and click on the upper right corner to log in. If you don't have an account, you can register one first.
   
2. After registering and logging in, click "Editor" on the left and click the "Download" button in the lower right corner.
   
3. On the Editor interface, select the latest version of Cocos Creator and click the download button on the right. After agreeing to the relevant terms, the download will start.
   
4. After the download is complete, you can create a new Cocos project in the Project interface. You can first create a new HelloWorld project to test the water.
   
5. When opening the HelloWorld project for the first time, you will be prompted to select a language. Just choose Chinese here. Select the corresponding operating environment and click Run to see the effect.
   

Configure VS Code compilation environment

Due to the imperfect functions of the code editor that comes with Cocos, it is only suitable for quick browsing and a small amount of editing. For developers, a more mature and powerful code editing environment is needed, so we need to install Visual Studio Code to edit and manage user project codes.

1. Download and install the corresponding version of Visual Studio Code according to the computer environment.
   
2. Add an adaptation plug-in in Cocos Creator: Open your project in Cocos Creator, then select Developer -> VS Code Workflow -> Install VS Code Extension Plug-in in the main menu.
   
3. The following figure appears on the console to indicate a successful installation:
   
4. If you want to automatically prompt the Cocos Creator engine API during the code writing process, you need to generate the API intelligent prompt data through the menu and automatically put it in the project path. Select Developer -> VS Code Workflow -> Update VS Code Smart Prompt Data in the main menu.
   
5. Double-click the HelloWorld.js script in the project directory, and select "Yes" in the pop-up window to select the just downloaded and installed VS CODE as the default script editor.
   
6. After the selection is complete, double-click the HelloWorld.js script again, and you can happily use VS CODE for development at this time.

Package and publish Cocos application to AGC

Starting from v2.4.1, Cocos Creator supports the release of packaged applications to AGC, helping developers to access Huawei's application market, and has begun to support AGC services, such as performance management, which can be directly integrated and used quickly. The following will specifically introduce:

1. Log in to the AGC console and create related applications.
   

2. Enter Cocos Creator, select Project -> Build Release, open the Build Release panel, and select "HUAWEI AppGallery Connect" as the release platform.
   

3. After configuration, click Build. When the console displays Built huawei-agcsuccessfully, it means the build is successful.
   Note: When building the project for the first time, you need to configure the Android SDK path and NDK path in the "File->Settings" directory of Cocos in the native development environment interface. **

4. After the build is successful, click Compile and wait for the compilation to succeed.
   

5. After the compilation is successful, the jsb-default or jsb-link folder is generated in the build directory of the default release path (depending on the template selected in the build release panel), which has automatically integrated HUAWEI AppGallery Connect related services, and open the jsb-link file You can see the APK file generated by packaging in the pulish path in the folder.
   
   

6. Upload the packaged APK file locally or in the AGC console.

• Upload via Auth.
  a) Upload via Auth.
  

Fill in the page content as described in the following table:

b) Upload via API Client.

Use API Client to upload, this method need to log AGC backstage access to relevant configuration information: select user access -> Connect API -> create , create a client API, and select the role as needed, and then click OK.
　　

Use API Client to upload, and fill in the API client's client ID and key into the corresponding input box in the Creator upload panel. After the configuration is complete, click "Confirm upload".

After the upload is successful, you can see the APK just uploaded on the AGC console.

• AGC console upload

  Click the relevant application in the AGC console to enter the version information page, click "Package Management", click "Upload", and select the APK generated by the local Cocos to upload.
  

So far, a HelloWorld Cocos application has been successfully released.

For more details, please refer to:

Cocos official document: https://docs.cocos.com/creator/manual/zh/getting-started/install.html

AGC performance management development guidance document: https://developer.huawei.com/consumer/cn/doc/development/AppGallery-connect-Guides/agc-apms-introduction

AGC console: https://developer.huawei.com/consumer/cn/service/josp/agc/index.html

---

Original link: https://developer.huawei.com/consumer/cn/forum/topicview?tid=0203359161844040878&fid=0101271690375130218
Author: Drum Chao