Component memory leak detection method and device, computer equipment and storage medium

Abstract

The invention relates to a component memory leak detection method and device, computer equipment and a storage medium. The method comprises the following steps: when a component creation event of a to-be-detected component is detected, generating a first heap snapshot corresponding to the component creation event of the to-be-detected component, and when a component destruction event of the to-be-detected component is detected, generating a second heap snapshot corresponding to the component destruction event of the to-be-detected component; analyzing the first heap snapshot and the second heap snapshot, and determining target structured data; component instance nodes are determined, and an information mapping table between node unique identifiers and node information of the component instance nodes is constructed; determining candidate memory leak components according to the information mapping table; and determining a target memory leak component from the candidate memory leak components according to the component-created document object model and the component-destroyed document object model of the candidate memory leak components. And the identification precision of the component memory leak scene is improved.

Description

Technical Field

[0001] This application relates to the field of memory leak detection technology, and in particular to a method, apparatus, computer device, and storage medium for detecting component memory leaks. Background Technology

[0002] As the complexity and scale of front-end applications continue to increase, single-page applications (SPAs) based on the Vue.js 2 framework have become widely used in internet application development due to their advantages such as high reusability and low coupling inherent in component-based development. Vue.js 2 is a front-end JavaScript framework used to build user interfaces and single-page applications. However, during the frequent creation and destruction of Vue.js 2 components, memory leaks can easily occur due to improper framework feature adaptation and code logic oversights. This can lead to slow page response, lag, and even browser crashes, significantly reducing user experience and application stability. Therefore, timely memory leak detection of Vue.js 2 components is necessary. Existing memory leak detection tools rely on manual processes for memory snapshot collection and comparative analysis, and cannot establish a direct link between the Vue.js 2 component lifecycle and memory objects, making it difficult to locate leaking components and leak sources, resulting in low detection efficiency. The reactive system and component communication mechanism unique to the Vue.js 2 framework are prone to causing hidden memory leaks, which existing memory leak detection tools struggle to detect. Existing detection methods require developers to manually simulate user interactions and compare memory snapshots from different operation nodes to determine if leaks exist. This is not only time-consuming and labor-intensive, but also prone to inaccurate results due to non-standard operating procedures or omissions of key detection steps. Therefore, improving the accuracy of identifying component memory leak scenarios and enhancing the automation of component memory leak detection are problems that need to be addressed. Summary of the Invention

[0003] Therefore, it is necessary to provide a component memory leak detection method, apparatus, computer equipment, and storage medium that can improve the accuracy of identifying component memory leak scenarios and enhance the degree of automated detection of component memory leaks, in order to address the aforementioned technical problems.

[0004] Firstly, this application provides a method for detecting component memory leaks, the method comprising:

[0005] When a component creation event of the component to be detected is detected, a first set of snapshots corresponding to the component creation event of the component to be detected is generated; when a component destruction event of the component to be detected is detected, a second set of snapshots corresponding to the component destruction event of the component to be detected is generated.

[0006] Based on the structured operation logs, the first and second snapshots are parsed to determine the target structured data; the target structured data includes the first structured data corresponding to the first snapshot and the second structured data corresponding to the second snapshot.

[0007] Based on preset node filtering conditions, the array of memory object nodes in the target structured data is filtered to determine component instance nodes, and an information mapping table between the unique identifier of the component instance node and the node information is constructed; the information mapping table includes a mapping table after the component is created corresponding to the first structured data and a mapping table after the component is destroyed corresponding to the second structured data;

[0008] Based on the information mapping table, candidate memory leak components are identified;

[0009] Based on the document object model after component creation and the document object model after component destruction of the candidate memory leak components, the target memory leak component is determined from the candidate memory leak components.

[0010] In one embodiment, the above-described component memory leak detection method further includes:

[0011] Based on the target detection environment, a target identifier generation algorithm is determined from the candidate identifier generation algorithms, and a unique identifier for the component is generated according to the target identifier generation algorithm; the candidate identifier generation algorithms include: timestamp and random string algorithm, hash digest algorithm and universal unique identification code algorithm based on random numbers;

[0012] The structured operation log is determined based on the sequence of historical interaction events generated after the user's basic operation scenario and the component creation and destruction events that trigger the sample component.

[0013] In one embodiment, based on the structured operation log, the first and second stack snapshots are parsed to determine the target structured data, including:

[0014] Based on a preset memory acquisition frequency, the used heap memory of the component under test is acquired, and a memory change curve is generated according to the used heap memory and the acquisition timestamp corresponding to the used heap memory.

[0015] If the decrease in the memory change curve is less than a preset decrease threshold, the first heap snapshot and the second heap snapshot are parsed based on the structured operation log to determine the target structured data; the target structured data includes the first structured data corresponding to the first heap snapshot and the second structured data corresponding to the second heap snapshot.

[0016] In one embodiment, the above-described component memory leak detection method further includes:

[0017] Construct a memory reference graph based on the target object nodes and object edges corresponding to the target memory leak component;

[0018] Based on the target object node corresponding to the target memory leak component, perform a reverse breadth-first search to determine the node reference chain of the target object node of the target memory leak component;

[0019] Perform path compression on the node reference chain to determine the compression path;

[0020] The root cause node of the memory leak is determined from the compressed path, and the root cause information of the memory leak is determined based on the root cause node of the memory leak; the root cause information of the memory leak includes the path identifier of the compressed path, the node type of the root cause node of the memory leak, and the component context of the target memory leak component;

[0021] Based on the memory leak root cause information, the target memory leak mode is determined from a pre-built leak mode knowledge base; the leak mode knowledge base stores candidate memory leak types and root cause information feature vectors corresponding to the candidate memory leak types.

[0022] In one embodiment, path compression is performed on the node reference chain, and the compression path is determined, including:

[0023] Based on the path function of each link path in the node reference chain, determine the critical path from the link path, and determine the critical node in the critical path;

[0024] Based on the memory usage of the key nodes, intermediate nodes are determined from the key nodes;

[0025] Based on the intermediate nodes, the critical path is compressed to determine the compressed path.

[0026] In one embodiment, determining the target memory leak component from the candidate memory leak components based on the component creation document object model and the component destruction document object model of the candidate memory leak components includes:

[0027] Before the destruction event of the candidate memory leak component is triggered, the document object model structure traversal logic is executed to record the first model structure information of the document object model after the component is created; the first model structure information includes the tag name, attribute key-value pairs, child element list and element path of the document object model after the component is created before the destruction event is triggered.

[0028] After the destruction event of the candidate memory leak component is triggered, the document object model structure traversal logic is executed to record the second model structure information of the document object model after the component is destroyed; the second model structure information includes the tag name, attribute key-value pairs, child element list and element path of the document object model after the component is destroyed after the destruction event is triggered.

[0029] A tree-structured difference comparison algorithm is used to determine model structure difference information based on the first model structure information and the second model structure information; the model structure difference information includes: node addition information, node deletion information, node attribute change information, and child node change information;

[0030] Based on the model structure difference information, the target memory leak component is determined from the candidate memory leak components.

[0031] In one embodiment, the above-described component memory leak detection method further includes:

[0032] Collect target detection data during the component memory leak detection process; the target detection data includes detection metadata, leaked component data, memory monitoring data, memory leak analysis data, pattern matching data, and flame graph data of node reference chains;

[0033] A visualization report is constructed based on the target detection data; the visualization report includes a memory leak risk summary dashboard, a view of the correlation between leaked components and memory timing, and a visualization of the root cause reference chain of memory leaks; the memory leak risk summary dashboard includes global statistical indicator cards, a detection overview list, and a risk level distribution chart;

[0034] Based on the component description document of the target memory leak component and the target memory leak pattern, component repair suggestions for the target memory leak component are generated.

[0035] Secondly, this application also provides a component memory leak detection device, the device comprising:

[0036] The heap snapshot generation module is used to generate a first heap snapshot corresponding to the component creation event of the component to be detected when the component creation event of the component to be detected is detected, and to generate a second heap snapshot corresponding to the component destruction event of the component to be detected when the component destruction event of the component to be detected is detected.

[0037] The structured data determination module is used to parse the first pile snapshot and the second pile snapshot based on the structured operation log to determine the target structured data; the target structured data includes the first structured data corresponding to the first pile snapshot and the second structured data corresponding to the second pile snapshot;

[0038] The information mapping table determination module is used to filter the array of memory object nodes in the target structured data according to preset node filtering conditions, determine the component instance nodes, and construct an information mapping table between the unique identifier of the component instance node and the node information; the information mapping table includes a mapping table after the component is created corresponding to the first structured data and a mapping table after the component is destroyed corresponding to the second structured data.

[0039] The candidate component determination module is used to determine candidate memory leak components based on the information mapping table.

[0040] The memory leak component determination module is used to determine the target memory leak component from the candidate memory leak components based on the document object model after component creation and the document object model after component destruction of the candidate memory leak components.

[0041] Thirdly, this application also provides a computer device, the computer device including a memory and a processor, the memory storing a computer program, and the processor executing the computer program to perform the following steps:

[0042] When a component creation event of the component to be detected is detected, a first set of snapshots corresponding to the component creation event of the component to be detected is generated; when a component destruction event of the component to be detected is detected, a second set of snapshots corresponding to the component destruction event of the component to be detected is generated.

[0043] Based on the structured operation logs, the first and second snapshots are parsed to determine the target structured data; the target structured data includes the first structured data corresponding to the first snapshot and the second structured data corresponding to the second snapshot.

[0044] Based on preset node filtering conditions, the array of memory object nodes in the target structured data is filtered to determine component instance nodes, and an information mapping table between the unique identifier of the component instance node and the node information is constructed; the information mapping table includes a mapping table after the component is created corresponding to the first structured data and a mapping table after the component is destroyed corresponding to the second structured data;

[0045] Based on the information mapping table, candidate memory leak components are identified;

[0046] Based on the document object model after component creation and the document object model after component destruction of the candidate memory leak components, the target memory leak component is determined from the candidate memory leak components.

[0047] Fourthly, this application also provides a computer-readable storage medium having a computer program stored thereon, the computer program performing the following steps when executed by a processor:

[0048] When a component creation event of the component to be detected is detected, a first set of snapshots corresponding to the component creation event of the component to be detected is generated; when a component destruction event of the component to be detected is detected, a second set of snapshots corresponding to the component destruction event of the component to be detected is generated.

[0049] Based on the structured operation logs, the first and second snapshots are parsed to determine the target structured data; the target structured data includes the first structured data corresponding to the first snapshot and the second structured data corresponding to the second snapshot.

