An assembly detection method, device, apparatus and storage medium

By detecting the view structure data built during application runtime, high-performance UI components that consume resources are identified, thus solving the problem of performance consumption affecting refresh rate and achieving smooth user interface and stable refresh rate.

CN114064411BActive Publication Date: 2026-05-05BEIJING BAIDU NETCOM SCI & TECH CO LTD
View PDF 1 Cites 0 Cited by

Patent Information

Authority / Receiving Office
CN · China
Patent Type
Patents(China)
Current Assignee / Owner
BEIJING BAIDU NETCOM SCI & TECH CO LTD
Filing Date
2021-11-22
Publication Date
2026-05-05

AI Technical Summary

Technical Problem

In existing technologies, UI components with high performance consumption cause the application's refresh rate to decrease, affecting the smoothness of the user interface and making it difficult to achieve the preset refresh rate.

Method used

By obtaining the view structure data built during application runtime, the performance parameters of each UI component are determined, and high-performance consuming components are detected, including type and functional parameters. High-performance consuming components are then filtered out, reducing the number of components to be detected and thus reducing performance consumption.

Benefits of technology

It improves the accuracy and efficiency of component detection, ensuring that the application can achieve a refresh rate of 60 frames per second, thus enhancing the smoothness of the user interface.

✦ Generated by Eureka AI based on patent content.

Smart Images

  • Figure CN114064411B_ABST
    Figure CN114064411B_ABST
Patent Text Reader

Abstract

This disclosure provides a component detection method, apparatus, device, and storage medium, relating to the field of computer software technology, and particularly to the field of software detection technology. The specific implementation scheme is as follows: obtaining view structure data reflecting the page layout of the user interface constructed during application execution; determining the user interface (UI) components associated with each view element in the view structure data; obtaining performance parameters for each UI component, wherein the performance parameters include type parameters and / or function parameters; and detecting high-performance consuming components in the UI components based on the obtained performance parameters, wherein the performance consumption required by the high-performance consuming components is higher than a preset performance consumption threshold. Applying the scheme provided by the embodiments of this disclosure can detect high-performance consuming UI components.
Need to check novelty before this filing date? Find Prior Art

Description

Technical Field

[0001] This disclosure relates to the field of computer software technology, and more particularly to the field of software testing technology. Background Technology

[0002] Many applications nowadays have user interfaces (UIs). To improve the smoothness of user interface operation, applications typically need to set an appropriate refresh rate for the UI. This ensures that the application re-renders the UI at intervals corresponding to this refresh rate. During this rendering process, the application loads components that provide interface layout functionality, hereinafter referred to as UI (User Interface) components. These UI components incur performance overhead. Some high-performance UI components can make the rendering process take too long, resulting in a lower refresh rate that fails to meet the set refresh rate, thus degrading the smoothness of user interface operation. To ensure the smoothness of user interface operation, it is necessary to detect high-performance UI components. Summary of the Invention

[0003] This disclosure provides a component testing method, apparatus, device, and storage medium.

[0004] According to one aspect of this disclosure, a component detection method is provided, comprising:

[0005] Obtain view structure data that reflects the page layout of the user interface as the application runs;

[0006] Determine the user interface (UI) components associated with each view element in the view structure data;

[0007] Obtain the performance parameters of each UI component, wherein the performance parameters include: type parameters and / or function parameters;

[0008] Based on the obtained performance parameters, high-performance consuming components in the UI components are detected, wherein the performance consumption required by the high-performance consuming components is higher than a preset performance consumption threshold.

[0009] According to another aspect of this disclosure, a component testing apparatus is provided, comprising:

[0010] The data acquisition module is used to acquire view structure data that reflects the page layout of the user interface and is built during the application's operation.

[0011] The component determination module is used to determine the user interface (UI) components associated with each view element in the view structure data;

[0012] A performance parameter acquisition module is used to obtain the performance parameters of each UI component, wherein the performance parameters include: type parameters and / or function parameters;

[0013] The component detection module is used to detect high-performance consuming components in the UI components based on the obtained performance parameters, wherein the performance consumption required by the high-performance consuming components is higher than a preset performance consumption threshold.

[0014] According to another aspect of this disclosure, an electronic device is provided, comprising:

[0015] At least one processor; and

[0016] A memory communicatively connected to the at least one processor; wherein,

[0017] The memory stores instructions that can be executed by the at least one processor to enable the at least one processor to perform any of the component detection methods described above.

[0018] According to another aspect of this disclosure, a non-transitory computer-readable storage medium is provided storing computer instructions, wherein the computer instructions are configured to cause the computer to perform the component detection method described in any of the preceding claims.

[0019] According to another aspect of this disclosure, a computer program product is provided, including a computer program that, when executed by a processor, implements the component detection method described in any of the preceding claims.

