A method for detecting memory leaks in web applications using Proxy objects

Abstract

This invention relates to a method for detecting memory leaks in web applications using a proxy object. The method includes: starting a network proxy; launching a browser according to user configuration; intercepting browser requests; the network proxy translating the JavaScript code of the target webpage and returning it to the browser; and running a leak detection algorithm to identify the leak point. The advantages of this invention are: instead of analyzing the running memory heap to find the memory leak point, this invention analyzes the object tree to find objects with rapidly growing attributes, thereby confirming the leak point. This significantly reduces the overhead of memory heap analysis, saves time, and overcomes the time-consuming shortcomings of commonly used dynamic analysis methods. Taking a typical single-page web page as an example, the analysis of the object tree can be completed in seconds.

Description

Technical Field

[0001] This invention relates to the field of memory leak detection technology, and more specifically, to a method for detecting memory leaks in web applications using a Proxy object. Background Technology

[0002] Web applications are now widely used, but memory leaks caused by them remain a major cause of performance degradation in web application systems. Web browsers themselves consume a significant amount of user memory, and memory leaks further increase this consumption. When memory consumption reaches a certain level, the browser will increase the frequency of memory reclamation to improve the operating environment, but this slows down both the browser and the web application, resulting in lag. Furthermore, web applications may also have memory that cannot be reclaimed by the browser for various reasons. As this unreclaimed memory accumulates, the web application, and even the browser itself, may crash due to memory exhaustion. Therefore, addressing memory leaks is a crucial aspect of improving the stability of web applications.

[0003] There are two main types of memory detection algorithms, both domestic and international: static analysis and dynamic analysis.

[0004] Static analysis involves analyzing the causes of leaks at the source code level, or generating a dominator tree from the object graph in the program heap and analyzing the dominator tree to find the source of the leak, or pre-setting several common JavaScript memory leak patterns and finding the cause of the memory leak through pattern matching. Static methods have poor adaptability, low accuracy and detection rate.

[0005] Dynamic analysis involves driving the application's memory usage and analyzing the difference before and after runtime to identify memory leaks. A common and effective method is based on the fundamental fact that users frequently return to similar visual states in modern websites (e.g., email applications often return to the main email interface), and that two visits to similar visual states consume roughly the same amount of memory. The method uses the continuous increase in memory usage between visits as an indicator of memory leaks. However, this still requires writing test case scripts to drive the visual states, and due to the limitations of dynamic analysis algorithms, it requires repeatedly driving the page back to the same visual state, which is time-consuming from returning to the original page to detection and analysis. Detecting memory leaks on a single page (excluding interactions) can take up to 5 minutes, which is unacceptable for multi-page applications. Other improved methods, such as memory leak testing acceleration techniques based on script prediction and reorganization, attempt to predict functional test scripts more likely to cause memory leaks and detect leak points through machine learning methods and script reorganization optimization methods. However, machine learning methods require large datasets of test cases, limiting their applicability and actual accuracy after training.

[0006] In general, dynamic analysis is limited by test cases and can only detect leaks within the code covered by those test cases. Static analysis, on the other hand, is not limited by test cases, but it is unsuitable for dynamic languages ​​like JavaScript, as it typically takes a long time to run and has low accuracy. Summary of the Invention

[0007] The purpose of this invention is to address the shortcomings of existing technologies by proposing a method for detecting memory leaks in web applications using Proxy objects.

[0008] Firstly, a method for detecting memory leaks in web applications using Proxy objects is provided, including:

[0009] S1. Start the network proxy;

[0010] S2. Launch the browser according to the user configuration;

[0011] S3. By intercepting the browser's request, the network proxy will translate the JavaScript code of the target webpage and return it to the browser.

[0012] S4. Run the leak detection algorithm to find the leak point.

[0013] Preferably, S4 includes:

[0014] S401, Code Injection: Injecting global helper functions and global variables;

[0015] S402, Code Translation: Convert the scope, transform the scope into a direct object form, and maintain it on an object tree. The root node of this object tree is the global scope.

[0016] S403, Object Growth Marker: After each state iteration, start from the global scope and traverse all proxied objects to find objects with rapidly growing attributes, thereby identifying leak points;

[0017] S404, Stack Trace Generation: When running an extra loop, the network agent matches the current assignment path against the leaked object, and captures the current stack information if the match is successful.

[0018] S405, Output: Read stack trace information, generate file source mapping during translation, find the original code line and column, read the corresponding score information, infer the leak type, and output the final result.