[0050] Based on preset node filtering conditions, the array of memory object nodes in the target structured data is filtered to determine component instance nodes, and an information mapping table between the unique identifier of the component instance node and the node information is constructed; the information mapping table includes a mapping table after the component is created corresponding to the first structured data and a mapping table after the component is destroyed corresponding to the second structured data;

[0051] Based on the information mapping table, candidate memory leak components are identified;

[0052] Based on the document object model after component creation and the document object model after component destruction of the candidate memory leak components, the target memory leak component is determined from the candidate memory leak components.

[0053] The aforementioned component memory leak detection method, apparatus, computer equipment, and storage medium, when detecting a component creation event of a component to be detected, generate a first set of snapshots corresponding to the component creation event of the component to be detected; when detecting a component destruction event of a component to be detected, generate a second set of snapshots corresponding to the component destruction event of the component to be detected; based on structured operation logs, parse the first set of snapshots and the second set of snapshots to determine target structured data; the target structured data includes first structured data corresponding to the first set of snapshots and second structured data corresponding to the second set of snapshots; according to preset node filtering conditions, filter the array of memory object nodes in the target structured data to determine component instance nodes, and construct an information mapping table between the unique identifier of the component instance node and the node information; the information mapping table includes a component creation post-mapping table corresponding to the first structured data and a component destruction post-mapping table corresponding to the second structured data; according to the information mapping table, determine candidate memory leak components; according to the component creation post-document object model and component destruction post-document object model of the candidate memory leak components, determine the target memory leak component from the candidate memory leak components. This solution addresses the shortcomings of existing memory leak detection tools, which rely on manual processes for memory snapshot collection and comparative analysis, and cannot establish a direct link between Vue.js 2 component lifecycles and memory objects, making it difficult to locate leaking components and sources, resulting in low detection efficiency. The proposed solution combines Puppeteer's automated operation and memory monitoring capabilities with Vue.js 2's component lifecycle and identification features. It solves the problem of traditional detection tools' inability to accurately link front-end framework components with memory objects, achieving fully automated detection from operation simulation, memory collection, leak analysis to report generation. This significantly improves the efficiency and accuracy of Vue.js 2 application component-level memory leak detection, reduces developers' detection and remediation costs, accurately locates memory leaks caused by unreleased resources within the component lifecycle, improves the accuracy of identifying component memory leak scenarios, and enhances the degree of automated component memory leak detection. Attached Figure Description

[0054] Figure 1 This is an application environment diagram of a component memory leak detection method in one embodiment;

[0055] Figure 2 This is a flowchart illustrating a component memory leak detection method in one embodiment;

[0056] Figure 3 This is a flowchart illustrating a method for determining a target memory leak component in one embodiment;

[0057] Figure 4 This is a flowchart illustrating a component memory leak detection method in another embodiment;

[0058] Figure 5 This is a structural block diagram of a component memory leak detection device in one embodiment;

[0059] Figure 6 This is an internal structural diagram of a computer device in one embodiment. Detailed Implementation

[0060] To make the objectives, technical solutions, and advantages of this application clearer, the following detailed description is provided in conjunction with the accompanying drawings and embodiments. It should be understood that the specific embodiments described herein are merely illustrative and not intended to limit the scope of this application.

[0061] The component memory leak detection method provided in this application embodiment can be applied to, for example, Figure 1 In the application environment shown, terminal 102 communicates with server 104 via a network. A data storage system can store the data that server 104 needs to process. The data storage system can be integrated onto server 104, or it can be located in the cloud or on another network server. Server 104 listens for component creation events of the component under test, generates a first set of snapshots corresponding to the component creation events of the component under test, and listens for component destruction events of the component under test, generating a second set of snapshots corresponding to the component destruction events of the component under test. Based on structured operation logs, the first set of snapshots and the second set of snapshots are parsed to determine target structured data. The target structured data includes first structured data corresponding to the first set of snapshots and second structured data corresponding to the second set of snapshots. According to preset node filtering conditions, the array of memory object nodes in the target structured data is filtered to determine component instance nodes, and a node unique identifier and information mapping table of the component instance nodes are constructed. The information mapping table includes a component creation post-mapping table corresponding to the first structured data and a component destruction post-mapping table corresponding to the second structured data. Based on the information mapping table, candidate memory leak components are determined. Based on the component creation post-document object model and component destruction post-document object model of the candidate memory leak components, the target memory leak component is determined from the candidate memory leak components. The component information and component unique identifier of the target memory leak component are sent to terminal 102 through the communication network. The terminal 102 can be, but is not limited to, various personal computers, laptops, smartphones, tablets, IoT devices, and portable wearable devices. IoT devices can include smart speakers, smart TVs, smart air conditioners, and smart in-vehicle systems. Portable wearable devices can include smartwatches, smart bracelets, and head-mounted devices. The server 104 can be implemented using a standalone server or a server cluster consisting of multiple servers.

[0062] In one embodiment, such as Figure 2As shown, a component memory leak detection method is provided, which is applied to the headless browser Puppeteer. In this embodiment, the method includes the following steps:

[0063] S210. When a component creation event of the component to be detected is detected, a first set of snapshots corresponding to the component creation event of the component to be detected is generated. When a component destruction event of the component to be detected is detected, a second set of snapshots corresponding to the component destruction event of the component to be detected is generated.

[0064] The component creation event, or `mounted` event, is a hook function in the Vue instance lifecycle that indicates the component has been mounted to the DOM (Document Object Model). At this point, the DOM elements have been rendered, and DOM manipulation and data fetching are possible. Vue is a JavaScript framework for building user interfaces. The component destruction event, or `destroyed` event, is another hook function in the Vue component lifecycle used to perform cleanup operations after the component instance is destroyed. At this point, the component's DOM node has been removed from the document, and all event listeners and child component instances are also destroyed. The component to be tested is a Vue.js 2 component.

[0065] Specifically, the system listens for the `mounted` event of the component under test. After a first preset time delay following the `mounted` event trigger, it calls the snapshot generation function of the headless browser controller to generate a heap snapshot corresponding to the `mounted` event. The snapshot ID and snapshot path of the heap snapshot corresponding to the `mounted` event are recorded in the `snapshotIds` field of the corresponding component in the leak list `LeakMap`. The first preset time can be 500ms. Next, the system listens for the `destroyed` event of the component under test. After the destruction timer triggers, it waits for a second preset time and calls the snapshot generation function of the headless browser controller to generate a heap snapshot corresponding to the `destroyed` event. The snapshot ID and snapshot path of the heap snapshot corresponding to the `destroyed` event are then recorded in the `snapshotIds` field of the corresponding component in `LeakMap`. The second preset time can be 200ms.

[0066] S220. Based on the structured operation log, parse the first and second batch snapshots to determine the target structured data.

[0067] The target structured data includes the first structured data corresponding to the first set of snapshots and the second structured data corresponding to the second set of snapshots.

[0068] The target structured data includes an array of memory object nodes (nodes), an array of object references (edges), and an array of string constants (strings). The heap snapshot library is the heap-snapshot library. In the node array, each element represents a memory object, containing a unique object ID, object type (type), object name index (nameOrIndex), object size (size), and a list of node IDs referencing that object (retainers). The object type can be "object", "function", or "string"; the object name index points to the strings array. In the object reference array, each element represents a pair of object references, containing the referrer node ID (from), the referenced node ID (to), type, and reference type. Reference types include "property" and "closure". The string constant array stores all string constants in the snapshot. The actual object name can be obtained through nameOrIndex, and the actual object name includes component instance names and property names.

[0069] Specifically, based on the structured operation logs stored in the heap snapshot tool library, the first and second heap snapshots are parsed to determine the target structured data.

[0070] For example, the structured operation log can be generated as follows: based on the target detection environment, a target identifier generation algorithm is determined from candidate identifier generation algorithms, and a unique component identifier is generated based on the target identifier generation algorithm; the candidate identifier generation algorithms include: timestamp and random string algorithm, hash digest algorithm and universal unique identification code algorithm based on random numbers; the structured operation log is determined based on the historical interaction event sequence generated by the user after the component creation event and component destruction event triggered by the basic operation scenario and the sample component.

[0071] It's important to note that in Vue.js 2 applications, the Vue.mixin global mixin mechanism injects the unique component identifier `vueLeakId` into the `beforeCreate` lifecycle hook of all components. After the component is mounted, `vueLeakId` is added to the custom properties of the component's root DOM element. This identifier `vueLeakId` serves as the core anchor point for subsequently associating DOM elements with memory objects. The component's root DOM element is the outermost real DOM node managed by the Vue component instance; it is the actual element on the page corresponding to the component after rendering. The custom properties of the component's root DOM element can be... The hash digest algorithm can be either MD5 or SHA_1 (Secure Hash Algorithm 1).

[0072] Specifically, if the target detection environment is a regular development and testing environment, a unique component identifier is generated based on the component name, the current millisecond-level timestamp, and a 5-digit Base36 encoded random suffix using a timestamp and random string algorithm. If the detection environment is a large-scale Vue.js 2 project detection environment or a distributed detection environment, a general unique identification code algorithm based on random numbers is used, calling the browser or Node.js built-in standard library, such as crypto.randomUUID(), to generate a UUID version 4 conforming to the RFC 4122 standard. This generated UUID version 4 conforming to the RFC 4122 standard is directly used as the unique component identifier, without relying on the component name or timestamp. If the detection environment is a complex project debugging scenario that requires tracing the component's source code location back through the identifier, a hash digest algorithm is used to construct the input string based on the component name, the component's source code file path, and the component's definition line number. The hash digest algorithm is then used to calculate the digest, generating a unique identifier strongly associated with the component's source code location.

[0073] For example, if the source code path of component CompA is "src / components / CompA.vue", the definition line number is 10, and the input string is "CompA_src / components / CompA.vue_10", the unique identifier of component CompA obtained after MD5 message digest algorithm is "e8d4f7a9b2c3d1e0f5g6h7i8j9k0l1m2".

[0074] Furthermore, when the Puppeteer controller starts, it registers a global function `page.exposeFunction('reportVueComponentEvent', (eventType,vueLeakId, componentInfo) => { ...})` based on the component event type, unique component identifier, and basic component information. Through global mixin, when a component is created or destroyed in the Vue application, the `window.reportVueComponentEvent` function is called to send the component event type, unique component identifier, and basic component information to the Puppeteer controller. Upon receiving the component event type, unique component identifier, and basic component information, the Puppeteer controller triggers subsequent operations such as memory snapshot collection and mapping table updates, achieving linkage between component events and memory monitoring, thereby enabling real-time communication between the browser-side Vue application and the Puppeteer controller.