[0020] As can be seen from the above, when using the detection component of the solution provided in this embodiment, the view structure data used is constructed during the application's runtime. Therefore, this view structure data reflects the page layout of the user interface that actually needs to be displayed during the application's runtime. Based on this, the UI components associated with each view element in the view structure data are the UI components actually loaded when the user interface is displayed during the application's runtime. Thus, based on the performance parameters of the aforementioned UI components, not only can high-performance consuming UI components be detected, but also the UI components actually loaded during the application's runtime can be detected. Therefore, when using the detection component of the solution provided in this embodiment, the accuracy of component detection can be improved while detecting high-performance consuming components.

[0021] It should be understood that the description in this section is not intended to identify key or essential features of the embodiments of this disclosure, nor is it intended to limit the scope of this disclosure. Other features of this disclosure will become readily apparent from the following description. Attached Figure Description

[0022] The accompanying drawings are provided to better understand this solution and do not constitute a limitation of this disclosure. Wherein:

[0023] Figure 1 This is a schematic diagram of a page rendering process provided in an embodiment of this disclosure;

[0024] Figure 2a This is a schematic flowchart of the first component detection method provided in this embodiment of the disclosure;

[0025] Figure 2b This is a schematic diagram of a view structure data generation process provided in this disclosure;

[0026] Figure 3 This is a schematic flowchart of the second component detection method provided in this embodiment of the disclosure;

[0027] Figure 4 This is a flowchart illustrating the third component detection method provided in this embodiment of the disclosure;

[0028] Figure 5 This is a schematic diagram of the structure of a component detection device provided in an embodiment of this disclosure;

[0029] Figure 6 This is a block diagram of an electronic device used to implement the component detection method of the embodiments of this disclosure; Detailed Implementation

[0030] The exemplary embodiments of this disclosure are described below with reference to the accompanying drawings, including various details of the embodiments to aid understanding, and should be considered merely exemplary. Therefore, those skilled in the art will recognize that various changes and modifications can be made to the embodiments described herein without departing from the scope and spirit of this disclosure. Similarly, for clarity and brevity, descriptions of well-known functions and structures are omitted in the following description.

[0031] The following uses an application developed based on Flutter technology as an example to illustrate the application scenarios of this disclosure embodiment.

[0032] Applications developed using Flutter render the user interface content during runtime, thus displaying the user interface to the user. This user interface content can include text, images, and other information.

[0033] The application can follow Figure 1 The process shown completes the rendering of the interface content, according to... Figure 1In the order of the arrows, the steps 1-8 of the above process are as follows: building the Widget Tree, building the Element Tree, building the RenderObject Tree, layout, drawing, building the Layer Tree, rasterization, and rendering.

[0034] As can be seen from the above, the application needs to go through multiple steps to complete the rendering of one frame of user interface content. In addition, in order to improve the smoothness of user interface operation, the application needs to complete the rendering of user interface content 60 times in 1 second according to the above process, and refresh the user interface once after each rendering. Thus, the refresh rate of the user interface is 60 frames / second, and the time interval between two user interface refresh processes is approximately 16.6 milliseconds.

[0035] Applications developed using Flutter technology need to load relevant Widget components to render interface content. Therefore, to ensure that this process can be completed within the aforementioned time interval... Figure 1 The eight steps shown indicate that the application's time to load the relevant Widget components and complete the interface content rendering must not exceed the aforementioned intervals. However, some Widget components have high performance consumption, which can easily lead to a longer time for the application to load the Widget components and complete the interface content rendering process. Therefore, it is necessary to use the solution provided in this disclosure embodiment to detect Widget components with high performance consumption.

[0036] It should be noted that the applications involved in the embodiments of this disclosure are not limited to those developed based on Flutter technology, and the embodiments of this disclosure do not limit the development technology used by the applications.

[0037] The component detection method provided in this disclosure will be described in detail below through specific embodiments.

[0038] In one embodiment of this disclosure, see [link to embodiment]. Figure 2a The flowchart of the first component detection method is provided, which includes the following steps S201-S204.

[0039] Step S201: Obtain view structure data that reflects the page layout of the user interface, which is built during the application's operation.

[0040] In one embodiment of this disclosure, the application described above can be a program developed based on Flutter technology, in which case the view structure data described above is the data corresponding to the Element tree.

[0041] The process of constructing the Element tree can be referenced. Figure 2b Among them, the Element tree is Figure 2b The structure formed by Root[Element] and Child[Element] consists of two types of Element nodes. Child[Element] is defined according to... Figure 2b The mount process shown mounts an existing Element node in the Element tree. This existing Element node could be a Root[Element] or a Child[Element]. An Element tree can contain multiple Child[Elements]. Figure 2b The image shows only one Child[Element] for illustration purposes.

[0042] Element nodes in the Element tree are associated with Widget components and are formed based on the associated Widget components. Widget components are used to configure the page layout information of the user interface. For example... Figure 2b As shown, the Widget component includes two types of components: Root[Widget] and Child[Widget].