[0019] Preferably, in S401, the global auxiliary function is used to create a new object proxy, create a function scope, traverse all objects, mark the number of global object attributes, calculate the average growth trend of the attribute entries of the leaked object, and generate a leak report function; the global variables include the global scope object, the leak information object, and the global scope original attribute object.

[0020] As a preferred option, S4 also includes:

[0021] Leakage assessment: Traverse the global object tree, evaluate the historical list of the number of attribute entries marked as growing objects, obtain the average growth trend of the attribute entries, and rank them to distinguish the importance of the leak.

[0022] As a preferred option, S4 also includes:

[0023] Leakage analysis: Starting from the scope category, the type of each object is marked during the generation and maintenance of the object tree; if a global object leaks, it is considered a global cache leak; if an object within a function leaks, it is considered a closure leak.

[0024] Preferably, in S2, an input script is used to drive the web page to perform state transitions. The input script constructs a state transition list, which consists of two parts: a check function and a control statement. The former checks whether the current state is ready, and the latter drives the page to enter the next state in the loop list. By driving the state transition list, the page is driven back to the same page state multiple times according to other auxiliary parameters provided by the input script.

[0025] As a preferred option, in S401, a file source mapping is established to record the memory correspondence of the program before and after code injection.

[0026] Preferably, in S405, the final output includes the access path of the leaked object in the object tree, the leak's stack trace information, the leak type information, the leak score, and the leak-related source code.

[0027] Secondly, an apparatus for detecting web application memory leaks using a Proxy object is provided, for executing any of the methods for detecting web application memory leaks using a Proxy object as described in the first aspect, including:

[0028] The first startup module is used to start the network proxy;

[0029] The second startup module is used to launch the browser according to the user's configuration.

[0030] The intercept module is used to intercept browser requests. The network proxy will translate the JavaScript code of the target webpage and return it to the browser.

[0031] The detection module is used to run leak detection algorithms to find leak points.

[0032] Thirdly, a computer storage medium is provided, wherein a computer program is stored therein; when the computer program is run on a computer, the computer executes the method for detecting web application memory leaks using a Proxy object as described in any of the first aspects.

[0033] The beneficial effects of this invention are:

[0034] 1. This invention does not analyze the running memory heap to find memory leaks, but rather analyzes the object tree to identify objects with rapidly growing attributes, thereby confirming leaks. This significantly reduces the overhead of memory heap analysis, saves time, and overcomes the time-consuming nature of commonly used dynamic analysis methods. Taking a typical single-page web page (excluding all interactions) as an example, the analysis of the object tree can be completed in seconds.

[0035] 2. This invention is not a use case-based method, does not require the design of specific use cases, and does not require the use of algorithms such as machine learning to improve use cases.

[0036] 3. This invention has minimal impact on the original web application, which can achieve real-time detection or automatic inspection. Attached Figure Description

[0037] Figure 1 This is an overall architecture diagram of a method for detecting memory leaks in web applications using Proxy objects;

[0038] Figure 2 A diagram illustrating the definition of input script and task configuration types;

[0039] Figure 3 This is a diagram of the code before translation;

[0040] Figure 4 This is a diagram of the translated code;

[0041] Figure 5 This is a schematic diagram of the output results. Detailed Implementation

[0042] The present invention will be further described below with reference to embodiments. The description of the embodiments below is only for the purpose of helping to understand the present invention. It should be noted that those skilled in the art can make several modifications to the present invention without departing from the principle of the present invention, and these improvements and modifications also fall within the protection scope of the claims of the present invention.

[0043] Example 1:

[0044] For dynamically typed languages ​​like JavaScript used in web applications, runtime memory usage analysis helps identify the causes and locations of memory leaks within the program. The analysis process should minimize disruption to the application's operation. Dynamic testing methods that rely on test cases should be avoided or minimized.

[0045] In response, this application provides a method for detecting memory leaks in web applications using Proxy objects. This method is a dynamic analysis method based on the JavaScript language itself, which does not require other programming language tools and runtime environments. Its basic idea is to monitor all JavaScript objects and continuously drive the web application back to the same state, and identify those objects whose attribute entries are constantly increasing, which can be considered as objects that have memory leaks.

