diff --git a/en/application-dev/reference/apis/js-apis-font.md b/en/application-dev/reference/apis/js-apis-font.md
index 0b7d7fb3abcb1353d022e70ea785f6454cd422b4..ce578a35c157539965e3ea810dbc7d646ed83580 100644
--- a/en/application-dev/reference/apis/js-apis-font.md
+++ b/en/application-dev/reference/apis/js-apis-font.md
@@ -5,6 +5,7 @@ The **font** module provides APIs for registering custom fonts.
> **NOTE**
>
> The initial APIs of this module are supported since API version 9. Newly added APIs will be marked with a superscript to indicate their earliest API version.
+>
## Modules to Import
@@ -28,12 +29,14 @@ Registers a custom font with the font manager.
## FontOptions
+**System capability**: SystemCapability.ArkUI.ArkUI.Full
+
| Name | Type | Mandatory | Description |
| ---------- | ------ | ---- | ------------ |
| familyName | string | Yes | Name of the custom font to register. |
| familySrc | string | Yes | Path of the custom font to register.|
-## Example
+**Example**
```ts
// xxx.ets
diff --git a/en/application-dev/reference/apis/js-apis-matrix4.md b/en/application-dev/reference/apis/js-apis-matrix4.md
index b707f54df167497056052a8524ec00d7bbe11188..e2de4ddcedf439f08598e5aa6b7eaca294fb936c 100644
--- a/en/application-dev/reference/apis/js-apis-matrix4.md
+++ b/en/application-dev/reference/apis/js-apis-matrix4.md
@@ -16,7 +16,7 @@ import matrix4 from '@ohos.matrix4'
## matrix4.init
-init(array: Array<number>): Matrix4Transit
+init(options: [number,number,number,number,number,number,number,number,number,number,number,number,number,number,number,number]): Matrix4Transit
Matrix constructor, which is used to create a 4 x 4 matrix by using the input parameter. Column-major order is used.
@@ -25,17 +25,17 @@ Matrix constructor, which is used to create a 4 x 4 matrix by using the input pa
**Parameters**
-| Name| Type | Mandatory| Description |
-| ------ | ------------------- | ---- | ------------------------------------------------------------ |
-| array | Array<number> | Yes | A number array whose length is 16 (4 x 4). For details, see **array** parameters.
Default value:
[1, 0, 0, 0,
0, 1, 0, 0,
0, 0, 1, 0,
0, 0, 0, 1] |
+| Name| Type | Mandatory| Description |
+| ------ | ------------------------------------------------------------ | ---- | ------------------------------------------------------------ |
+| option | [number,number,number,number,number,number,number,number,number,number,number,number,number,number,number,number] | Yes | A number array whose length is 16 (4 x 4). For details, see **Description of a 4 x 4 matrix**.
Default value:
[1, 0, 0, 0,
0, 1, 0, 0,
0, 0, 1, 0,
0, 0, 0, 1] |
**Return value**
-| Type | Description |
-| -------------- | ---------------------------- |
-| Matrix4Transit | 4 x 4 matrix object created based on the input parameter.|
+| Type | Description |
+| --------------------------------- | ---------------------------- |
+| [Matrix4Transit](#matrix4transit) | 4 x 4 matrix object created based on the input parameter.|
-**array** parameters
+**Description of a 4 x 4 matrix**
| Name | Type | Mandatory | Description |
| ---- | ------ | ---- | -------------------- |
@@ -91,9 +91,9 @@ Constructs an identity matrix.
**Return value**
-| Type | Description |
-| -------------- | -------------- |
-| Matrix4Transit | Identity matrix object.|
+| Type | Description |
+| --------------------------------- | -------------- |
+| [Matrix4Transit](#matrix4transit) | Identity matrix object.|
**Example**
@@ -136,9 +136,9 @@ Copies this matrix object.
**Return value**
-| Type | Description |
-| -------------- | -------------------- |
-| Matrix4Transit | Copy object of the current matrix.|
+| Type | Description |
+| --------------------------------- | -------------------- |
+| [Matrix4Transit](#matrix4transit) | Copy object of the current matrix.|
**Example**
@@ -171,12 +171,12 @@ struct Test {
![en-us_image_0000001219744181](figures/en-us_image_0000001219744181.png)
-## Matrix4
+## Matrix4Transit
### combine
-combine(matrix: Matrix4): Matrix4Transit
+combine(options: Matrix4Transit): Matrix4Transit
Combines the effects of two matrices to generate a new matrix object.
@@ -185,15 +185,15 @@ Combines the effects of two matrices to generate a new matrix object.
**Parameters**
-| Name| Type | Mandatory| Description |
-| ------ | ------- | ---- | ------------------ |
-| matrix | Matrix4 | Yes | Matrix object to be combined.|
+| Name| Type | Mandatory| Description |
+| ------ | --------------------------------- | ---- | ------------------ |
+| option | [Matrix4Transit](#matrix4transit) | Yes | Matrix object to be combined.|
**Return value**
-| Type | Description |
-| -------------- | ------------------ |
-| Matrix4Transit | Object after matrix combination.|
+| Type | Description |
+| --------------------------------- | ------------------ |
+| [Matrix4Transit](#matrix4transit) | Object after matrix combination.|
**Example**
@@ -238,9 +238,9 @@ Inverts this matrix object.
**Return value**
-| Type | Description |
-| -------------- | ---------------------- |
-| Matrix4Transit | Inverse matrix object of the current matrix.|
+| Type | Description |
+| --------------------------------- | ---------------------- |
+| [Matrix4Transit](#matrix4transit) | Inverse matrix object of the current matrix.|
**Example**
@@ -273,7 +273,7 @@ struct Tests {
### translate
-translate({x?: number, y?: number, z?: number}): Matrix4Transit
+translate(options: TranslateOption): Matrix4Transit
Translates this matrix object along the x, y, and z axes.
@@ -281,17 +281,15 @@ Translates this matrix object along the x, y, and z axes.
**Parameters**
-| Name| Type | Mandatory| Description |
-| ------ | ------ | ---- | ----------------------------------------------------------- |
-| x | number | No | Translation distance along the x-axis, in px.
Default value: **0**
Value range: (-∞, +∞)|
-| y | number | No | Translation distance along the y-axis, in px.
Default value: **0**
Value range: (-∞, +∞)|
-| z | number | No | Translation distance along the z-axis, in px.
Default value: **0**
Value range: (-∞, +∞)|
+| Name| Type | Mandatory| Description |
+| ------ | ----------------------------------- | ---- | -------------- |
+| option | [TranslateOption](#translateoption) | Yes | Translation configuration.|
**Return value**
-| Type | Description |
-| -------------- | ---------------------------- |
-| Matrix4Transit | Matrix object after the translation effect is added.|
+| Type | Description |
+| --------------------------------- | ---------------------------- |
+| [Matrix4Transit](#matrix4transit) | Matrix object after the translation.|
**Example**
@@ -319,7 +317,7 @@ struct Test {
### scale
-scale({x?: number, y?: number, z?: number, centerX?: number, centerY?: number}): Matrix4Transit
+scale(options: ScaleOption): Matrix4Transit
Scales this matrix object along the x, y, and z axes.
@@ -328,19 +326,16 @@ Scales this matrix object along the x, y, and z axes.
**Parameters**
-| Name | Type | Mandatory| Description |
-| ------- | ------ | ---- | ------------------------------------------------------------ |
-| x | number | No | Scaling multiple along the x-axis. If the value is greater than 1, the image is scaled up along the x-axis. If the value is less than 1, the image is scaled down along the x-axis.
Default value: **1**
Value range: [0, +∞)
**NOTE**
A value less than 0 evaluates to the default value.|
-| y | number | No | Scaling multiple along the y-axis. If the value is greater than 1, the image is scaled up along the y-axis. If the value is less than 1, the image is scaled down along the y-axis.
Default value: **1**
Value range: [0, +∞)
**NOTE**
A value less than 0 evaluates to the default value.|
-| z | number | No | Scaling multiple along the z-axis. If the value is greater than 1, the image is scaled up along the z-axis. If the value is less than 1, the image is scaled down along the z-axis.
Default value: **1**
Value range: [0, +∞)
**NOTE**
A value less than 0 evaluates to the default value.|
-| centerX | number | No | X coordinate of the center point.
Default value: **0**
Value range: (-∞, +∞) |
-| centerY | number | No | Y coordinate of the center point.
Default value: **0**
Value range: (-∞, +∞) |
+| Name| Type | Mandatory| Description |
+| ------ | --------------------------- | ---- | -------------- |
+| option | [ScaleOption](#scaleoption) | Yes | Scaling configuration.|
+
**Return value**
-| Type | Description |
-| -------------- | ---------------------------- |
-| Matrix4Transit | Matrix object after the scaling effect is added.|
+| Type | Description |
+| --------------------------------- | ---------------------------- |
+| [Matrix4Transit](#matrix4transit) | Matrix object after the scaling.|
**Example**
@@ -367,7 +362,7 @@ struct Test {
### rotate
-rotate({x?: number, y?: number, z?: number, angle?: number, centerX?: Length, centerY?: Length}): Matrix4Transit
+rotate(options: RotateOption): Matrix4Transit
Rotates this matrix object along the x, y, and z axes.
@@ -376,20 +371,16 @@ Rotates this matrix object along the x, y, and z axes.
**Parameters**
-| Name | Type | Mandatory| Description |
-| ------- | ------ | ---- | ------------------------------------------------------- |
-| x | number | No | X coordinate of the rotation axis vector.
Default value: **1**
Value range: (-∞, +∞)|
-| y | number | No | Y coordinate of the rotation axis vector.
Default value: **1**
Value range: (-∞, +∞)|
-| z | number | No | Z coordinate of the rotation axis vector.
Default value: **1**
Value range: (-∞, +∞)|
-| angle | number | No | Rotation angle.
Default value: **0** |
-| centerX | number | No | X coordinate of the center point.
Default value: **0** |
-| centerY | number | No | Y coordinate of the center point.
Default value: **0** |
+| Name| Type | Mandatory| Description |
+| ------ | ----------------------------- | ---- | -------------- |
+| option | [RotateOption](#rotateoption) | Yes | Rotation configuration.|
+
**Return value**
-| Type | Description |
-| -------------- | ---------------------------- |
-| Matrix4Transit | Matrix object after the rotation effect is added.|
+| Type | Description |
+| --------------------------------- | ---------------------------- |
+| [Matrix4Transit](#matrix4transit) | Matrix object after the rotation.|
**Example**
@@ -417,7 +408,7 @@ struct Test {
### transformPoint
-transformPoint(point: Point): Point
+transformPoint(options: [number, number]): [number, number]
Applies the current transformation effect to a coordinate point.
@@ -426,15 +417,15 @@ Applies the current transformation effect to a coordinate point.
**Parameters**
-| Name| Type | Mandatory| Description |
-| ------ | ----- | ---- | ------------------ |
-| point | Point | Yes | Point to be transformed.|
+| Name| Type | Mandatory| Description |
+| ------ | ---------------- | ---- | ------------------ |
+| option | [number, number] | Yes | Point to be transformed.|
**Return value**
-| Type | Description |
-| ----- | ---------------- |
-| Point | Point object after matrix transformation|
+| Type | Description |
+| ---------------- | --------------------------- |
+| [number, number] | Point object after matrix transformation|
**Example**
@@ -472,3 +463,38 @@ struct Test {
```
![en-us_image_0000001219864133](figures/en-us_image_0000001219864133.PNG)
+
+## TranslateOption
+
+**System capability**: SystemCapability.ArkUI.ArkUI.Full
+
+| Name| Type | Mandatory| Description |
+| ---- | ------ | ---- | ----------------------------------------------------------- |
+| x | number | No | Translation distance along the x-axis, in px.
Default value: **0**
Value range: (-∞, +∞)|
+| y | number | No | Translation distance along the y-axis, in px.
Default value: **0**
Value range: (-∞, +∞)|
+| z | number | No | Translation distance along the z-axis, in px.
Default value: **0**
Value range: (-∞, +∞)|
+
+## ScaleOption
+
+**System capability**: SystemCapability.ArkUI.ArkUI.Full
+
+| Name | Type | Mandatory| Description |
+| ------- | ------ | ---- | ------------------------------------------------------------ |
+| x | number | No | Scaling multiple along the x-axis. If the value is greater than 1, the image is scaled up along the x-axis. If the value is less than 1, the image is scaled down along the x-axis.
Default value: **1**
Value range: [0, +∞)
**NOTE**
A value less than 0 evaluates to the default value.|
+| y | number | No | Scaling multiple along the y-axis. If the value is greater than 1, the image is scaled up along the y-axis. If the value is less than 1, the image is scaled down along the y-axis.
Default value: **1**
Value range: [0, +∞)
**NOTE**
A value less than 0 evaluates to the default value.|
+| z | number | No | Scaling multiple along the z-axis. If the value is greater than 1, the image is scaled up along the z-axis. If the value is less than 1, the image is scaled down along the z-axis.
Default value: **1**
Value range: [0, +∞)
**NOTE**
A value less than 0 evaluates to the default value.|
+| centerX | number | No | X coordinate of the center point.
Default value: **0**
Value range: (-∞, +∞) |
+| centerY | number | No | Y coordinate of the center point.
Default value: **0**
Value range: (-∞, +∞) |
+
+## RotateOption
+
+**System capability**: SystemCapability.ArkUI.ArkUI.Full
+
+| Name | Type | Mandatory| Description |
+| ------- | ------ | ---- | ------------------------------------------------------- |
+| x | number | No | X coordinate of the rotation axis vector.
Default value: **1**
Value range: (-∞, +∞)|
+| y | number | No | Y coordinate of the rotation axis vector.
Default value: **1**
Value range: (-∞, +∞)|
+| z | number | No | Z coordinate of the rotation axis vector.
Default value: **1**
Value range: (-∞, +∞)|
+| angle | number | No | Rotation angle.
Default value: **0** |
+| centerX | number | No | X coordinate of the center point.
Default value: **0** |
+| centerY | number | No | Y coordinate of the center point.
Default value: **0** |
diff --git a/en/application-dev/reference/apis/js-apis-plugincomponent.md b/en/application-dev/reference/apis/js-apis-plugincomponent.md
index 0ae1baf6eebdadbbdc9d43de1e9c100ac73163db..8e809509f0c661ffbe40f83e0adf874ed9c32c85 100644
--- a/en/application-dev/reference/apis/js-apis-plugincomponent.md
+++ b/en/application-dev/reference/apis/js-apis-plugincomponent.md
@@ -262,7 +262,7 @@ pluginComponentManager.push(
name: "ets/pages/plugin2.js",
data: {
"js": "ets/pages/plugin.js",
- "key_1": 1111, ,
+ "key_1": 1111,
},
extraData: {
"extra_str": "this is push event"
@@ -376,7 +376,6 @@ Listens for events of the request type and returns the requested data, or listen
| eventType | string | Yes | Type of the event to listen for. The options are as follows:
**"push"**: The component provider pushes data to the component consumer.
**"request"**: The component consumer proactively requests data from the component provider.|
| callback | [OnPushEventCallback](#onpusheventcallback) \| [OnRequestEventCallback](#onrequesteventcallback) | Yes | Callback used to return the result. The type is [OnPushEventCallback](#onpusheventcallback) for the push event and [OnRequestEventCallback](#onrequesteventcallback) for the request event.|
-
**Example**
```js
diff --git a/en/application-dev/reference/apis/js-apis-router.md b/en/application-dev/reference/apis/js-apis-router.md
index bb43dd6ce3fb90534f13c8e54cb3d0225396e6df..ccdbaf8baaf24cf5910d8d3d88ac984c2b735433 100644
--- a/en/application-dev/reference/apis/js-apis-router.md
+++ b/en/application-dev/reference/apis/js-apis-router.md
@@ -671,7 +671,7 @@ struct Second {
Text(this.text)
.fontSize(30)
.onClick(() => {
- this.secondData = (this.data.['array'][1]).toString()
+ this.secondData = (this.data['array'][1]).toString()
})
.margin({ top: 20 })
Text(`This is the data passed from the first page: ${this.secondData}`)
diff --git a/en/application-dev/reference/apis/js-apis-uitest.md b/en/application-dev/reference/apis/js-apis-uitest.md
index 3b0ee56a7bef48b0bee0bcdae5c6a781d0ba2b86..13bb7707f465fb5af21a749a64eab15b7e57d1d4 100644
--- a/en/application-dev/reference/apis/js-apis-uitest.md
+++ b/en/application-dev/reference/apis/js-apis-uitest.md
@@ -8,9 +8,9 @@ This module provides the following functions:
- [Component9+](#component9): represents a component on the UI and provides APIs for obtaining component attributes, clicking a component, scrolling to search for a component, and text injection.
- [Driver9+](#driver9): works as the entry class and provides APIs for features such as component matching/search, key injection, coordinate clicking/sliding, and screenshot.
- [UiWindow9+](#uiwindow9): works as the entry class and provides APIs for obtaining window attributes, dragging windows, and adjusting window sizes.
-- [By(deprecated)](#bydeprecated): provides UI component feature description APIs for component filtering and matching. This API is deprecated since API version 9. You are advised to use [On9+](#on9) instead.
-- [UiComponent(deprecated)](#uicomponentdeprecated): represents a component on the UI and provides APIs for obtaining component attributes, clicking a component, scrolling to search for a component, and text injection. This API is deprecated since API version 9. You are advised to use [Component9+](#component9) instead.
-- [UiDriver(deprecated)](#uidriverdeprecated): works as the entry class and provides APIs for features such as component matching/search, key injection, coordinate clicking/sliding, and screenshot. This API is deprecated since API version 9. You are advised to use [Driver9+](#driver9) instead.
+- [By(deprecated)](#bydeprecated): provides UI component feature description APIs for component filtering and matching. This class is deprecated since API version 9. You are advised to use [On9+](#on9) instead.
+- [UiComponent(deprecated)](#uicomponentdeprecated): represents a component on the UI and provides APIs for obtaining component attributes, clicking a component, scrolling to search for a component, and text injection. This class is deprecated since API version 9. You are advised to use [Component9+](#component9) instead.
+- [UiDriver(deprecated)](#uidriverdeprecated): works as the entry class and provides APIs for features such as component matching/search, key injection, coordinate clicking/sliding, and screenshot. This class is deprecated since API version 9. You are advised to use [Driver9+](#driver9) instead.
>**NOTE**
>
@@ -1119,7 +1119,7 @@ For details about the error codes, see [UiTest Error Codes](../errorcodes/errorc
```js
async function demo() {
let driver = Driver.create();
- let button = await driver.findComponent(ON.type('Scroll'));
+ let scrollBar = await driver.findComponent(ON.type('Scroll'));
let button = await scrollBar.scrollSearch(ON.text('next page'));
}
```
@@ -2659,6 +2659,7 @@ async function demo() {
## By(deprecated)
The UiTest framework provides a wide range of UI component feature description APIs in the **By** class to filter and match components.
+
The API capabilities provided by the **By** class exhibit the following features:
- Allow one or more attributes as the match conditions. For example, you can specify both the **text** and **id** attributes to find the target component.
@@ -2667,7 +2668,7 @@ The API capabilities provided by the **By** class exhibit the following features
All APIs provided in the **By** class are synchronous. You are advised to use the static constructor **BY** to create a **By** object in chain mode.
-This API is deprecated since API version 9. You are advised to use [On9+](#on9) instead.
+This class is deprecated since API version 9. You are advised to use [On9+](#on9) instead.
```js
BY.text('123').type('button');
@@ -2909,7 +2910,7 @@ selected(b?: boolean): By
Specifies the selected status of the target component.
-This API is deprecated since API version 9. You are advised to use [selected9+](#selected9).
+This API is deprecated since API version 9. You are advised to use [selected9+](#selected9) instead.
**System capability**: SystemCapability.Test.UiTest
@@ -2937,7 +2938,7 @@ isBefore(by: By): By
Specifies that the target component is located before the given attribute component.
-This API is deprecated since API version 9. You are advised to use [isBefore9+](#isbefore9).
+This API is deprecated since API version 9. You are advised to use [isBefore9+](#isbefore9) instead.
**System capability**: SystemCapability.Test.UiTest
@@ -2992,7 +2993,7 @@ let by = BY.isAfter(BY.text('123')); // Use the static constructor BY to create
In **UiTest**, the **UiComponent** class represents a component on the UI and provides APIs for obtaining component attributes, clicking a component, scrolling to search for a component, and text injection.
All APIs provided in this class use a promise to return the result and must be invoked using **await**.
-This API is deprecated since API version 9. You are advised to use [Component9+](#component9) instead.
+This class is deprecated since API version 9. You are advised to use [Component9+](#component9) instead.
### click(deprecated)
@@ -3373,7 +3374,7 @@ async function demo() {
The **UiDriver** class is the main entry to the UiTest framework. It provides APIs for features such as component matching/search, key injection, coordinate clicking/sliding, and screenshot.
All APIs provided by this class, except for **UiDriver.create()**, use a promise to return the result and must be invoked using **await**.
-This API is deprecated since API version 9. You are advised to use [Driver9+](#driver9) instead.
+This class is deprecated since API version 9. You are advised to use [Driver9+](#driver9) instead.
### create(deprecated)
diff --git a/en/device-dev/device-test/figures/smartperf_frame.png b/en/device-dev/device-test/figures/smartperf_frame.png
new file mode 100644
index 0000000000000000000000000000000000000000..4cd602ed03837c570efee4dc3887272414b391e5
Binary files /dev/null and b/en/device-dev/device-test/figures/smartperf_frame.png differ
diff --git a/en/device-dev/device-test/smartperf-host.md b/en/device-dev/device-test/smartperf-host.md
new file mode 100644
index 0000000000000000000000000000000000000000..ec92a1ba4c2c5ca57957702de1e9fe9c8cb54c9c
--- /dev/null
+++ b/en/device-dev/device-test/smartperf-host.md
@@ -0,0 +1,83 @@
+# Smartperf-Host
+## Overview
+Smartperf-Host is an intuitive performance and power optimization tool that offers in-depth data mining and fine-grained data visualization. In this tool, you can gain visibility into a multitude of metrics in terms of CPU scheduling, frequency, process and thread time slices, heap memory, frame rate, and more, in swimlanes. Better yet, you can analyze the collected data intuitively on the GUI.
+## Architecture
+![System Architecture](figures/smartperf_frame.png)
+
+Smartperf-Host consists of the device end and PC end, which exchange data with each other based on gRPC – a high-performance remote procedure call (RPC) framework.
+
+The device end consists of modules such as Native Hook (application-embedded component), hiprofiler_command (command-line tool), hiprofilerd (performance profiler service), a set of performance profiler plug-ins, and some system tools and kernels. The device end provides the plug-in extension capability by exposing plug-in interfaces for external systems. By drawing on this capability, you can integrate custom plug-ins into the framework. For details about the preset plug-ins, see [Performance Profiler Component](https://gitee.com/openharmony/developtools_profiler).
+
+The PC end is accessible from the Smartperf-Host website. It consists of modules such as Trace Streamer, SQLite, HDC device management, data import, UI drawing, and data analysis.
+## Project Directory
+```
+/smartperf_host
+├── host # Smartperf-Host related code
+│ ├── doc # Smartperf-Host documentation
+│ ├── ide # Smartperf-Host IDE module
+│ │ └── src # Profiler module
+│ │ │ ├── base-ui # Basic components
+│ │ │ └── Trace # Service logic
+│ ├── trace_streamer # Trace Streamer module
+│ │ ├── base # Basic functionality
+│ │ ├── cfg # Configuration
+│ │ ├── filter # Filter
+│ │ ├── include # Header files
+│ │ ├── multi_platform # Platform adaptation
+│ │ ├── parser # Parsing service logic
+│ │ │ ├── bytrace_parser # byTrace service logic
+│ │ │ └── htrace_parser # hTrace service logic
+│ │ ├── table # Table structure
+│ │ ├── trace_data # Trace structure
+│ │ ├── trace_streamer # Trace Streamer structure
+│ │ │ └── kits # JS APIs and native APIs
+```
+## Function Description
+- Loading Trace Files on Web Pages
+
+ Load local trace files (such as htrace and ftrace) and display the data in swimlanes. For details, see [Loading Trace Files on Web Pages](https://gitee.com/openharmony-sig/developtools_smartperf_host/blob/master/ide/src/doc/md/quickstart_systemtrace.md).
+- Capturing Traces Online
+
+ Use Smartperf_Host to capture traces online, with the content, duration, and save path all customizable. For details, see [Capturing Traces on Web Pages](https://gitee.com/openharmony-sig/developtools_smartperf_host/blob/master/ide/src/doc/md/quickstart_web_record.md).
+- Capturing Traces on a Device
+
+ Capture traces on the target device, with the content, duration, and save path all customizable. For details, see [Capturing Traces from a Device](https://gitee.com/openharmony-sig/developtools_smartperf_host/blob/master/ide/src/doc/md/quickstart_device_record.md).
+- Using Ability Monitor
+
+ With Ability Monitor in Smartperf_Host, you can learn the CPU, memory, disk I/O, and network usage of your application. For details, see [Ability Monitor Usage](https://gitee.com/openharmony-sig/developtools_smartperf_host/blob/master/ide/src/doc/md/quickstart_ability_monitor.md).
+- Using Native Memory
+
+ With Native Memory in Smartperf_Host, you can track the allocation and release of your application's native memory (specific to C and C++). For details, see [Native Memory Usage](https://gitee.com/openharmony-sig/developtools_smartperf_host/blob/master/ide/src/doc/md/quickstart_native_memory.md).
+- Using Hiperf
+
+ With Hiperf in Smartperf_Host, you can view the CPU usage of your application and the call stack. For details, see [Hiperf Usage](https://gitee.com/openharmony-sig/developtools_smartperf_host/blob/master/ide/src/doc/md/quickstart_hiperf.md).
+- Using HiSystemEvent
+
+ With HiSystemEvent in Smartperf_Host, you can inspect the power consumption of each category (CPU, network, and location, and more) of your application, resource application and usage records (WorkScheduler, Runninglock, Alarm, and Location Request), power consumption exceptions, and system states associated with the power consumption (battery level and screen status). For details, see [HiSystemEvent Usage](https://gitee.com/openharmony-sig/developtools_smartperf_host/blob/master/ide/src/doc/md/quickstart_hisystemevent.md).
+- Collecting FileSystem Records
+
+ In Smartperf_Host, you can find out the system invoking information and read/write invoking times of all file systems. For details, see [Usage of FileSystem Recording](https://gitee.com/openharmony-sig/developtools_smartperf_host/blob/master/ide/src/doc/md/quickstart_filesystem.md).
+- Collecting Page Fault Records
+
+ In Smartperf_Host, you can collect page fault records, covering various aspects such as start time, duration, triggering process, triggering thread, event type, memory address, and memory size of page memory events. For details, see [Usage of Page Fault Recording](https://gitee.com/openharmony-sig/developtools_smartperf_host/blob/master/ide/src/doc/md/quickstart_page_fault.md).
+- Collecting BIO Records
+
+ In Smartperf_Host, you can collect I/O operation records, which provide the following information: start time, total latency, process, average latency of every 4 KB data, thread, operation (write data, page swap-in, and metadata), access traffic, path, block number, priority, and backtrace call stack. For details, see [Usage of BIO Latency Recording](https://gitee.com/openharmony-sig/developtools_smartperf_host/blob/master/ide/src/doc/md/quickstart_bio.md).
+- Collecting Smaps Records
+
+ In Smartperf_Host, you can collect the smaps data (type, Pss, Rss, Vss, and more) on a process-by-process basis. The data source is **/proc/$pid/smaps**. For details, see [Smaps Usage](https://gitee.com/openharmony-sig/developtools_smartperf_host/blob/master/ide/src/doc/md/quickstart_smaps.md).
+- Using SQL Analysis and Metrics
+
+ You can use Query (SQL) and Metrics features to quickly locate the trace data. For details, see [SQL Analysis and Metrics Usage](https://gitee.com/openharmony-sig/developtools_smartperf_host/blob/master/ide/src/doc/md/quickstart_sql_metrics.md).
+## Compilation Guidance
+Project compilation includes Trace Streamer compilation and Smartperf-Host compilation and deployment.
+### Prerequisites
+- C++ version: 11 or later
+- Node.js version: 16.15.1 or later
+- npm version: 8.13.2 or later
+- TypeScript version: 4.2.3 or later
+- Go version: 1.13.8 or later
+### Compiling Trace Streamer
+To set up the Smartperf_Host website, you need to compile the WASM version of Trace Streamer for the web page to parse the original trace data. For details about the compilation process, see [Compiling Trace Streamer](https://gitee.com/openharmony-sig/developtools_smartperf_host/blob/master/trace_streamer/doc/compile_trace_streamer.md).
+### Compiling and Deploying Smartperf-Host
+For details about the compilation and deployment process, see [SmartPerf Compilation and Deployment Guide](https://gitee.com/openharmony-sig/developtools_smartperf_host/blob/master/ide/README_zh.md)). After successful deployment, you can start to use Smartperf_Host by visiting **https://[*IP address of the device where SmartPerf is deployed*]:9000/application/**.