[0043] As can be seen from the above process, Widget components can configure the page layout information of the user interface, and Element nodes are generated based on the associated Widget components. Therefore, the Element tree reflects the page layout of the user interface.

[0044] An application may support multiple page layouts, but the user interfaces corresponding to these layouts may not all be displayed. For example, a page layout might include an animation component that only plays when the user clicks a specific button on the screen. If the user does not click the button, the user interface for that layout will not be displayed, and the animation component will not be loaded. Therefore, the view structure data obtained in this step is constructed during application runtime, ensuring that the obtained data reflects the actual page layouts of the user interface that the application needs to display during operation.

[0045] The following section explains how to obtain view structure data based on the application's operating model.

[0046] In one implementation, view structure data reflecting the page layout of the user interface, built when the application is running in Debug mode, can be obtained. Since the application is not yet released to users and is in the internal testing phase when running in Debug mode, obtaining view structure data in this case, even if it increases the application's performance consumption and affects the application's performance, will not affect the user's use of the application.

[0047] Specifically, a condition can be set at the application's entry point to determine whether the application is running in Debug mode. Only if this condition is met will the process of obtaining the view structure data be triggered.

[0048] In another implementation, view structure data reflecting the page layout of the user interface is obtained when the application is running in Release mode.

[0049] Step S202: Determine the user interface (UI) components associated with each view element in the view structure data.

[0050] The view elements described above can be understood as the smallest units that constitute the view structure data. This view structure data can take different forms; for example, it can be a tree structure, in which case the view elements are nodes within the tree structure data, such as the root node or a leaf node.

[0051] UI components are components used to configure user interface layout information and determine user interface content.

[0052] In one implementation, when the application is developed using Flutter technology, in addition to the view structure data being the data corresponding to the Element tree, the UI components are Widget components. Thus, when using the solution provided in this embodiment for component detection, it is possible to detect which Widget components in the Flutter-based application are high-performance, resource-intensive components.

[0053] In one embodiment of this disclosure, the attributes of a view element can be set with an identifier for an associated UI component, so that the UI component associated with the view element can be determined based on the view element's attributes. Additionally, the attributes of the view element can also set other information such as the size of the associated UI component.

[0054] Other implementation methods for UI components can be found in the following sections. Figure 4 The illustrated embodiment will not be described in detail here.

[0055] Step S203: Obtain the performance parameters of each UI component.

[0056] The aforementioned performance parameters include: type parameters and / or function parameters.

[0057] The type parameters described above represent the type of the UI component, such as button type, pop-up type, etc. Since different types of UI components consume different amounts of performance when loaded, these type parameters reflect the performance required by the application when loading UI components.

[0058] The aforementioned functional parameters characterize the functions that a UI component can perform, such as clipping and hiding. Since different applications consume varying amounts of performance when implementing the functions of UI components, these functional parameters reflect the performance requirements of the application in implementing these functions.

[0059] Specifically, it can detect whether the above-mentioned type parameters and function parameters are recorded in the properties of each UI component. If they are recorded, the above-mentioned type parameters and function parameters are read from the properties of each UI component.

[0060] Step S204: Based on the obtained performance parameters, detect high-performance consumption components in the UI components.

[0061] Among them, the performance consumption required by the aforementioned high-performance consumption components is higher than the preset performance consumption threshold.

[0062] The performance consumption of UI components can be measured based on different metrics. For example, the metrics mentioned above could be loading time, completion time, computational resource consumption, etc. In this case, the performance consumption thresholds mentioned above would also be time, resource consumption, etc.

[0063] Specifically, the aforementioned performance consumption threshold can be the time interval between two user interface refreshes. Of course, the aforementioned performance consumption threshold can also be a value greater than or less than the aforementioned time interval. For example, if the aforementioned time interval is 16.6ms, the aforementioned performance consumption threshold can be 10ms, 18ms, etc., and this embodiment of the disclosure does not limit this.

[0064] For example, if the user interface refresh rate is 60 frames per second, the time interval between two user interface refreshes is 16.6ms. If a UI component takes 20ms to load, then obviously 20ms is greater than 16.6ms, and the above UI component can be considered a high-performance, high-consumption component.

[0065] For details on how to detect high-performance, resource-intensive components in a UI, please refer to the following: Figure 3 Steps S304-S305 in the illustrated embodiment will not be described in detail here.

[0066] As can be seen from the above, when using the detection component of the solution provided in this embodiment, the view structure data used is constructed during the application's runtime. Therefore, this view structure data reflects the page layout of the user interface that actually needs to be displayed during the application's runtime. Based on this, the UI components associated with each view element in the view structure data are the UI components actually loaded when the user interface is displayed during the application's runtime. Thus, based on the performance parameters of the aforementioned UI components, not only can high-performance consuming UI components be detected, but also the UI components actually loaded during the application's runtime can be detected. Therefore, when using the detection component of the solution provided in this embodiment, the accuracy of component detection can be improved while detecting high-performance consuming components.