[0046] For web applications, memory leaks can be considered as memory that is not released when the page returns to a similar visual state. For example, on an e-commerce website, if you add an item to an empty shopping cart, then clear it, and repeat this process multiple times, returning to the empty state, the data of the previously added item should be cleared. If the number of attributes in the data structure representing the shopping cart continues to increase, then this data structure can be considered to have a memory leak. JavaScript, in the ES2016 standard, provides an object called Proxy. Proxy can act as a proxy for objects, intercepting all assignment operations on the object. Therefore, this feature of Proxy can be utilized to obtain the stack trace information of the current assignment by setting an assignment interception function, thus determining the source of the assignment.

[0047] like Figure 1As shown in the embodiments of this application, the method for detecting web application memory leaks using a Proxy object includes:

[0048] S1. Start the network agent.

[0049] Specifically, it starts a network proxy library called Anyproxy to proxy the network traffic of the Chrome instance.

[0050] S2. Launch the browser according to the user configuration.

[0051] In S2, an input script is used to drive the web page to perform state transitions. The input script constructs a state transition list, which consists of two parts: a check function and a control statement. The former checks whether the current state is ready, and the latter drives the page to enter the next state in the loop list. By driving the state transition list, the page is driven back to the same page state multiple times according to other auxiliary parameters provided by the input script.

[0052] like Figure 2 As shown, the input script is a user-provided script used to drive the state transitions of a web page. It includes the initial link address for which memory leaks need to be found, a page loop list, the number of page loop iterations, the page opening timeout, the call cycle of the function to check if the page is ready, and a login helper function for pages requiring login. This embodiment of the application drives this list, and based on other auxiliary parameters provided by the input script, drives the page back to the same page state multiple times.

[0053] Specifically, this embodiment of the application selects the chrome-debugging-client library. This library starts a Chrome instance from the local Chrome default installation path and supports various Chrome startup initialization parameters. This method uses this library to start the Chrome instance at runtime and controls Chrome to open the target page and perform corresponding operations via the devtools-protocol protocol.

[0054] S3. By intercepting the browser's request, the network proxy will translate the JavaScript code of the target webpage and return it to the browser.

[0055] S4. Run the leak detection algorithm to find the leak point.

[0056] S4 includes:

[0057] S401, Code Injection: Injecting global helper functions and global variables; the global helper functions are used to create new object proxies, create function scopes, traverse all objects, mark the number of global object attributes, calculate the average growth trend of attribute entries of leaked objects, and generate a leak report function; global variables include global scope objects, leak information objects, and global scope primitive attribute objects. The injected global helper functions and objects have the function of interacting with both the transpiled code and the browser driver. The browser driver can complete the predetermined operations by running the helper functions.

[0058] Specifically, upon receiving an HTML request, a script tag is inserted at the very top of the HTML `<head>` tag. The content of this script tag contains global helper functions and variables for this method. Simultaneously, this method checks other non-link script tags in the HTML, retrieves their content, performs scope conversion, and returns data to the browser after code injection and translation. Upon receiving a JavaScript request, this method translates the code and returns the result.

[0059] Furthermore, the memory leak stems from the fact that many variables are cleared in their local scope, but their actual scope is the global scope; therefore, these variables are not truly cleared. Thus, it's necessary to search for and process these variables along the path from the local scope to the global scope. Similarly, the prototype chain in JavaScript is the path for function lookup. Both the scope and prototype chain are transformed into Proxy objects. When the network proxy intercepts a page, it injects these new objects into the existing page. Since code injection changes the source code and its memory usage, a source map must be established to record the memory mapping before and after code injection.

[0060] S402, Code Translation: Transforms the scope, converting it into a direct object form and maintaining it in an object tree, the root node of which is the global scope.

[0061] It should be noted that, in this embodiment, the browser driver module enters the page state defined by the input script. Upon first entering the page, this embodiment constructs an object tree from top to bottom for all objects on the page (including each scope, which is also converted into an actual object). All object access and settings on the page are proxied to this tree.

[0062] Figure 3 , Figure 4 The code before and after translation is shown respectively. Figure 4In this context, `scope` refers to the object representing the scope, with the first `scope` being the global scope. This scope is created during code injection. Within a function, the first line of code in each function is injected with this scope. Figure 4 The CreateFunctionScope function shown creates a scope proxy. All property declarations and references within the scope are cast to the proxy scope object.