[0075] Furthermore, based on the real-time communication between the Vue application in the browser and the Puppeteer controller, the Puppeteer controller maintains a data structure named LeakMap, which stores the mapping relationship between vueLeakId and component information. The key of LeakMap is the unique identifier of the component, vueLeakId, and the value of LeakMap is an object containing field names, data types, and descriptive information. For example, the values ​​of LeakMap are shown in Table 1.

[0076] Table 1

[0077]

[0078] Furthermore, a basic operation scenario library is constructed. This library stores basic operation scenarios, their corresponding operation information, and trigger information. Basic operation scenarios include route switching scenarios, component showing / hiding scenarios, list refresh scenarios, and form interaction scenarios. Based on historical operation processes, a structured operation log is determined by the sequence of historical interaction events generated after the user triggers component creation and destruction events based on the basic operation scenarios and sample components. The historical operation process can be a preliminary testing process or a manual operation process. The structured operation log includes: event type, target element, operation parameters, and event interval. Event types include "click," "input," and "navigation selector," etc.; target elements are located using CSS selectors or XPath, where the CSS selector can be "#btn-submit" and the XPath can be " / / div[@class='modal-close']"; operation functions include the input content of the "input" event and the coordinates of the "click" event; the time interval refers to the time interval between adjacent operations, in milliseconds, to ensure the realism of the simulated operations.

[0079] It's important to note that a standardized simulation script is used for each frequently occurring user interaction scenario in the built-in Vue.js 2 application. This standardized simulation script forms the basis for a basic operation scenario library. For example, the route switching scenario is constructed by simulating a user clicking a route navigation button, triggering the creation and destruction of route components, and using Puppeteer's `page.click(selector)` and `page.waitForNavigation()` to implement the route switching scenario. The component show / hide scenario is constructed by simulating a user clicking a button to control the display / hide of the `v-if` component, triggering a state change using `page.click(selector)`, and confirming the component state using `page.waitForSelector(selector, { visible: true / false})`. The list refresh scenario is constructed by simulating a user triggering a list data refresh, executing a Vue instance method using `page.evaluate()` to trigger the re-creation of list item components, thus implementing the list refresh scenario. The construction of form interaction scenarios includes: simulating user input of form content, submitting the form, triggering state changes and lifecycle events of form components and related sub-components, thereby realizing the construction of form interaction scenarios.

[0080] It should be noted that when updating LeakMap, after receiving the `created` (component creation) event, the Puppeteer controller adds a new entry to LeakMap, initializes the `componentName`, `lifecycleState`, `domPath`, and `createTime` fields, sets `destroyTime` to null, and sets `snapshotIds` to an empty array. After a memory snapshot is collected, the snapshot ID (Identity document) is added to the `snapshotIds` array of the corresponding component entry, establishing the association between the component and the memory snapshot.

[0081] The above solution, by registering a global communication function in the browser environment using the `page.exposeFunction` method, enables real-time communication between the browser-side Vue application and the Puppeteer controller. By simulating real user interaction scenarios to trigger the creation and destruction of Vue components, the timing of memory snapshot collection is precisely controlled. Combined with historical operation recording and random loading mechanisms, the coverage and accuracy of component memory leak detection can be improved.

[0082] S230. Based on the preset node filtering conditions, filter the array of memory object nodes in the target structured data, determine the component instance nodes, and construct the node unique identifier and information mapping table of the component instance nodes.

[0083] The information mapping table includes a mapping table after the creation of the component corresponding to the first structured data and a mapping table after the destruction of the component corresponding to the second structured data.

[0084] The node filtering criteria can be: the node type is "object", the node name obtained by strings[node.nameOrIndex] contains "VueComponent" or "VueInstance", or the node's associated properties contain vueLeakId. By iterating through the node's property references and matching the index corresponding to the string "vueLeakId" in the strings array, the associated properties of the node can be determined.

[0085] Specifically, based on preset node filtering criteria, the array of memory object nodes in the target structured data is filtered to determine component instance nodes. For the filtered Vue component instance nodes, an information mapping table named ComponentNodeMap is constructed, which includes the snapshot node ID (nodeId), the node memory size (size), the component DOM path (domPath) obtained from LeakMap, and the list of node IDs referencing the node (retainers).

[0086] S240. Based on the information mapping table, identify candidate memory leak components.

[0087] Specifically, by comparing the component creation mapping table `Snapshot_InitComponentNodeMap` corresponding to the first structured data with the component destruction mapping table `Snapshot_DestroyComponentNodeMap` corresponding to the second structured data, if a node corresponding to the `vueLeakId` in the component creation mapping table exists in the destruction mapping table, and the node's memory size change is less than 10%, then the component corresponding to that `vueLeakId` is marked as a candidate memory leak component. A list of suspected leaks can be generated based on the number of components and total memory usage of the candidate memory leak components.

[0088] S250. Based on the document object model after component creation and the document object model after component destruction of the candidate memory leak components, determine the target memory leak component from the candidate memory leak components.

[0089] For example, the method for determining the target memory leak component is as follows: Figure 3 As shown, the specific steps include the following:

[0090] S2501. Before the destruction event of the candidate memory leak component is triggered, execute the document object model structure traversal logic to record the first model structure information of the document object model after the component is created.

[0091] The first model structure information includes the tag name, attribute key-value pairs, child element list, and element path of the document object model before the destruction event is triggered and after the component is created.

[0092] Specifically, before the destruction event of the candidate memory-leaking component is triggered, the `page.evaluate()` function of `Puppeteer` executes the Document Object Model (DOM) structure traversal logic, recording the structural information of the component's root DOM element and all its child elements. This records the initial DOM structure information after the component's creation. The recorded content includes: the tag name (`tagName`), attribute key-value pairs (`attributes`), the list of child elements (`childNodes`), and the element's XPath (`xpath`). Among these, the attribute key-value pairs include `data-vue-leak-id`, a property in Vue.js used to identify memory leaks. This property typically appears in development tools or debug logs, helping developers locate memory usage issues caused by improper component destruction.

[0093] S2502. After the destruction event of the candidate memory leak component is triggered, execute the document object model structure traversal logic to record the second model structure information of the document object model after the component is destroyed.

[0094] The second model structure information includes the tag name, attribute key-value pairs, child element list, and element path of the document object model after the component is destroyed following the triggering of the destruction event.

[0095] S2503. Using a tree-structured difference comparison algorithm, the model structure difference information is determined based on the first model structure information and the second model structure information.

[0096] The model structure difference information includes: node addition information, node deletion information, node attribute change information, and child node change information.

[0097] The tree structure difference comparison algorithm can be a recursive node comparison algorithm or a Levenshtein distance optimization algorithm. Node addition information refers to the node information of nodes that appeared after the component was destroyed but did not exist before the component was destroyed; node deletion information refers to the node information of nodes that existed before the component was destroyed but disappeared after the component was destroyed; node attribute change information refers to the node information of nodes whose signature remains unchanged but whose attribute values ​​have changed; node change information refers to the node information of nodes that exist themselves but whose child nodes have been added, deleted, or modified.

[0098] S2504. Based on the model structure difference information, determine the target memory leak component from the candidate memory leak components.

[0099] For example, if, based on model structure difference information, it is determined that the root DOM element and all its child elements of a candidate memory leak component have disappeared from the DOM tree (i.e., no corresponding node in the DOM snapshot after destruction), and the instance node of the candidate memory leak component still exists in Snapshot_Destroy, then the candidate memory leak component is determined to be the target memory leak component. If, based on model structure difference information, it is determined that the root DOM element of a candidate memory leak component has disappeared, but some child elements still exist in the DOM tree (e.g., the child elements of the pop-up content are not removed after the pop-up is closed), and the memory node associated with the corresponding child element exists in Snapshot_Destroy, then the candidate memory leak component is determined to be the target memory leak component, and the candidate memory leak component has a DOM fragment leak. If, based on model structure difference information, it is determined that the DOM structure of a candidate memory leak component is completely preserved (i.e., there is no difference in the DOM snapshot before and after the candidate memory leak component is destroyed), and the instance node of the component corresponding to data-vue-leak-id exists in Snapshot_Destroy, while the lifecycleState of the component in LeakMap is "activated," then the candidate memory leak component does not have a memory leak problem. Furthermore, if, based on the model structure difference information, it is determined that a certain candidate memory leak component DOM node exists but its attributes have changed while some of its child nodes are retained, then it is necessary to further analyze whether the candidate memory leak node is the target memory leak node by combining the memory node reference relationship.

[0100] The above scheme obtains the document object model after component creation and the document object model after component destruction of the candidate memory leak components. Based on the document object model after component creation and the document object model after component destruction, the target memory leak component is determined from the candidate memory leak components, which can achieve accurate location and type identification of memory leak components.

[0101] In the above-described component memory leak detection method, when a component creation event of the component to be detected is detected, a first snapshot corresponding to the component creation event of the component to be detected is generated; when a component destruction event of the component to be detected is detected, a second snapshot corresponding to the component destruction event of the component to be detected is generated. Based on the structured operation log, the first snapshot and the second snapshot are parsed to determine the target structured data. The target structured data includes the first structured data corresponding to the first snapshot and the second structured data corresponding to the second snapshot. According to the preset node filtering conditions, the array of memory object nodes in the target structured data is filtered to determine the component instance nodes, and an information mapping table between the unique identifier of the component instance node and the node information is constructed. The information mapping table includes the component creation post-mapping table corresponding to the first structured data and the component destruction post-mapping table corresponding to the second structured data. Based on the information mapping table, candidate memory leak components are determined. Based on the component creation post-document object model and component destruction post-document object model of the candidate memory leak components, the target memory leak component is determined from the candidate memory leak components. This solution addresses the shortcomings of existing memory leak detection tools, which rely on manual processes for memory snapshot collection and comparative analysis, and cannot establish a direct link between the Vue.js 2 component lifecycle and memory objects, making it difficult to locate leaking components and sources, resulting in low detection efficiency. The proposed solution can accurately locate memory leaks caused by unreleased resources within the component lifecycle, improving the accuracy of identifying component memory leak scenarios and enhancing the automation of component memory leak detection.

[0102] In one embodiment, based on the structured operation logs, the first and second batch of snapshots are parsed to determine the target structured data, including:

[0103] Based on a preset memory acquisition frequency, the used heap memory of the component under test is acquired. A memory change curve is generated based on the used heap memory and the acquisition timestamp corresponding to the used heap memory. If the decrease in the memory change curve is less than a preset decrease threshold, the first and second heap snapshots are parsed based on the structured operation log to determine the target structured data. The target structured data includes the first structured data corresponding to the first heap snapshot and the second structured data corresponding to the second heap snapshot.