[0067] The following is through Figure 3 The embodiment shown illustrates the specific implementation of detecting high-performance consumption components in step S204 above.

[0068] In one embodiment of this disclosure, see [link to embodiment]. Figure 3 The flowchart of the second component detection method is provided, which includes steps S301-S305.

[0069] Step S301: Obtain view structure data that reflects the page layout of the user interface, which is built during the application's operation.

[0070] Step S302: Determine the UI components associated with each view element in the view structure data.

[0071] Step S303: Obtain the performance parameters of each UI component.

[0072] The steps S301-S303 described above are the same as the steps S201-S203 described above, and will not be described in detail here.

[0073] Step S304: When the performance parameters include type parameters, detect the UI components whose type parameters represent a preset type and use them as high-performance consumption components.

[0074] In one implementation, the type parameters of each UI component can be compared with the type values ​​corresponding to the preset types. If the type parameters of the UI component are the same as the type values ​​corresponding to the preset types, then the UI component is considered to be a high-performance consumable component.

[0075] Step S305: When the performance parameters include functional parameters, detect the components in the UI components whose functional parameters represent preset functions, and use them as high-performance consumption components.

[0076] The above functional parameters can be expressed in different forms, which will be explained in two cases below.

[0077] In one case, the above functional parameters can be represented by strings. For example, using the string "Clip" as a functional parameter can indicate that the UI component has a clipping function.

[0078] In this case, the functional parameters of each UI component can be matched with the strings corresponding to the preset functions. If the match is successful, the UI component is considered to be a high-performance, high-consumption component.

[0079] For example, in applications developed using Flutter technology, accessing the off-screen buffer can be time-consuming. Therefore, this function can be set as a default function, with the corresponding string being "antiAliasWithSaveLayer". Suppose a UI component with clipping functionality has the parameter "clip.antiAliasWithSaveLayer". Clearly, the UI component's parameter contains the string corresponding to the aforementioned default function. If the match is successful, then this UI component can be considered a high-performance, resource-intensive component.

[0080] In another case, the above-mentioned functional parameters can be represented by time parameters. Specifically, the above-mentioned time parameters can be set according to the average time consumed when the function corresponding to the above-mentioned functional parameters is used.

[0081] As can be seen from the above, the solution provided in this embodiment uses different methods to detect UI components according to the specific content of the performance parameters, which further improves the accuracy of detecting high-performance consumption components.

[0082] In addition to the implementation method for detecting high-performance consuming components mentioned in step S304 above, in one embodiment of this disclosure, when the performance parameters include type parameters, parameter values ​​can also be set for various types of UI components according to their performance consumption. For example, the higher the performance consumption, the higher the parameter value. In this case, the type parameters of each UI component can be compared with the parameter values ​​corresponding to the preset types, and UI components whose type parameters are greater than the parameter values ​​corresponding to the preset types can be identified as high-performance consuming components.

[0083] The specific method for determining UI components in step S202 described above is explained below.

[0084] In one embodiment of this disclosure, see [link to embodiment]. Figure 4 The flowchart of the third component detection method is provided. The method includes the following steps S401-406.

[0085] Step S401: Obtain view structure data that reflects the page layout of the user interface, which is built during the application's operation.

[0086] Step S401 is the same as step S201 described above, and will not be described in detail here.

[0087] S402: Determine all UI components associated with each view element in the view structure data.

[0088] Specifically, you can identify all UI components associated with each view element by querying the UI component identifiers set in the view element's properties.

[0089] S403: Obtain the import method for each UI component.

[0090] Specifically, the above-mentioned import methods can be divided into two categories: system import methods and developer import methods. System import methods refer to the application automatically importing UI components during the page rendering process, while developer import methods refer to the application developers importing UI components through code written in the application.

[0091] When the above-mentioned import method is obtained, the target identifier representing the import method in the properties of the UI component can be matched with the identifier of the system import method and the identifier of the developer import method. If the target identifier matches the identifier of the system import method, the UI component's import method is the system import method; if the target identifier matches the identifier of the developer import method, the UI component's import method is the developer import method.

[0092] S404: Based on the obtained import method, filter from all UI components those UI components imported by code written by the application's developers.

[0093] In other words, select UI components from all UI components that are imported using the developer's import method.

[0094] Step S405: Obtain the performance parameters of each UI component.

[0095] Step S406: Based on the obtained performance parameters, detect high-performance resource-consuming components in the UI components.

[0096] The steps S405-S406 described above are the same as the steps S203-S204 described above, and will not be described in detail here.

[0097] Detecting UI components also incurs performance overhead, and the more UI components detected, the greater the performance overhead. The solution provided in this embodiment filters the UI components to be detected based on their introduction method, reducing the final number of UI components detected and thus mitigating the impact of UI component detection on application operation.