[0063] To simulate the upward lookup behavior of scoped variables, the prototype of the proxy object of the inner scope in nested scopes is pointed to the proxy object of the parent scope. This approach makes property access proxying very natural and requires no additional code. However, when assigning values ​​to properties, the proxy must manually implement the upward lookup; otherwise, an assignment intended for the outer scope will be assigned to the inner scope. Therefore, this method generates its own property mapping table (a mapping of property to scope proxy object) when creating the scope and maintains it during assignment. When a child scope is created, the child scope pulls the property mapping table from the parent scope and maintains the property mapping table, while creating a new mapping table for itself, with the prototype referencing the parent mapping table. This method achieves fast scope lookup during assignment.

[0064] S403, Object Growth Marker: After each state iteration, the object property count marker iterates through all proxied objects from the global scope, obtains the list of object property names through Object.getOwnPropertyNames(), and then filters out the built-in auxiliary properties that start and end with a specific identifier or the number of property items and assigns them to the object's propertyNumber array. In the last additional run, this embodiment of the application marks the continuously growing path to the global leaks object by checking the changes in the number of propertyNumber values.

[0065] S404, Stack Trace Generation: During the execution of the extra loop, the network agent matches the current assignment path against leaks. If a match is found, the current stack information is captured using the Error.captureStackTrace API and updated into leaks. If the leaked values ​​are the same, then this stack trace is filtered out and no value is assigned.

[0066] S405, Output: The system reads stack trace information, generates a file source map during translation, locates the original code lines and columns, reads the corresponding score information, infers the leak type, and outputs the final result. The output includes the access path of the leaked object in the object tree, the leak's stack trace information, the leak type information, the leak score, and the leak-related source code.

[0067] Specifically, in this embodiment of the application, the stack trace information is read, the original code line and column are found by generating a SourceMap during translation, the corresponding score information is read, the leak type is inferred, and the final result is output. Figure 5 Showing Figure 2 The output after the above process includes four pieces of information: dummyPath, propertyNumber, growthRate, stackTraces, and type. dummyPath provides approximate location information for the leaked object, used to distinguish the source of the leak. propertyNumber is the number of leaked object properties detected in each run. stackTraces is the value distribution tracking information for the leaked object. growthRate is the average growth rate of the property, in percentage (%). type is the type of leak.

[0068] Example 2:

[0069] Based on Example 1, this application provides another method for detecting web application memory leaks using a Proxy object, including:

[0070] S1. Start the network proxy;

[0071] S2. Launch the browser according to the user configuration;

[0072] S3. By intercepting the browser's request, the network proxy will translate the JavaScript code of the target webpage and return it to the browser.

[0073] S4. Run the leak detection algorithm to find the leak point.

[0074] S4 includes:

[0075] S401, Code Injection: Injecting global helper functions and global variables;

[0076] S402, Code Translation: Convert the scope, transform the scope into a direct object form, and maintain it on an object tree. The root node of this object tree is the global scope.

[0077] S403, Object Growth Marker: After each state iteration, start from the global scope and traverse all proxied objects to find objects with rapidly growing attributes, thereby identifying leak points;

[0078] S404, Stack Trace Generation: When running an extra loop, the network agent matches the current assignment path against the leaked object, and captures the current stack information if the match is successful.

[0079] S405, Output: Read stack trace information, generate file source mapping during translation, find the original code line and column, read the corresponding score information, infer the leak type, and output the final result.

[0080] In addition, S4 also includes:

[0081] Leakage Assessment: Leakage assessment ranks identified leaks to differentiate their importance. Generally, memory leak assessment uses the amount of leakage, requiring analysis of heap usage under different conditions, which is undoubtedly a significant overhead. This method uses the average growth trend of attribute entries to evaluate the degree of leakage. The assessment algorithm traverses the global object tree, evaluating the historical list of attribute entries marked as growing objects to obtain the average growth trend of attribute entries.

[0082] Furthermore, S4 also includes:

[0083] Leakage Analysis: Leakage analysis begins with the scope category. During the generation and maintenance of the object tree, the type of each object is marked. The global scope is marked as `global`, the function scope is marked as `closure`, and objects are marked as `object`. If a global object leaks, it can be considered a global cache leak; if an object within a function leaks, it can be considered a closure leak. More detailed leak types are not analyzed in this embodiment. Therefore, this embodiment provides a rough labeling of leak types.

[0084] It should be noted that the parts in this embodiment that are the same as or similar to those in Embodiment 1 can be referred to each other, and will not be repeated in this application.

[0085] Example 3:

[0086] Based on Embodiment 1, Embodiment 3 of this application provides an apparatus for detecting web application memory leaks using a Proxy object, comprising:

[0087] The first startup module is used to start the network proxy;

[0088] The second startup module is used to launch the browser according to the user's configuration.

[0089] The intercept module is used to intercept browser requests. The network proxy will translate the JavaScript code of the target webpage and return it to the browser.

[0090] The detection module is used to run leak detection algorithms to find leak points.

[0091] Specifically, the device provided in this embodiment is the same as the device corresponding to the method provided in embodiment 1. Therefore, the parts in this embodiment that are the same as or similar to those in embodiment 1 can be referred to each other, and will not be described again in this application.

[0092] In summary, this invention proposes a method for detecting memory leaks in web applications using a Proxy object. By transcoding JavaScript code and transferring all variable accesses to the proxy object, operations on the target object can be intercepted, enabling real-time monitoring of assignments and call stack analysis, thereby accurately locating leak points. Because it fully leverages the capabilities of JavaScript itself, this method has strong adaptability; only the same logic needs to be implemented for proxies of different objects, facilitating subsequent optimization and improvement of the algorithm.

Claims

1. A method for detecting memory leaks in web applications using a Proxy object, characterized in that, include: S1. Start the network proxy; S2. Launch the browser according to the user configuration; S3. By intercepting the browser's request, the network proxy will translate the JavaScript code of the target webpage and return it to the browser; S4. Run the leak detection algorithm to find the leak point; S4 includes: S401, Code Injection: Injecting global helper functions and global variables; S402, Code Translation: Convert the scope, transform the scope into a direct object form, and maintain it on an object tree. The root node of this object tree is the global scope. S403, Object Growth Marker: After each state iteration, start from the global scope and traverse all proxied objects to find objects with rapidly growing attributes, thereby identifying leak points; S404, Stack Trace Generation: When running an extra loop, the network agent matches the current assignment path against the leaked object, and captures the current stack information if the match is successful. S405, Output: Read stack trace information, generate file source mapping during translation, find the original code line and column, read the corresponding score information, infer the leak type, and output the final result.

2. The method for detecting web application memory leaks using a Proxy object according to claim 1, characterized in that, In S401, the global auxiliary function is used to create a new object proxy, create a function scope, traverse all objects, mark the number of global object attributes, calculate the average growth trend of the attribute entries of the leaked object, and generate a leak report function. Global variables include global scope objects, leaked information objects, and global scope primitive property objects.

3. The method for detecting web application memory leaks using a Proxy object according to claim 2, characterized in that, S4 also includes: Leakage assessment: Traverse the global object tree, evaluate the historical list of the number of attribute entries marked as growing objects, obtain the average growth trend of the attribute entries, and rank them to distinguish the importance of the leak.

4. The method for detecting web application memory leaks using a Proxy object according to claim 3, characterized in that, S4 also includes: Leakage analysis: Starting from the scope category, the type of each object is marked during the generation and maintenance of the object tree; if a global object leaks, it is considered a global cache leak; if an object within a function leaks, it is considered a closure leak.

5. The method for detecting web application memory leaks using a Proxy object according to claim 4, characterized in that, In S2, an input script is used to drive the web page to perform state transitions. The input script constructs a state transition list, which consists of two parts: a check function and a control statement. The former checks whether the current state is ready, and the latter drives the page to enter the next state in the loop list. By driving the state transition list, the page is driven back to the same page state multiple times according to other auxiliary parameters provided by the input script.

6. The method for detecting web application memory leaks using a Proxy object according to claim 5, characterized in that, In S401, a file source mapping is established to record the memory correspondence of the program before and after code injection.

7. The method for detecting web application memory leaks using a Proxy object according to claim 6, characterized in that, In S405, the final output includes the access path of the leaked object in the object tree, the leak's stack trace information, the leak type information, the leak score, and the leak-related source code.

8. A device for detecting memory leaks in web applications using a Proxy object, characterized in that, The method for performing web application memory leak detection using a Proxy object as described in any one of claims 1 to 7 includes: The first startup module is used to start the network proxy; The second startup module is used to launch the browser according to the user's configuration. The intercept module is used to intercept browser requests. The network proxy will translate the JavaScript code of the target webpage and return it to the browser. The detection module is used to run leak detection algorithms to find leak points.

9. A computer storage medium, characterized in that, The computer storage medium stores a computer program; when the computer program is run on the computer, it causes the computer to execute the method for detecting web application memory leaks using a Proxy object as described in any one of claims 1 to 7.

Images