[0104] The used heap memory reflects the actual usage of JavaScript heap memory. The preset memory sampling frequency can be to sample the used heap memory (usedJSHeapSize) of the component under test every 100ms within the Snapshot_Init and Snapshot_Destroy sampling interval. The preset decrease threshold can be set according to actual needs, for example, it can be set to 5%.

[0105] Specifically, Puppeteer collects the used heap memory of the component under test using the `page.memoryInfo()` method based on a preset memory sampling frequency. It stores the collected used heap memory and the corresponding sampling timestamp as an array, and generates a memory change curve based on the used heap memory and its corresponding sampling timestamp. The memory change curve is used to determine whether `usedJSHeapSize` decreases significantly after the component is destroyed. If `usedJSHeapSize` does not decrease significantly after component destruction (i.e., the decrease in the memory change curve is less than a preset decrease threshold), or if `usedJSHeapSize` remains high after component destruction, an "abnormal memory retention" flag is added to the component under test. The first and second heap snapshots are then parsed based on structured operation logs to determine the target structured data.

[0106] The above solution provides instance data for intelligent diagnosis of component memory leaks in the component under test by triggering changes in the component lifecycle and memory fluctuations of the component under test. The generated memory change curve can help determine whether there is abnormal memory retention in the component under test.

[0107] In one embodiment, such as Figure 4 As shown, the above-mentioned component memory leak detection method also includes:

[0108] S310. Construct a memory reference graph based on the target object nodes and object edges corresponding to the target memory leak component.

[0109] Here, the target object node (Node) refers to the object node in the memory snapshot corresponding to the target memory leak component, including the node ID (id), object type (type), object name (name) obtained from the strings array, memory size (size), and the list of nodes referencing the target object node (retainers). The object edge refers to the reference relationship between objects corresponding to the target memory leak component, pointing from the referrer to the referenced, and includes fromNodeId (referrer node ID), toNodeId (referenced node ID), and reference type (refType). The reference type can be "property", "closure", or "eventListener".

[0110] Specifically, the target object nodes corresponding to the target memory leak component are extracted from the parsed snapshot nodes array. Based on these target object nodes, the node set of the memory reference graph ReferenceGraph is initialized. The object edges corresponding to the target memory leak component are extracted from the edges array. Based on these object edges, the edge set of ReferenceGraph is initialized. Retainers information is added to each target object node in ReferenceGraph to form a complete reference chain between target object nodes, thus constructing a complete memory reference graph. The retainers information is obtained by associating the retainers field of the nodes array with the reference relationship in the edges array.

[0111] S320. Based on the target object node corresponding to the target memory leak component, perform a reverse breadth-first search to determine the node reference chain of the target object node of the target memory leak component.

[0112] Specifically, starting from the target object node corresponding to the target memory leak component, a reverse breadth-first search is performed to explore all node reference chains pointing to the target object node corresponding to the target memory leak component.

[0113] S330. Perform path compression on the node reference chain and determine the compression path.

[0114] For example, path compression is performed on the node reference chain, and the compression path is determined, including:

[0115] Based on the path function of each link path in the node reference chain, the critical path is determined from the link paths, and the critical nodes in the critical path are identified; based on the memory occupied by the critical nodes, intermediate nodes are determined from the critical nodes; based on the intermediate nodes, the critical path is compressed to determine the compressed path.

[0116] It's important to note that critical nodes refer to those in the node reference chain that play a decisive role in memory leaks. These typically include global object nodes, framework core object nodes, long-lifecycle object nodes, and user-explicitly referenced object nodes. Global object nodes are references directly mounted to the global scope, with a lifecycle consistent with the application, and are prone to long-term memory leaks, such as `window` and `globalThis`. Framework core object nodes are framework-level objects with long lifecycles; if they hold component references, they can easily lead to component memory leaks, such as `Vue.prototype.$bus` (event bus), `Vuex.Store` (state management instance), and `VueRouter` (router instance). Long-lifecycle object nodes are those whose lifecycles are independent of the component, easily overlooked, and can lead to component memory leaks, such as `setTimeout`, `setInterval`, `addEventListener` bound to DOM event listeners that haven't been removed, and external component variables referenced in function closures. User-explicitly referenced object nodes are references actively created by user code and require targeted fixing, such as cross-component references passed through component data properties and props, and global cache objects, where `window.globalCache` can be an example.

[0117] Specifically, based on the path function of each link in the node reference chain, the critical path is determined, and the critical nodes within the critical path are identified. Based on the memory usage of the critical nodes, intermediate nodes are determined from among them. Intermediate nodes are the critical nodes that consume the most memory. Using a path compression algorithm, the critical path is compressed based on the intermediate nodes to determine the compressed path.

[0118] S340. Identify the root cause node of the memory leak from the compressed path, and determine the root cause information of the memory leak based on the root cause node.

[0119] The root cause information of a memory leak includes the path identifier of the compressed path, the node type of the root cause node of the memory leak, and the component context of the target memory leak component.

[0120] Among them, the root cause node of memory leak refers to the non-business logic node.

[0121] For example, if the top-level node of the compressed path is `Vue.prototype.$bus` and its reference type is "eventListener", then a component memory leak is confirmed. The root cause of the memory leak is that the event bound to the component on the data bus was not unbound when the component was destroyed, causing the data bus to hold a reference to the component. In this case, the top-level node of the path is the root cause of the memory leak. If the top-level node of the path is `window.setInterval` and its reference type is "closure", then a component memory leak is confirmed. The root cause of the memory leak is that the `setInterval` timer created by the component was not cleared, and the timer callback closure references the component instance. In this case, the top-level node of the path is the root cause of the memory leak. If the top-level node of the path is `window.globalCompCache` and its reference type is a property, then a component memory leak is confirmed. The root cause of the component memory leak is that the component instance is mounted to the global variable `window.globalCompCache` and the reference was not deleted when the component was destroyed. In this case, the top-level node of the path is the root cause of the memory leak. Among them, the data bus holding component references refers to the use of an additional Vue instance as an intermediary to achieve communication between components. This instance will store component references or event listening relationships.

[0122] S350. Based on the root cause information of the memory leak, determine the target memory leak pattern from the pre-built leak pattern knowledge base.

[0123] The leakage pattern knowledge base stores candidate memory leak types and their corresponding root cause information feature vectors.

[0124] For example, the memory leak pattern knowledge base is constructed as follows: Common memory leak patterns in Vue.js 2 applications are predefined, and the fields corresponding to these patterns are stored in a JSON-formatted knowledge base. This JSON-formatted knowledge base containing the fields corresponding to common memory leak patterns is the memory leak pattern knowledge base. The knowledge base can be expanded through feedback from the reporting layer or manual additions. The fields corresponding to common memory leak patterns are shown in Table 2.

[0125] Table 2

[0126]

[0127] For example, the root cause information of memory leaks can be vectorized to determine the information feature vector; the information feature vector can be matched with the root cause information feature vectors stored in the leak pattern knowledge base for similarity; the information feature vector can be determined based on the matching result; and the candidate memory leak type corresponding to the information feature vector can be determined as the target memory leak pattern.

[0128] For example, the root cause information of memory leaks is vectorized, converting it into feature vectors of the same dimension as the leak pattern knowledge base, i.e., information feature vectors. The cosine similarity between the information feature vectors and the root cause information feature vectors stored in the leak pattern knowledge base is determined. The root cause information feature vectors corresponding to cosine similarities greater than a preset similarity threshold are identified as target feature vectors. The target feature vector corresponding to the largest cosine similarity value is identified as the final matching vector, and the memory leak pattern corresponding to the final matching vector is identified as the target memory leak pattern. If multiple cosine similarity values ​​are identical and all are the maximum value, the memory leak patterns are further filtered by combining the leakSize and referenceDepth of the target memory leak component to determine the target memory leak pattern. If all cosine similarities are less than or equal to the preset similarity threshold, the target memory leak component is marked as an "unknown leak pattern," and the reference path between the memory leak feature information and the target memory leak component is recorded for subsequent updates to the leak pattern knowledge base.

[0129] For example, the formula for calculating cosine similarity is shown in formula (1).

[0130] (1)

[0131] in, For cosine similarity, Let i be the value of the i-th dimension of the information feature vector. Let i be the i-th dimension value of the root information feature vector. The i-th dimension value of the predefined pattern feature weights.

[0132] The above scheme, through reverse breadth-first search, determines the node reference chain of the target object node of the target memory leak component. Compared with the forward traversal method from the root node to the leak node, it can reduce interference from irrelevant nodes and improve the reliability of the constructed node reference chain. Simultaneously, for target memory leak components with memory leak issues, by constructing a memory reference graph, reverse path exploration, and critical path compression, the root cause of the leak is located, and the target memory leak pattern is determined, which can improve the accuracy of the target memory leak pattern.

[0133] For example, based on the above embodiments, the component memory leak detection method further includes:

[0134] Collect target detection data during the component memory leak detection process; target detection data includes detection metadata, leaked component data, memory monitoring data, memory leak analysis data, pattern matching data, and flame graph data of node reference chains; construct a visualization report based on the target detection data; the visualization report includes a memory leak risk summary dashboard, a view of the temporal relationship between leaked components and memory, and a visualized memory leak root cause reference chain; the memory leak risk summary dashboard includes global statistical indicator cards, a detection overview list, and a risk level distribution chart; based on the component description document of the target memory leak component and the template memory leak pattern, generate component remediation suggestions for the target memory leak component.

[0135] It should be noted that the detection metadata includes: detection time, target application URL (uniform resource locator), Puppeteer version, Vue.js version, number of test scenarios, and number of memory snapshots. Leaked component data includes: a list of suspected leaked components and a list of actual leaked components; the list of actual leaked components includes data such as vueLeakId, componentName, leakSize, referenceDepth, and risk level. Memory monitoring data includes memory change curves and abnormal memory retention intervals. Memory leak analysis data includes compressed reference paths of leaked components, root cause node information, and descriptions of the memory leak causes. Pattern matching data includes target memory leak patterns, cosine similarity, and suggested remediation templates. Flame graph data is call stack information collected through performance analysis tools, visually displaying CPU (Central Processing Unit) usage during program runtime to help locate performance bottlenecks.