[0098] In one embodiment of this disclosure, different performance consumption patterns of UI components have different impacts on application operation. For example, the impact might include user interface lag or unresponsiveness. In view of this, after detecting high-performance consuming components in the UI components based on the obtained performance parameters in step S204, the severity of the impact of the detected component's performance consumption on application operation can be obtained. This provides reference information for application developers, allowing them to prioritize resolving UI component performance consumption issues based on the severity level, thereby improving the efficiency of resolving component performance consumption problems.

[0099] The following explains how severity is expressed.

[0100] In one embodiment of this disclosure, different degrees of severity pose different risks to the application; therefore, severity can be expressed as a risk level. For example, a higher severity corresponds to a higher risk level, and vice versa.

[0101] The risk levels mentioned above can be represented by positive integers, such as risk levels 1, 2, 3, etc., with higher numbers indicating higher risk levels. The risk levels can also be represented by letters, such as risk levels A, B, C, etc., with letters closer to the end of the alphabet indicating higher risk levels. Finally, the risk levels can be represented by words, such as high, medium, low, etc.

[0102] For example, UI components that cause brief stuttering in the user interface are classified as low-risk, while UI components that cause the user interface to become unresponsive are classified as high-risk.

[0103] In another embodiment of this disclosure, the severity level can be expressed in words, such as "serious", "moderate", "minor", or "the page corresponding to the URL tag is loaded via HTTPS, but an insecure image was requested", etc.

[0104] The storage format for severity levels is explained below.

[0105] In one embodiment of this disclosure, each UI component and its corresponding severity level can be stored in a preset database. Thus, after detecting a UI component that consumes high performance, the severity level of the detected UI component can be obtained by querying the aforementioned database.

[0106] In another embodiment of this disclosure, each UI component and its corresponding severity level can be stored in a local file.

[0107] In one embodiment of this disclosure, after detecting high-performance consuming components in the UI components based on the obtained performance parameters in step S204, the cause of high performance consumption of the detected components can be determined, and a solution to reduce the performance consumption of the detected components can be obtained based on the determined cause.

[0108] One possible solution is to replace the detected components with UI components that can achieve the same function but have lower performance consumption, or to provide information prompting developers to adjust the functionality of the detected components, such as prompting developers to delete high-performance functions in the detected components.

[0109] In one embodiment of this disclosure, a cause record table can be pre-generated to record the reasons for high performance consumption of each UI component. When determining the cause of high performance consumption in a detected component, the cause record table can be queried to obtain the reason for the high performance consumption. This cause record table can be generated based on development documentation or by developers based on their own development experience.

[0110] In one embodiment of this disclosure, developers can also pre-define solutions corresponding to various different causes. Based on this, after determining the above causes, by querying the correspondence between the above causes and solutions, solutions to reduce the performance consumption of the detected components can be obtained.

[0111] As can be seen from the above, the solution provided in this embodiment determines the cause of the high performance consumption of the detected component, and obtains a solution to reduce the performance consumption of the detected component based on the determined cause. This enables the solution to accurately target the UI component with high performance consumption, thereby improving the effectiveness of solving the component performance consumption problem.

[0112] Corresponding to the component detection method described above, this disclosure also provides a component detection device.

[0113] In one embodiment of this disclosure, see [link to embodiment]. Figure 5 A schematic diagram of a component detection device is provided, the device comprising:

[0114] The data acquisition module 501 is used to acquire view structure data that reflects the page layout of the user interface and is built during the operation of the application.

[0115] The component determination module 502 is used to determine the user interface (UI) components associated with each view element in the view structure data;

[0116] The performance parameter acquisition module 503 is used to obtain the performance parameters of each UI component, wherein the performance parameters include: type parameters and / or function parameters;

[0117] The component detection module 504 is used to detect high-performance consuming components in the UI components based on the obtained performance parameters, wherein the performance consumption required by the high-performance consuming components is higher than a preset performance consumption threshold.

[0118] As can be seen from the above, when using the detection component of the solution provided in this embodiment, the view structure data used is constructed during the application's runtime. Therefore, this view structure data reflects the page layout of the user interface that actually needs to be displayed during the application's runtime. Based on this, the UI components associated with each view element in the view structure data are the UI components actually loaded when the user interface is displayed during the application's runtime. Thus, based on the performance parameters of the aforementioned UI components, not only can high-performance consuming UI components be detected, but also the UI components actually loaded during the application's runtime can be detected. Therefore, when using the detection component of the solution provided in this embodiment, the accuracy of component detection can be improved while detecting high-performance consuming components.

[0119] In one embodiment of this disclosure, the component detection module 504 is specifically used for:

[0120] When the performance parameters include the type parameters, components in the UI components whose type parameters represent a preset type are detected as high-performance consumption components; when the performance parameters include the function parameters, components in the UI components whose function parameters represent a preset function are detected as high-performance consumption components.

[0121] As can be seen from the above, the solution provided in this embodiment uses different methods to detect UI components according to the specific content of the performance parameters, which further improves the accuracy of detecting high-performance consumption components.

[0122] In one embodiment of this disclosure, the component determination module 502 is specifically used for:

[0123] Identify all UI components associated with each view element in the view structure data; obtain the import method of each UI component; based on the obtained import method, filter from all UI components the UI components imported by code written by the application's developer.

[0124] Detecting UI components also incurs performance overhead, and the more UI components detected, the greater the performance overhead. The solution provided in this embodiment filters the UI components to be detected based on their introduction method, reducing the final number of UI components detected and thus mitigating the impact of UI component detection on application operation.

[0125] In one embodiment of this disclosure, the data acquisition module 501 is specifically used for:

[0126] Obtain view structure data that reflects the page layout of the user interface, built when the application is running in debug mode.

[0127] Since the application is running in Debug mode and has not yet been released to users, it is in the internal testing phase. In this case, obtaining view structure data will increase the application's performance consumption and affect the application's performance, but it will not affect the user's use of the application.

[0128] In one embodiment of this disclosure, the application is a program developed based on Flutter technology; the view structure data is the data corresponding to the Element tree; and the UI component is a Widget component.

[0129] When using the solution provided in this embodiment of the present disclosure for component detection, it is possible to detect which Widget components in an application developed based on Flutter technology are high-performance components.

[0130] In one embodiment of this disclosure, the apparatus further includes:

[0131] The severity acquisition module is used to obtain the severity of the impact of the performance consumption of the detected components on the operation of the application after the component detection module 504 detects high-performance consumption components in the UI components.

[0132] This provides reference information for application developers, allowing them to prioritize the resolution of UI component performance consumption issues based on the severity of the issues mentioned above, thereby improving the efficiency of resolving component performance consumption problems.

[0133] In one embodiment of this disclosure, the apparatus further includes:

[0134] The solution acquisition module is used to determine the cause of high performance consumption of the detected components after the component detection module 504 detects high-performance consumption components in the UI components; and to obtain a solution to reduce the performance consumption of the detected components based on the determined cause.

[0135] As can be seen from the above, the solution provided in this embodiment determines the cause of the high performance consumption of the detected component, and obtains a solution to reduce the performance consumption of the detected component based on the determined cause. This enables the solution to accurately target the UI component with high performance consumption, thereby improving the effectiveness of solving the component performance consumption problem.

[0136] According to embodiments of this disclosure, this disclosure also provides an electronic device, a readable storage medium, and a computer program product.

[0137] In one embodiment of this disclosure, an electronic device is provided, comprising:

[0138] At least one processor; and

[0139] A memory communicatively connected to the at least one processor; wherein,

[0140] The memory stores instructions that can be executed by the at least one processor, which, when executed by the at least one processor, enables the at least one processor to perform the component detection method described in the foregoing method embodiments.

[0141] In one embodiment of this disclosure, a non-transitory computer-readable storage medium storing computer instructions is provided, wherein the computer instructions are used to cause the computer to perform the component detection method described in the foregoing method embodiments.

[0142] In one embodiment of this disclosure, a computer program product is provided, including a computer program that, when executed by a processor, implements the component detection method described in the foregoing method embodiments.

[0143] Figure 6 A schematic block diagram of an example electronic device 600 that can be used to implement embodiments of the present disclosure is shown. The electronic device is intended to represent various forms of digital computers, such as laptop computers, desktop computers, workstations, personal digital assistants, servers, blade servers, mainframe computers, and other suitable computers. The electronic device may also represent various forms of mobile devices, such as personal digital processors, cellular phones, smartphones, wearable devices, and other similar computing devices. The components shown herein, their connections and relationships, and their functions are merely illustrative and are not intended to limit the implementation of the present disclosure described and / or claimed herein.

[0144] like Figure 6As shown, device 600 includes a computing unit 601, which can perform various appropriate actions and processes based on a computer program stored in read-only memory (ROM) 602 or a computer program loaded from storage unit 608 into random access memory (RAM) 603. RAM 603 may also store various programs and data required for the operation of device 600. The computing unit 601, ROM 602, and RAM 603 are interconnected via bus 604. Input / output (I / O) interface 605 is also connected to bus 604.

[0145] Multiple components in device 600 are connected to I / O interface 605, including: input unit 606, such as keyboard, mouse, etc.; output unit 607, such as various types of monitors, speakers, etc.; storage unit 608, such as disk, optical disk, etc.; and communication unit 609, such as network card, modem, wireless transceiver, etc. Communication unit 609 allows device 600 to exchange information / data with other devices through computer networks such as the Internet and / or various telecommunications networks.