[0136] The memory leak risk summary dashboard includes global statistical indicator cards, a detection overview list, and a risk level distribution chart. Global statistical indicator cards display key data in color-coded form, including the application URL being detected, detection duration, total number of leaking components, total leaked memory size, and the unique identifier of the component with the highest risk of memory leaks. For example, a global statistical indicator card might include: a total of 3 leaking components, a total leaked memory size of 4.2MB, and CompA as the component with the highest risk of memory leaks. The detection overview list lists metadata about the detection process in tabular form, including the test scenario name, execution duration, number of triggering components, number of snapshots collected, and number of anomaly markers. The risk level distribution chart uses a pie chart to show the percentage of leaking components at different risk levels.

[0137] The Leaked Components and Memory Timing Relationship View is a visual interface that represents the linkage between the list of leaked components and the memory change timing graph. The leaked component list is a sortable and filterable table. Column information includes the component name, vueLeakId, leaked memory size, reference chain depth, leak mode type, risk level, and operation information of the target memory leak component. The operation information column includes "View Details" and "Download Snapshot" buttons. It supports sorting by leaked memory size in descending order, prioritizing components with a greater impact on memory leaks, and filtering by risk level, such as only displaying high-risk target memory leak components. The memory change timing graph uses a line chart to show the trend of usedJSHeapSize over time. The graph is marked with the test scenario execution time, component creation time, component destruction time, and abnormal memory retention interval. For example, the test scenario execution time can be marked with a vertical dashed line and text, the component creation time can be marked with green dots, the component destruction time can be marked with red dots, and the abnormal memory retention interval can be covered with a red semi-transparent block and marked "Abnormal Retention: Memory did not decrease after component destruction." In the leaked component and memory timing relationship view, clicking on a row in the leaked component list will automatically focus the timing graph on the lifecycle period of that component and highlight the corresponding memory change curve for targeted analysis. The lifecycle period can be from the component's creation time to five seconds after the component's destruction time.

[0138] The visualized memory leak root cause reference chain can include a simplified reference chain flame graph, node detail hover tools, and a one-click source code location button. The simplified reference chain flame graph displays the compressed reference path using a flame graph format. Node size is proportional to memory usage, and the color changes according to the memory leak risk level; for example, a high-risk node is red, a medium-risk node is yellow, and a low-risk node is green. For instance, the link path in the simplified reference chain flame graph could be window (top-level node) → Vue.prototype.$bus (global event bus) → handleUserChange (closure function) → CompA (leaking component, bottom-level node). The simplified reference chain flame graph supports dragging to zoom and double-clicking to expand nodes and view sub-references. The node detail hover tooltip is a floating window displayed when the mouse hovers over the simplified reference chain flame graph. This floating window contains information such as the node's ID, type, name, memory size, reference type, and associated DOM path. The "One-Click Source Code Location" button refers to a button that allows users to quickly locate leaked code if the code associated with a node can be mapped to the source code via a Source Map. This button is available in the floating window or the right-click menu of the node. After clicking, the corresponding file and line number can be opened directly in the integrated development environment via a custom protocol.

[0139] The component remediation suggestion for the target memory leak component refers to describing the cause of the leak and the remediation approach in natural language based on the matching template memory leak pattern. For example, the component remediation suggestion for the target memory leak component could be: "The CompA component binds the 'user-change' event to this.bus.on in the created phase, but does not unbind it in the destroyed phase, causing the bus to hold a reference to the component, resulting in a memory leak. It is recommended to call this.$bus.off in the destroyed hook to unbind the event." Here, bus refers to the bus system, and this.bus.on is the cross-bus communication function. Additionally, it can provide Vue.js official documentation and community best practices or internal team specification chains related to the leak pattern to help developers deepen their understanding of leak issues and avoid similar problems in the future.

[0140] For example, based on the above embodiments, the component memory leak detection method includes:

[0141] In Vue.js 2 applications, the Vue.mixin global mixin mechanism injects the unique component identifier `vueLeakId` into the `beforeCreate` lifecycle hook of all components. After the component is mounted, the `vueLeakId` is added to a custom property of the component's root DOM element. This identifier `vueLeakId` serves as the core anchor point for subsequently associating DOM elements with memory objects. The component's root DOM element is the outermost real DOM node managed by the Vue component instance; it is the actual element on the page corresponding to the component after rendering.

[0142] If the target detection environment is a regular development and testing environment, a unique component identifier is generated based on the component name, the current millisecond-level timestamp, and a 5-digit Base36 encoded random suffix using a timestamp and random string algorithm. If the target detection environment is a large-scale Vue.js 2 project detection environment or a distributed detection environment, a general unique identification code algorithm based on random numbers is used, calling the browser or Node.js built-in standard library, such as `crypto.randomUUID()`, to generate a UUID version 4 conforming to RFC 4122. This generated UUID version 4 conforming to RFC 4122 is directly used as the component's unique identifier, without relying on the component name or timestamp. If the target detection environment is a complex project debugging scenario where the component's source code location needs to be traced back using the identifier, a hash digest algorithm is used to construct the input string based on the component name, the component's source code file path, and the component's definition line number. The hash digest algorithm is then used to calculate the digest, generating a unique identifier strongly associated with the component's source code location.

[0143] When the Puppeteer console starts, it registers a global function `page.exposeFunction('reportVueComponentEvent', (eventType, vueLeakId,componentInfo) => { ...})` based on the component event type, unique component identifier, and basic component information. Through global mixin, when a component is created or destroyed in the Vue application, the `window.reportVueComponentEvent` function is called, sending the component event type, unique component identifier, and basic component information to the Puppeteer console. Upon receiving the component event type, unique component identifier, and basic component information, the Puppeteer console triggers subsequent operations such as memory snapshot collection and mapping table updates, achieving linkage between component events and memory monitoring, thus enabling real-time communication between the browser-side Vue application and the Puppeteer console. Based on the real-time communication between the Vue application on the browser side and the Puppeteer controller, the Puppeteer controller maintains a data structure called LeakMap, which stores the mapping relationship between vueLeakId and component information. The key of LeakMap is the unique identifier of the component, vueLeakId, and the value of LeakMap is an object containing field names, data types, and descriptive information.

[0144] A basic operation scenario library is constructed. This library stores basic operation scenarios, their corresponding operation information, and trigger information. Basic operation scenarios include route switching, component showing / hiding, list refresh, and form interaction scenarios. Based on historical operation processes, a structured operation log is determined by the sequence of historical interaction events generated after the user triggers component creation and destruction events based on the basic operation scenarios and sample components. The historical operation process can be a preliminary testing process or a manual operation process. The structured operation log includes: event type, target element, operation parameters, and event interval. Event types include "click," "input," and "navigation," etc.; target elements are located using CSS selectors or XPath. A CSS selector can be "#btn-submit," and an XPath can be " / / div[@class='modal-close']"; operation functions include the input content of the "input" event and the coordinates of the "click" event; the time interval refers to the time interval between adjacent operations, in milliseconds, to ensure the realism of the simulated operations.

[0145] By incorporating frequently occurring user interaction scenarios from built-in Vue.js 2 applications, each scenario corresponds to a standardized simulation script, which forms the basis of a basic operation scenario library. For example, the route switching scenario is constructed by simulating a user clicking a route navigation button, triggering the creation and destruction of route components, and using `Puppeteer.page.click(selector)` and `page.waitForNavigation()` to implement the route switching scenario. The component show / hide scenario is constructed by simulating a user clicking a button to control the display / hide of the `v-if` component, triggering a state change using `page.click(selector)`, and confirming the component state using `page.waitForSelector(selector, { visible: true / false})`. The list refresh scenario is constructed by simulating a user triggering a list data refresh, executing a Vue instance method using `page.evaluate()` to trigger the recreation of list item components. The form interaction scenario is constructed by simulating a user entering form content and submitting the form, triggering state changes and lifecycle events for the form component and its associated child components.

[0146] When updating LeakMap, the Puppeteer controller receives the `created` (component creation) event, adds a new entry to LeakMap, initializes the `componentName`, `lifecycleState`, `domPath`, and `createTime` fields, sets `destroyTime` to null, and sets `snapshotIds` to an empty array. After a memory snapshot is collected, the snapshot ID (Identity document) is added to the `snapshotIds` array of the corresponding component entry, establishing the association between the component and the memory snapshot.

[0147] Based on the above scheme, some operation sequences can be dynamically loaded from the structured operation log based on probability weights or a completely random strategy. New test case combinations can be generated based on the loaded operation sequences and the basic operation scenario library. The specific steps include: (1) Initialize the scenario pool: Mark the preset basic scenarios and the scenarios in the historical operation log with weights respectively; (2) Scenario selection: Randomly select the scenario type according to the weight. If a historical scenario is selected, randomly select 1-5 consecutive operation sequences from the historical operation log; (3) Scenario arrangement: Arrange the selected scenarios in chronological order to ensure that the operation logic of adjacent scenarios is coherent; (4) Operation execution: The Puppeteer control terminal executes the operation according to the arranged scenario sequence, synchronously records the operation time and the triggered component events, and realizes diversified user behavior simulation. Among them, the basic scenario can be a route switching scenario or a pop-up display / hide scenario; the scenario weight can be set according to actual needs. The operation logic coherence can be: "Route switching → list refresh" is reasonable, "Pop-up close → route switching" is reasonable.

[0148] Listen for the `mounted` event of the component under test. After a first preset time delay following the `mounted` event trigger, call the snapshot generation function of the headless browser controller to generate a heap snapshot corresponding to the `mounted` event. Record the snapshot ID and snapshot path of the heap snapshot corresponding to the `mounted` event in the `snapshotIds` field of the corresponding component in the leak list `LeakMap`. The first preset time can be 500ms. Listen for the `destroyed` event of the component under test. After the destruction timer triggers, wait for a second preset time, call the snapshot generation function of the headless browser controller to generate a heap snapshot corresponding to the `destroyed` event, and record the snapshot ID and snapshot path of the heap snapshot corresponding to the `destroyed` event in the `snapshotIds` field of the corresponding component in `LeakMap`. The second preset time can be 200ms.

[0149] Based on the target detection environment, a target identifier generation algorithm is determined from candidate identifier generation algorithms, and a unique component identifier is generated according to the target identifier generation algorithm. Candidate identifier generation algorithms include: timestamp and random string algorithms, hash digest algorithms, and universally unique identification code algorithms based on random numbers. A structured operation log is determined based on the historical interaction event sequence generated after the user's basic operation scenario and the component creation and destruction events that trigger the sample component. Furthermore, the mapping relationship between component information and the component's unique identifier can be determined.

[0150] Puppeteer collects the used heap memory of the component under test using the `page.memoryInfo()` method based on a preset memory sampling frequency. It stores the collected used heap memory and the corresponding sampling timestamp as an array, and generates a memory change curve based on the used heap memory and its corresponding sampling timestamp. The Puppeteer then determines whether `usedJSHeapSize` significantly decreases after the component is destroyed. If `usedJSHeapSize` does not significantly decrease after component destruction (i.e., the decrease in the memory change curve is less than a preset decrease threshold), or if `usedJSHeapSize` remains high after component destruction, an "abnormal memory retention" flag is added to the component under test. The Puppeteer then parses the first and second heap snapshots based on structured operation logs to determine the target structured data.

[0151] Based on preset node filtering criteria, the array of memory object nodes in the target structured data is filtered to determine component instance nodes. For the filtered Vue component instance nodes, an information mapping table named ComponentNodeMap is constructed, which includes the node ID (nodeId), the node memory size (size), the component DOM path (domPath) obtained from LeakMap, and the list of node IDs referencing the node (retainers).

[0152] Compare the component creation mapping table `Snapshot_InitComponentNodeMap` corresponding to the first structured data with the component destruction mapping table `Snapshot_DestroyComponentNodeMap` corresponding to the second structured data. If the destruction mapping table contains a node corresponding to the `vueLeakId` from the creation mapping table, and the node's memory size change is less than 10%, then the component corresponding to that `vueLeakId` is marked as a candidate memory leak component. A list of suspected leaks can be generated based on the number of components and total memory usage of the candidate memory leak components.

[0153] Before the destruction event of a candidate memory-leaking component is triggered, the `page.evaluate()` function of `Puppeteer` executes the Document Object Model (DOM) structure traversal logic, recording the structural information of the component's root DOM element and all its child elements. This records the initial DOM structure information after the component's creation. The recorded content includes: the tag name (`tagName`), attribute key-value pairs (`attributes`), the list of child elements (`childNodes`), and the element's XPath (`xpath`). Among these, the attribute key-value pairs include `data-vue-leak-id`, a property in Vue.js used to identify memory leaks. This property typically appears in development tools or debug logs, helping developers locate memory usage issues caused by improper component destruction.

[0154] After the destruction event of a candidate memory leak component is triggered, the document object model (DOM) structure traversal logic is executed to record the second model structure information of the DOM after the component's destruction. The second model structure information includes the tag name, attribute key-value pairs, child element list, and element path of the DOM after the destruction event. A tree-structured difference comparison algorithm is used to determine the model structure difference information based on the first and second model structure information. The model structure difference information includes: node addition information, node deletion information, node attribute change information, and child node change information. If, based on the model structure difference information, it is determined that the root DOM element and all its child elements of a candidate memory leak component have disappeared from the DOM tree (i.e., no corresponding node in the DOM snapshot after destruction), and the instance node of the candidate memory leak component still exists in Snapshot_Destroy, then the candidate memory leak component is determined to be the target memory leak component. If, based on model structure difference information, it is determined that the root DOM element of a candidate memory leak component has disappeared, but some child elements still exist in the DOM tree (e.g., the child elements of the pop-up content are not removed after the pop-up is closed, and there are memory nodes associated with the corresponding child elements in Snapshot_Destroy), then this candidate memory leak component is determined to be the target memory leak component, and this candidate memory leak component has a DOM fragment leak. If, based on model structure difference information, it is determined that the DOM structure of a candidate memory leak component is completely preserved (i.e., there is no difference in the DOM snapshot before and after the candidate memory leak component is destroyed), and the component instance node corresponding to data-vue-leak-id exists in Snapshot_Destroy, while the component's lifecycleState in LeakMap is "activated," then this candidate memory leak component does not have a memory leak problem. Furthermore, if, based on model structure difference information, it is determined that the DOM node of a candidate memory leak component exists but its attributes have changed, but some child nodes are retained, then it is necessary to further analyze whether this candidate memory leak node is the target memory leak node by combining the memory node reference relationships.

[0155] Extract the target object nodes corresponding to the target memory leak component from the parsed snapshot nodes array. Based on these target object nodes, initialize the node set of the memory reference graph ReferenceGraph. Extract the object edges corresponding to the target memory leak component from the edges array. Based on these object edges, initialize the edge set of ReferenceGraph. Supplement retainers information for each target object node in ReferenceGraph to form a complete reference chain between target object nodes, thus constructing a complete memory reference graph. The retainers information is obtained by associating the retainers field of the nodes array with the reference relationship in the edges array.

[0156] Triggered from the target object node corresponding to the target memory leak component, a reverse breadth-first search is performed to explore all node reference chains pointing to the target object node corresponding to the target memory leak component.

[0157] For example, performing a reverse breadth-first search mainly includes the following steps: (1) Initialize the queue: Add the target object node corresponding to the target memory leak component as the leak component instance node to the node queue, mark the reference level of the target object node as 0, and record the path as [leak node ID]; where the reference level is the reference step from the leak node; (2) Iterative expansion: Take the current node from the head of the node queue and traverse each reference node in its retainers list; (3) Node filtering: Filter out the nodes corresponding to the temporary objects inside the JavaScript engine based on the node filtering rules, and only keep the nodes corresponding to the user code objects related to the business logic; where the node filtering rules can be to filter out nodes whose node names contain keywords such as "Vue", "$bus", "Vuex", "setTimeout" or "EventListener"; (4) Path recording: If the reference node has not been visited, mark its reference level as "current node level + 1", and record the path as [reference node ID, ...current path], and add to the queue; (5) Terminate node traversal: The termination condition for node traversal is: the queue is cleared or the reference level reaches 10 levels, thereby avoiding infinite loops and covering the reference depth of most business scenarios; the queue is cleared when all reachable reference nodes have been traversed.

[0158] Based on the path function of each link in the node reference chain, the critical path is determined, and the critical nodes in the critical path are identified. Based on the memory usage of the critical nodes, intermediate nodes are determined from among the critical nodes. Intermediate nodes are the critical nodes with the largest memory usage. A path compression algorithm is used to compress the critical path based on the intermediate nodes to determine the compressed path. For example, if there are more than three non-critical nodes between two critical nodes, and the memory usage of each intermediate node is greater than 1KB, then only the intermediate node with the largest memory usage is retained, and the remaining nodes are collapsed. The collapsed data format is "... (N intermediate objects)".

[0159] If the top-level node of the compressed path is `Vue.prototype.$bus` and its reference type is "eventListener", then a component memory leak is confirmed. The root cause of the memory leak is that the event bound to the component on the data bus was not unbound when the component was destroyed, causing the data bus to hold a reference to the component. In this case, the top-level node of the path is the root node of the memory leak. If the top-level node of the path is `window.setInterval` and its reference type is "closure", then a component memory leak is confirmed. The root cause of the memory leak is that the `setInterval` timer created by the component was not cleared, and the timer callback closure references the component instance. In this case, the top-level node of the path is the root node of the memory leak. If the top-level node of the path is `window.globalCompCache` and its reference type is a property, then a component memory leak is confirmed. The root cause of the component memory leak is that the component instance is mounted to the global variable `window.globalCompCache` and the reference was not deleted when the component was destroyed. In this case, the top-level node of the path is the root node of the memory leak. Here, "the data bus holding a component reference" means that when communication between components is achieved through an additional Vue instance as an intermediary, this instance stores references to components or event listener relationships.

[0160] This code predefines common memory leak patterns in Vue.js 2 applications and stores the corresponding fields in a JSON-formatted knowledge base. This knowledge base is called the Leakage Pattern Knowledge Base. The knowledge base can be expanded through feedback from the reporting layer or manual additions.

[0161] The root cause information of memory leaks is vectorized, converting it into feature vectors of the same dimension as the leak pattern knowledge base, i.e., information feature vectors. The cosine similarity between these information feature vectors and the root cause information feature vectors stored in the leak pattern knowledge base is determined. The root cause information feature vectors corresponding to cosine similarities greater than a preset similarity threshold are identified as target feature vectors. The target feature vector corresponding to the largest cosine similarity value is identified as the final matching vector, and the memory leak pattern corresponding to the final matching vector is identified as the target memory leak pattern. If multiple cosine similarity values ​​are identical and all are the maximum value, the memory leak patterns are further filtered based on the leakSize and referenceDepth of the target memory leak component to determine the target memory leak pattern. If all cosine similarities are less than or equal to the preset similarity threshold, the target memory leak component is marked as having an "unknown leak pattern," and the reference path between the memory leak feature information and the target memory leak component is recorded for subsequent updates to the leak pattern knowledge base.

[0162] The system iterates through the description information in the leakage pattern knowledge base to determine the description information corresponding to the root cause information feature vector stored in the knowledge base as the feature description. If the memory leak root cause information matches the feature description, the candidate feature vector is determined to have a dimension of 1; otherwise, the information feature vector has a dimension of 0. The feature dimension weights of the candidate feature vectors are adjusted based on the root cause node type to determine the information feature vector.

[0163] Collect target detection data during the component memory leak detection process; target detection data includes detection metadata, leaked component data, memory monitoring data, memory leak analysis data, pattern matching data, and flame graph data of node reference chains; construct a visualization report based on the target detection data; the visualization report includes a memory leak risk summary dashboard, a view of the temporal relationship between leaked components and memory, and a visualized memory leak root cause reference chain; the memory leak risk summary dashboard includes global statistical indicator cards, a detection overview list, and a risk level distribution chart; based on the component description document of the target memory leak component and the template memory leak pattern, generate component remediation suggestions for the target memory leak component.

[0164] To achieve continuous system optimization, a feedback mechanism for newly added leakage patterns can be set after the visualization report is generated. This includes: pattern standardization processing, unknown pattern marking and manual confirmation, and knowledge base updates and verification. Unknown pattern marking and manual confirmation refers to the system backend standardizing the submitted new pattern information, automatically generating feature vectors, weight vectors, and matching confidence thresholds. The automatically generated feature vectors are based on the feature descriptions provided by the developer, the weight vectors can be preset, and the matching confidence threshold can be 0.65. Unknown pattern marking and manual confirmation means that for cases marked as "unknown leakage patterns" in the report, developers can use the "Mark as New Pattern" function in the report interface to supplement information such as the leakage pattern name, feature description, and remediation suggestions, and submit it to the system backend. Knowledge base updates and verification means that the standardized new pattern entries are added to the pattern knowledge base of the leakage analysis engine layer and verified in subsequent detection tasks. If three consecutive detections successfully match and the developer confirms the remediation is effective, the system automatically adjusts the weight vector and confidence threshold of the pattern to improve matching accuracy. If mismatches occur, the system re-optimizes the pattern features and parameters after receiving feedback from the developer.