[0146] The computing unit 601 can be a variety of general-purpose and / or special-purpose processing components with processing and computing capabilities. Some examples of the computing unit 601 include, but are not limited to, a central processing unit (CPU), a graphics processing unit (GPU), various special-purpose artificial intelligence (AI) computing chips, various computing units running machine learning model algorithms, a digital signal processor (DSP), and any suitable processor, controller, microcontroller, etc. The computing unit 601 performs the various methods and processes described above, such as method component detection. For example, in some embodiments, method component detection may be implemented as a computer software program tangibly contained in a machine-readable medium, such as storage unit 608. In some embodiments, part or all of the computer program may be loaded and / or installed on device 600 via ROM 602 and / or communication unit 609. When the computer program is loaded into RAM 603 and executed by the computing unit 601, one or more steps of the method component detection described above may be performed. Alternatively, in other embodiments, the computing unit 601 may be configured to perform method component detection by any other suitable means (e.g., by means of firmware).

[0147] Various embodiments of the systems and techniques described above herein can be implemented in digital electronic circuit systems, integrated circuit systems, field-programmable gate arrays (FPGAs), application-specific integrated circuits (ASICs), application-specific standard products (ASSPs), systems-on-a-chip (SoCs), complex programmable logic devices (CPLDs), computer hardware, firmware, software, and / or combinations thereof. These various embodiments may include implementations in one or more computer programs that can be executed and / or interpreted on a programmable system including at least one programmable processor, which may be a dedicated or general-purpose programmable processor, capable of receiving data and instructions from a storage system, at least one input device, and at least one output device, and transmitting data and instructions to the storage system, the at least one input device, and the at least one output device.

[0148] The program code used to implement the methods of this disclosure may be written in any combination of one or more programming languages. This program code may be provided to a processor or controller of a general-purpose computer, special-purpose computer, or other programmable data processing apparatus, such that when executed by the processor or controller, the program code causes the functions / operations specified in the flowcharts and / or block diagrams to be implemented. The program code may be executed entirely on a machine, partially on a machine, as a standalone software package partially on a machine and partially on a remote machine, or entirely on a remote machine or server.

[0149] In the context of this disclosure, a machine-readable medium can be a tangible medium that may contain or store a program for use by or in conjunction with an instruction execution system, apparatus, or device. A machine-readable medium can be a machine-readable signal medium or a machine-readable storage medium. A machine-readable medium can be, but is not limited to, electronic, magnetic, optical, electromagnetic, infrared, or semiconductor systems, apparatus, or devices, or any suitable combination of the foregoing. More specific examples of machine-readable storage media include electrical connections based on one or more wires, portable computer disks, hard disks, random access memory (RAM), read-only memory (ROM), erasable programmable read-only memory (EPROM or flash memory), optical fiber, portable compact disk read-only memory (CD-ROM), optical storage devices, magnetic storage devices, or any suitable combination of the foregoing.

[0150] To provide interaction with a user, the systems and techniques described herein can be implemented on a computer having: a display device for displaying information to the user (e.g., a CRT (cathode ray tube) or LCD (liquid crystal display) monitor); and a keyboard and pointing device (e.g., a mouse or trackball) through which the user provides input to the computer. Other types of devices can also be used to provide interaction with the user; for example, feedback provided to the user can be any form of sensory feedback (e.g., visual feedback, auditory feedback, or tactile feedback); and input from the user can be received in any form (including sound input, voice input, or tactile input).

[0151] The systems and technologies described herein can be implemented in computing systems that include backend components (e.g., as a data server), or computing systems that include middleware components (e.g., an application server), or computing systems that include frontend components (e.g., a user computer with a graphical user interface or web browser through which a user can interact with embodiments of the systems and technologies described herein), or any combination of such backend, middleware, or frontend components. The components of the system can be interconnected via digital data communication of any form or medium (e.g., a communication network). Examples of communication networks include local area networks (LANs), wide area networks (WANs), and the Internet.

[0152] Computer systems can include clients and servers. Clients and servers are generally located far apart and typically interact via communication networks. Client-server relationships are created by computer programs running on the respective computers and having a client-server relationship with each other. Servers can be cloud servers, servers in distributed systems, or servers incorporating blockchain technology.

[0153] It should be understood that the various forms of processes shown above can be used to rearrange, add, or delete steps. For example, the steps described in this disclosure can be executed in parallel, sequentially, or in different orders, as long as the desired result of the technical solution disclosed in this disclosure can be achieved, and this is not limited herein.

[0154] The specific embodiments described above do not constitute a limitation on the scope of protection of this disclosure. Those skilled in the art should understand that various modifications, combinations, sub-combinations, and substitutions can be made according to design requirements and other factors. Any modifications, equivalent substitutions, and improvements made within the spirit and principles of this disclosure should be included within the scope of protection of this disclosure.

Claims