[0165] The above-described component memory leak detection method generates a first snapshot corresponding to the component creation event when a component creation event of the component to be detected is detected, and generates a second snapshot corresponding to the component destruction event when a component destruction event of the component to be detected is detected. Based on the structured operation log, the first and second snapshots are parsed to determine the target structured data. The target structured data includes the first structured data corresponding to the first snapshot and the second structured data corresponding to the second snapshot. According to preset node filtering conditions, the array of memory object nodes in the target structured data is filtered to determine the component instance nodes, and an information mapping table between the unique identifier of the component instance node and the node information is constructed. The information mapping table includes the component creation post-mapping table corresponding to the first structured data and the component destruction post-mapping table corresponding to the second structured data. Candidate memory leak components are determined according to the information mapping table. The target memory leak component is determined from the candidate memory leak components according to the component creation post-document object model and the component destruction post-document object model of the candidate memory leak components. This solution addresses the shortcomings of existing memory leak detection tools, which rely on manual processes for memory snapshot collection and comparative analysis, and cannot establish a direct link between Vue.js 2 component lifecycles and memory objects, making it difficult to locate leaking components and sources, resulting in low detection efficiency. The proposed solution combines Puppeteer's automated operation and memory monitoring capabilities with Vue.js 2's component lifecycle and identification features. It solves the problem of traditional detection tools' inability to accurately link front-end framework components with memory objects, achieving fully automated detection from operation simulation, memory collection, leak analysis to report generation. This significantly improves the efficiency and accuracy of Vue.js 2 application component-level memory leak detection, reduces developers' detection and remediation costs, accurately locates memory leaks caused by unreleased resources within the component lifecycle, improves the accuracy of identifying component memory leak scenarios, and enhances the degree of automated component memory leak detection.

[0166] It should be understood that although the steps in the flowcharts of the embodiments described above are shown sequentially according to the arrows, these steps are not necessarily executed in the order indicated by the arrows. Unless explicitly stated herein, there is no strict order restriction on the execution of these steps, and they can be executed in other orders. Moreover, at least some steps in the flowcharts of the embodiments described above may include multiple steps or multiple stages. These steps or stages are not necessarily completed at the same time, but can be executed at different times. The execution order of these steps or stages is not necessarily sequential, but can be performed alternately or in turn with other steps or at least some of the steps or stages of other steps.

[0167] Based on the same inventive concept, this application also provides a component memory leak detection device for implementing the component memory leak detection method described above. The solution provided by this device is similar to the implementation described in the above method; therefore, the specific limitations in one or more component memory leak detection device embodiments provided below can be found in the limitations of the component memory leak detection method described above, and will not be repeated here.

[0168] In one embodiment, such as Figure 5 As shown, a component memory leak detection device is provided, including: a heap snapshot generation module 501, a structured data determination module 502, an information mapping table determination module 503, a candidate component determination module 504, and a memory leak component determination module 505, wherein:

[0169] The heap snapshot generation module 501 is used to generate a first heap snapshot corresponding to the component creation event of the component to be detected when a component creation event of the component to be detected is detected, and to generate a second heap snapshot corresponding to the component destruction event of the component to be detected when a component destruction event of the component to be detected is detected.

[0170] The structured data determination module 502 is used to parse the first pile snapshot and the second pile snapshot based on the structured operation log to determine the target structured data; the target structured data includes the first structured data corresponding to the first pile snapshot and the second structured data corresponding to the second pile snapshot;

[0171] The information mapping table determination module 503 is used to filter the array of memory object nodes in the target structured data according to preset node filtering conditions, determine the component instance nodes, and construct an information mapping table between the unique identifier of the component instance node and the node information; the information mapping table includes a component creation mapping table corresponding to the first structured data and a component destruction mapping table corresponding to the second structured data.

[0172] The candidate component determination module 504 is used to determine candidate memory leak components based on the information mapping table;

[0173] The memory leak component determination module 505 is used to determine the target memory leak component from the candidate memory leak components based on the component creation document object model and the component destruction document object model of the candidate memory leak components.

[0174] For example, the component memory leak detection device further includes:

[0175] The operation log generation module is used to determine the target identifier generation algorithm from the candidate identifier generation algorithms according to the target detection environment, and generate a unique component identifier according to the target identifier generation algorithm; the candidate identifier generation algorithms include: timestamp and random string algorithm, hash digest algorithm and random number-based universal unique identification code algorithm; and determine the structured operation log according to the historical interaction event sequence generated by the user after the component creation event and component destruction event that trigger the sample component based on the basic operation scenario.

[0176] For example, the structured data determination module 502 is specifically used for:

[0177] Based on a preset memory acquisition frequency, the used heap memory of the component under test is acquired, and a memory change curve is generated according to the used heap memory and the acquisition timestamp corresponding to the used heap memory.

[0178] If the decrease in the memory change curve is less than a preset decrease threshold, the first heap snapshot and the second heap snapshot are parsed based on the structured operation log to determine the target structured data; the target structured data includes the first structured data corresponding to the first heap snapshot and the second structured data corresponding to the second heap snapshot.

[0179] For example, the component memory leak detection device further includes:

[0180] The memory leak pattern determination module is used to construct a memory reference graph based on the target object nodes and object edges corresponding to the target memory leak component; perform a reverse breadth-first search based on the target object nodes corresponding to the target memory leak component to determine the node reference chain of the target object nodes of the target memory leak component; perform path compression on the node reference chain to determine a compressed path; determine the memory leak root source node from the compressed path, and determine the memory leak root source information based on the memory leak root source node; the memory leak root source information includes the path identifier of the compressed path, the node type of the memory leak root source node, and the component context of the target memory leak component; and determine the target memory leak pattern from a pre-built leak pattern knowledge base based on the memory leak root source information; the leak pattern knowledge base stores candidate memory leak types and root source information feature vectors corresponding to the candidate memory leak types.

[0181] For example, the memory leak pattern determination module is also specifically used for:

[0182] Based on the path function of each link path in the node reference chain, determine the critical path from the link path, and determine the critical node in the critical path;

[0183] Based on the memory usage of the key nodes, intermediate nodes are determined from the key nodes;

[0184] Based on the intermediate nodes, the critical path is compressed to determine the compressed path.

[0185] For example, the memory leak component determination module 505 is further configured to:

[0186] Before the destruction event of the candidate memory leak component is triggered, the document object model structure traversal logic is executed to record the first model structure information of the document object model after the component is created; the first model structure information includes the tag name, attribute key-value pairs, child element list and element path of the document object model after the component is created before the destruction event is triggered.

[0187] After the destruction event of the candidate memory leak component is triggered, the document object model structure traversal logic is executed to record the second model structure information of the document object model after the component is destroyed; the second model structure information includes the tag name, attribute key-value pairs, child element list and element path of the document object model after the component is destroyed after the destruction event is triggered.

[0188] A tree-structured difference comparison algorithm is used to determine model structure difference information based on the first model structure information and the second model structure information; the model structure difference information includes: node addition information, node deletion information, node attribute change information, and child node change information;

[0189] Based on the model structure difference information, the target memory leak component is determined from the candidate memory leak components.

[0190] For example, the memory leak component determination module 505 is further configured to:

[0191] Collect target detection data during the component memory leak detection process; the target detection data includes detection metadata, leaked component data, memory monitoring data, memory leak analysis data, pattern matching data, and flame graph data of node reference chains;

[0192] A visualization report is constructed based on the target detection data; the visualization report includes a memory leak risk summary dashboard, a view of the correlation between leaked components and memory timing, and a visualization of the root cause reference chain of memory leaks; the memory leak risk summary dashboard includes global statistical indicator cards, a detection overview list, and a risk level distribution chart;

[0193] Based on the component description document of the target memory leak component and the target memory leak pattern, component repair suggestions for the target memory leak component are generated.

[0194] In one embodiment, a computer device is provided, which may be a terminal, and its internal structure diagram may be as follows: Figure 6 As shown, the computer device includes a processor, memory, input / output interface, communication interface, display unit, and input device. The processor, memory, and input / output interface are connected via a system bus, and the communication interface, display unit, and input device are also connected to the system bus via the input / output interface. The processor provides computing and control capabilities. The memory includes non-volatile storage media and internal memory. The non-volatile storage media stores the operating system and computer programs. The internal memory provides an environment for the operation of the operating system and computer programs stored in the non-volatile storage media. The input / output interface is used for exchanging information between the processor and external devices. The communication interface is used for wired or wireless communication with external terminals; wireless communication can be achieved through Wi-Fi, mobile cellular networks, NFC (Near Field Communication), or other technologies. When executed by the processor, the computer program implements a component memory leak detection method. The display unit is used to form a visually visible image and can be a display screen, projection device, or virtual reality imaging device. The display screen can be an LCD screen or an e-ink screen. The input device of the computer device can be a touch layer covering the display screen, or buttons, trackballs, or touchpads set on the casing of the computer device, or external keyboards, touchpads, or mice, etc.

[0195] Those skilled in the art will understand that Figure 6 The structure shown is merely a block diagram of a portion of the structure related to the present application and does not constitute a limitation on the computer device to which the present application is applied. Specific computer devices may include more or fewer components than those shown in the figure, or combine certain components, or have different component arrangements.

[0196] In one embodiment, a computer device is provided, including a memory and a processor, wherein the memory stores a computer program, and the processor executes the computer program to perform the following steps:

[0197] Step 1: When a component creation event of the component to be detected is detected, generate a first set of snapshots corresponding to the component creation event of the component to be detected; when a component destruction event of the component to be detected is detected, generate a second set of snapshots corresponding to the component destruction event of the component to be detected.

[0198] Step 2: Based on the structured operation log, parse the first and second pile snapshots to determine the target structured data; the target structured data includes the first structured data corresponding to the first pile snapshot and the second structured data corresponding to the second pile snapshot;

[0199] Step 3: Based on the preset node filtering conditions, filter the array of memory object nodes in the target structured data to determine the component instance nodes, and construct an information mapping table between the unique identifier of the component instance node and the node information; the information mapping table includes a mapping table after the component is created corresponding to the first structured data and a mapping table after the component is destroyed corresponding to the second structured data;

[0200] Step 4: Identify candidate memory leak components based on the information mapping table;

[0201] Step 5: Based on the document object model after component creation and the document object model after component destruction of the candidate memory leak components, determine the target memory leak component from the candidate memory leak components.

[0202] In one embodiment, a computer-readable storage medium is provided having a computer program stored thereon, the computer program performing the following steps when executed by a processor:

[0203] Step 1: When a component creation event of the component to be detected is detected, generate a first set of snapshots corresponding to the component creation event of the component to be detected; when a component destruction event of the component to be detected is detected, generate a second set of snapshots corresponding to the component destruction event of the component to be detected.

[0204] Step 2: Based on the structured operation log, parse the first and second pile snapshots to determine the target structured data; the target structured data includes the first structured data corresponding to the first pile snapshot and the second structured data corresponding to the second pile snapshot;

[0205] Step 3: Based on the preset node filtering conditions, filter the array of memory object nodes in the target structured data to determine the component instance nodes, and construct an information mapping table between the unique identifier of the component instance node and the node information; the information mapping table includes a mapping table after the component is created corresponding to the first structured data and a mapping table after the component is destroyed corresponding to the second structured data;

[0206] Step 4: Identify candidate memory leak components based on the information mapping table;

[0207] Step 5: Based on the document object model after component creation and the document object model after component destruction of the candidate memory leak components, determine the target memory leak component from the candidate memory leak components.

[0208] In one embodiment, a computer program product is provided, including a computer program that, when executed by a processor, performs the following steps:

[0209] Step 1: When a component creation event of the component to be detected is detected, generate a first set of snapshots corresponding to the component creation event of the component to be detected; when a component destruction event of the component to be detected is detected, generate a second set of snapshots corresponding to the component destruction event of the component to be detected.

[0210] Step 2: Based on the structured operation log, parse the first and second pile snapshots to determine the target structured data; the target structured data includes the first structured data corresponding to the first pile snapshot and the second structured data corresponding to the second pile snapshot;

[0211] Step 3: Based on the preset node filtering conditions, filter the array of memory object nodes in the target structured data to determine the component instance nodes, and construct an information mapping table between the unique identifier of the component instance node and the node information; the information mapping table includes a mapping table after the component is created corresponding to the first structured data and a mapping table after the component is destroyed corresponding to the second structured data;

[0212] Step 4: Identify candidate memory leak components based on the information mapping table;

[0213] Step 5: Based on the document object model after component creation and the document object model after component destruction of the candidate memory leak components, determine the target memory leak component from the candidate memory leak components.

[0214] It should be noted that the user information (including but not limited to user device information, user personal information, etc.) and data (including but not limited to data used for analysis, data stored, data displayed, etc.) involved in this application are all information and data authorized by the user or fully authorized by all parties, and the collection, use and processing of related data must comply with the relevant laws, regulations and standards of the relevant countries and regions.

[0215] Those skilled in the art will understand that all or part of the processes in the above embodiments can be implemented by a computer program instructing related hardware. The computer program can be stored in a non-volatile computer-readable storage medium. When executed, the computer program can include the processes of the embodiments described above. Any references to memory, databases, or other media used in the embodiments provided in this application can include at least one of non-volatile and volatile memory. Non-volatile memory can include read-only memory (ROM), magnetic tape, floppy disk, flash memory, optical memory, high-density embedded non-volatile memory, resistive random access memory (ReRAM), magnetic random access memory (MRAM), ferroelectric random access memory (FRAM), phase change memory (PCM), graphene memory, etc. Volatile memory can include random access memory (RAM) or external cache memory, etc. By way of illustration and not limitation, RAM can take many forms, such as Static Random Access Memory (SRAM) or Dynamic Random Access Memory (DRAM). The databases involved in the embodiments provided in this application may include at least one type of relational database and non-relational database. Non-relational databases may include, but are not limited to, blockchain-based distributed databases. The processors involved in the embodiments provided in this application may be general-purpose processors, central processing units, graphics processing units, digital signal processors, programmable logic devices, quantum computing-based data processing logic devices, etc., and are not limited to these.

[0216] The technical features of the above embodiments can be combined in any way. For the sake of brevity, not all possible combinations of the technical features in the above embodiments are described. However, as long as there is no contradiction in the combination of these technical features, they should be considered to be within the scope of this specification.

[0217] The embodiments described above are merely illustrative of several implementation methods of this application, and while the descriptions are specific and detailed, they should not be construed as limiting the scope of this patent application. It should be noted that those skilled in the art can make various modifications and improvements without departing from the concept of this application, and these all fall within the protection scope of this application. Therefore, the protection scope of this application should be determined by the appended claims.

Claims

1. A method for detecting memory leaks in an assembly, the method comprising: The method comprises the following steps: When a component creation event of a to-be-detected component is detected, a first heap snapshot corresponding to the component creation event of the to-be-detected component is generated; when a component destruction event of the to-be-detected component is detected, a second heap snapshot corresponding to the component destruction event of the to-be-detected component is generated; Based on the structured operation log, the first heap snapshot and the second heap snapshot are parsed to determine target structured data; The target structured data comprises first structured data corresponding to the first heap snapshot and second structured data corresponding to the second heap snapshot; According to a preset node screening condition, memory object node arrays in the target structured data are screened to determine a component instance node, and an information mapping table between a node unique identifier and node information of the component instance node is constructed; the information mapping table comprises a component creation post-mapping table corresponding to the first structured data and a component destruction post-mapping table corresponding to the second structured data; According to the information mapping table, a candidate memory leakage component is determined; According to a component creation post-document object model and a component destruction post-document object model of the candidate memory leakage component, a target memory leakage component is determined from the candidate memory leakage component.

2. The method of claim 1, wherein, Further comprising: According to a target detection environment, a target identifier generation algorithm is determined from candidate identifier generation algorithms, and a component unique identifier is generated according to the target identifier generation algorithm; The candidate identifier generation algorithms comprise a timestamp and random string algorithm, a hash digest algorithm, and a universally unique identifier algorithm based on a random number; According to a user's historical interaction event sequence generated based on a basic operation scenario and a trigger sample component's component creation event and component destruction event, a structured operation log is determined.

3. The method of claim 1, wherein, Based on the structured operation log, the first heap snapshot and the second heap snapshot are parsed to determine target structured data, comprising: Based on a preset memory collection frequency, used heap memory of the to-be-detected component is collected, and a memory change curve is generated according to the used heap memory and a collection timestamp corresponding to the used heap memory; If a descending amplitude of the memory change curve is less than a preset descending amplitude threshold, the first heap snapshot and the second heap snapshot are parsed based on the structured operation log to determine target structured data; the target structured data comprises first structured data corresponding to the first heap snapshot and second structured data corresponding to the second heap snapshot.

4. The method of claim 1, wherein, Further comprising: According to target object nodes and object edges corresponding to the target memory leakage component, a memory reference graph is constructed; According to target object nodes corresponding to the target memory leakage component, a reverse breadth-first search is performed on the memory reference graph to determine a node reference chain of the target object nodes of the target memory leakage component; The node reference chain is path compressed to determine a compressed path; A memory leakage root node is determined from the compressed path, and memory leakage root information is determined according to the memory leakage root node; the memory leakage root information comprises a path identifier of the compressed path, a node type of the memory leakage root node, and a component context of the target memory leakage component. According to the memory leakage root information, a target memory leakage mode is determined from a pre-constructed leakage mode knowledge base; the leakage mode knowledge base stores candidate memory leakage types and root information feature vectors corresponding to the candidate memory leakage types.

5. The method of claim 4, wherein, The node reference chain is path compressed to determine a compressed path, including: According to the path function of each link path in the node reference chain, a critical path is determined from the link path, and a critical node in the critical path is determined; Based on the node occupation memory of the critical node, an intermediate node is determined from the critical node; Based on the intermediate node, the critical path is path compressed to determine a compressed path.

6. The method of claim 1, wherein, According to the component creation post-document object model and the component destruction post-document object model of the candidate memory leakage component, a target memory leakage component is determined from the candidate memory leakage component, including: Before the destruction event of the candidate memory leakage component is triggered, a document object model structure traversal logic is executed to record first model structure information of the component creation post-document object model; the first model structure information includes tag names, attribute key-value pairs, child element lists, and element paths of the component creation post-document object model before the destruction event is triggered; After the destruction event of the candidate memory leakage component is triggered, a document object model structure traversal logic is executed to record second model structure information of the component destruction post-document object model; the second model structure information includes tag names, attribute key-value pairs, child element lists, and element paths of the component destruction post-document object model after the destruction event is triggered; Using a tree structure difference comparison algorithm, model structure difference information is determined according to the first model structure information and the second model structure information; the model structure difference information includes node addition information, node deletion information, node attribute change information, and child node change information; According to the model structure difference information, a target memory leakage component is determined from the candidate memory leakage component.

7. The method of claim 6, wherein, Further comprising: Collecting target detection data in a component memory leakage detection process; the target detection data includes detection meta-information, leakage component data, memory monitoring data, memory leakage analysis data, pattern matching data, and flame graph data of a node reference chain; According to the target detection data, a visual report is constructed; the visual report includes a memory leakage risk summary dashboard, a leakage component and memory time sequence correlation view, and a visual memory leakage root reference chain; The memory leakage risk summary dashboard includes a global statistical indicator card, a detection profile list, and a risk level distribution graph; Based on the component description document of the target memory leakage component and the target memory leakage mode, a component repair suggestion for the target memory leakage component is generated.

8. An assembly memory leak detection apparatus, comprising: The component memory leakage detection device comprises: A heap snapshot generation module configured to generate a first heap snapshot corresponding to a component creation event of a to-be-detected component when detecting the component creation event of the to-be-detected component, and generate a second heap snapshot corresponding to a component destruction event of the to-be-detected component when detecting the component destruction event of the to-be-detected component; The structured data determining module is configured to parse the first heap snapshot and the second heap snapshot based on a structured operation log to determine target structured data, wherein the target structured data comprises first structured data corresponding to the first heap snapshot and second structured data corresponding to the second heap snapshot. The information mapping table determining module is configured to filter memory object node arrays in the target structured data according to a preset node filtering condition to determine component instance nodes and construct an information mapping table between node unique identifiers and node information of the component instance nodes, wherein the information mapping table comprises a component creation post-mapping table corresponding to the first structured data and a component destruction post-mapping table corresponding to the second structured data. The candidate component determining module is configured to determine candidate memory leakage components according to the information mapping table. The memory leakage component determining module is configured to determine target memory leakage components from the candidate memory leakage components according to a component creation post-document object model and a component destruction post-document object model of the candidate memory leakage components. 9.A computer device, comprising a memory and a processor, wherein the memory stores a computer program, and the computer device is configured to perform the method according to any one of claims 1-8 when the computer program is executed by the processor. The computer program is executed by the processor to implement the steps of the method in any one of claims 1 to 7.

10. A computer-readable storage medium having stored thereon a computer program, characterized in that, The computer program is executed by the processor to implement the steps of the method in any one of claims 1 to 7.

Images