1. A component detection method, comprising: Obtain view structure data that reflects the page layout of the user interface as the application runs; Identify all UI components associated with each view element in the view structure data; The target identifier representing the import method in the properties of the UI component is matched with the identifier of the system import method and the identifier of the developer import method. If the target identifier matches the identifier of the system import method, the UI component is determined to be imported by the system import method. If the target identifier matches the identifier of the developer import method, the UI component is determined to be imported by the developer import method. The import method is divided into two categories: system import method and developer import method. The system import method refers to the application automatically importing the UI component during the page rendering process. The developer import method refers to the application developer importing the UI component by writing code. Based on the obtained introduction method, select UI components from all UI components that are introduced by code written by the developers of the application; Obtain the performance parameters of each UI component, wherein the performance parameters include: type parameters and / or function parameters; When the performance parameters include the type parameters, the type parameters of each UI component are compared with the type values ​​corresponding to the preset type. If the type parameters of the UI component are the same as the type values ​​corresponding to the preset type, the UI component is determined to be a high-performance consumption component, wherein the performance consumption required by the high-performance consumption component is higher than the preset performance consumption threshold. The functional parameters are represented by strings. When the performance parameters include the functional parameters and the functional parameters are represented by strings, the functional parameters of each UI component are matched with the strings corresponding to the preset functions. If the match is successful, the UI component is determined to be a high-performance consumption component.

2. The method according to claim 1, wherein, The acquisition of view structure data reflecting the page layout of the user interface, constructed during application runtime, includes: Obtain view structure data that reflects the page layout of the user interface, built when the application is running in debug mode.

3. The method according to any one of claims 1-2, wherein, The application is a program developed based on Flutter technology; The view structure data is the data corresponding to the Element tree; The UI component is a Widget component.

4. The method according to any one of claims 1-2, wherein, After detecting high-performance resource-consuming components in the UI components based on the obtained performance parameters, the method further includes: The severity of the impact of the performance consumption of the detected components on the operation of the application is obtained.

5. The method according to any one of claims 1-2, wherein, After detecting high-performance resource-consuming components in the UI components based on the obtained performance parameters, the method further includes: Determine the cause of the high performance consumption of the detected components; Based on the identified causes, a solution is obtained to reduce the performance consumption of the detected components.

6. A component testing device, comprising: The data acquisition module is used to acquire view structure data that reflects the page layout of the user interface and is built during the application's operation. The component determination module is used to determine all UI components associated with each view element in the view structure data; it matches the target identifier representing the import method in the attributes of the UI component with the identifier of the system import method and the identifier of the developer import method. If the target identifier matches the identifier of the system import method, the UI component is determined to be imported using the system import method; if the target identifier matches the identifier of the developer import method, the UI component is determined to be imported using the developer import method. The import methods are divided into two categories: system import method and developer import method. The system import method refers to the application automatically importing the UI component during the page rendering process, and the developer import method refers to the application developer importing the UI component using code written by the application developer. Based on the obtained import methods, the module selects UI components imported by code written by the application developer from all UI components. A performance parameter acquisition module is used to obtain the performance parameters of each UI component, wherein the performance parameters include: type parameters and / or function parameters; The component detection module is specifically used for: When the performance parameters include the type parameters, the type parameters of each UI component are compared with the type values ​​corresponding to the preset type. If the type parameters of the UI component are the same as the type values ​​corresponding to the preset type, the UI component is determined to be a high-performance consumption component, wherein the performance consumption required by the high-performance consumption component is higher than the preset performance consumption threshold. The functional parameters are represented by strings. When the performance parameters include the functional parameters and the functional parameters are represented by strings, the functional parameters of each UI component are matched with the strings corresponding to the preset functions. If the match is successful, the UI component is determined to be a high-performance consumption component.

7. The apparatus according to claim 6, wherein, The data acquisition module is specifically used to acquire view structure data reflecting the page layout of the user interface, which is constructed when the application is running in debug mode.

8. The apparatus according to any one of claims 6-7, wherein, The application is a program developed based on Flutter technology; The view structure data is the data corresponding to the Element tree; The UI component is a Widget component.

9. The apparatus according to any one of claims 6-7, wherein, The device further includes: The severity acquisition module is used to obtain the severity of the impact of the performance consumption of the detected components on the operation of the application after the component detection module detects high-performance consuming components in the UI components.

10. The apparatus according to any one of claims 6-7, wherein, The device further includes: The solution acquisition module is used to determine the cause of high performance consumption of the detected components after the component detection module detects high-performance consumption components in the UI components; and to obtain a solution to reduce the performance consumption of the detected components based on the determined cause.

11. An electronic device, comprising: At least one processor; as well as A memory communicatively connected to the at least one processor; wherein, The memory stores instructions that can be executed by the at least one processor to enable the at least one processor to perform the method of any one of claims 1-5.

12. A non-transitory computer-readable storage medium storing computer instructions, wherein, The computer instructions are used to cause the computer to perform the method according to any one of claims 1-5.

13. A computer program product comprising a computer program that, when executed by a processor, implements the method according to any one of claims 1-5.

Citation Information

Patent Citations

  • Page monitoring method and device, terminal and readable storage medium

    CN110032493A