Front-end item cleaning method and device, equipment and storage medium
Through an automated front-end project cleaning method, the coordinated work of the task process, the main process and the rendering process is leveraged to achieve efficient and accurate front-end project cleaning, reducing human resources dependence, and optimizing project quality and storage space.
Patent Information
- Application Number
- CN202510270626.2
- Authority / Receiving Office
- CN · China
- Patent Type
- Applications(China)
- Current Assignee / Owner
- Filing Date
- 2025-03-07
- Publication Date
- 2025-07-22
AI Technical Summary
In the prior art, the cleaning of front-end project projects depends on human resources, resulting in high cost and low accuracy of project cleaning.
The task process receives the user equipment cleaning request and generates a cleaning task. The main process parses the target front-end project and recognizes the objects to be cleaned, performs cleaning operations, and displays it through the rendering process to achieve an automated and accurate cleaning process.
Reliance on human resources is reduced, efficiency and accuracy of front-end project cleaning is improved, storage space is optimized, and errors and development costs are reduced.
Smart Images

Figure CN120353512A_ABST
Abstract
Description
Technical Field
[0001] This application relates to the field of computer technology, and particularly to a method, apparatus, electronic device, and computer-readable storage medium for cleaning a front-end project. Background Art
[0002] Front-end project engineering is often developed collaboratively by multiple teams, which makes the front-end project engineering relatively complex. Therefore, cleaning the redundant data in the front-end project engineering is an important factor in improving the quality of the front-end project engineering and optimizing the storage space of the front-end project engineering.
[0003] Currently, the cleaning of front-end project engineering is usually completed manually. Managers can manually or with the help of some scripts to achieve the cleaning of front-end project engineering.
[0004] However, in the current solutions, there is a large dependence on human resources, which increases the project cleaning cost and reduces the accuracy of project cleaning. Summary of the Invention
[0005] Embodiments of this application provide a method and apparatus for cleaning a front-end project to solve the problems in the prior art.
[0006] In a first aspect, embodiments of this application provide a method for cleaning a front-end project, the method including:
[0007] Based on a target front-end project selected by a user, receive a cleaning request sent by a user device through a task process, where the cleaning request carries cleaning configuration information;
[0008] Generate a cleaning task for the target front-end project through the task process according to the cleaning configuration information in the cleaning request;
[0009] In response to the execution of the cleaning task, parse the target front-end project by a main process according to the cleaning configuration information, and identify objects to be cleaned from the parsing result;
[0010] Execute a cleaning operation on the objects to be cleaned by the main process according to the cleaning configuration information, obtain a cleaning result, and perform rendering and display through a rendering process.
[0011] In a second aspect, embodiments of this application provide a cleaning apparatus for a front-end project, the apparatus including:
[0012] A receiving module, configured to receive a cleaning request sent by a user device through a task process based on a target front-end project selected by a user, where the cleaning request carries cleaning configuration information;
[0013] A generation module, configured to generate a cleaning task for the target front-end project through the task process according to the cleaning configuration information in the cleaning request;
[0014] An execution module, configured to, in response to the execution of the cleaning task, parse the target front-end project through the main process according to the cleaning configuration information, and identify objects to be cleaned from the parsing result;
[0015] A display module, configured to perform a cleaning operation on the objects to be cleaned through the main process according to the cleaning configuration information, obtain a cleaning result, and perform rendering and display through the rendering process.
[0016] In a third aspect, an embodiment of the present application further provides an electronic device, including a processor;
[0017] A memory for storing executable instructions of the processor;
[0018] Wherein, the processor is configured to execute the instructions to implement the method in the first aspect.
[0019] In a fourth aspect, an embodiment of the present application further provides a computer-readable storage medium, when instructions in the computer-readable storage medium are executed by a processor of an electronic device, enabling the electronic device to execute the method in the first aspect.
[0020] Based on the target front-end project selected by the user, an embodiment of the present application receives a processing request sent by the user device through the task process, then generates a cleaning task for the target front-end project through the task process according to the cleaning request, and finally, in response to the execution of the cleaning task, performs a cleaning operation on the target front-end project through the main process, obtains a cleaning result, and performs rendering and display through the rendering process. During the entire cleaning process, the cleaning of the front-end project can be realized automatically and accurately, reducing the dependence on human resources.
[0021] The above description is only an overview of the technical solution of the present application. In order to be able to understand the technical means of the present application more clearly, it can be implemented according to the content of the specification. And in order to make the above and other purposes, features and advantages of the present application more obvious and understandable, the specific embodiments of the present application are hereinafter specifically exemplified. BRIEF DESCRIPTION OF THE DRAWINGS
[0022] Figure 1 is a flowchart of the steps of a method for cleaning a front-end project provided by an embodiment of the present application;
[0023] Figure 2 is a flowchart of the use of a comprehensive front-end project cleaning tool provided by an embodiment of the present application;
[0024] Figure 3It is a flowchart of the implementation of a method for cleaning a front-end project provided by an embodiment of the present application;
[0025] Figure 4 It is a framework diagram of the implementation of a front-end project cleaning tool provided by an embodiment of the present application;
[0026] Figure 5 It is a framework diagram of the implementation of a strategy engine for a front-end project provided by an embodiment of the present application;
[0027] Figure 6 It is a framework diagram of the implementation of another front-end project cleaning tool provided by an embodiment of the present application;
[0028] Figure 7 It is a block diagram of a cleaning device for a front-end project provided by an embodiment of the present application;
[0029] Figure 8 It is a block diagram of a device of the present application;
[0030] Figure 9 It is a schematic diagram of the structure of a server in some embodiments of the present application. Detailed implementation manners
[0031] Next, the technical solutions in the embodiments of the present application will be clearly and completely described in conjunction with the accompanying drawings in the embodiments of the present application. Obviously, the described embodiments are some, but not all, of the embodiments of the present application. All other embodiments obtained by those of ordinary skill in the art based on the embodiments of the present application without creative efforts shall fall within the protection scope of the present application.
[0032] The terms "first", "second", etc. in the specification and claims of the present application are used to distinguish similar objects, rather than to describe a specific order or sequence. It should be understood that such data can be interchanged under appropriate circumstances so that the embodiments of the present application can be implemented in an order other than those illustrated or described herein, and the objects distinguished by "first", "second", etc. are generally of the same type, and the number of objects is not limited. For example, the first object can be one or more. In addition, the term " / and" in the specification and claims is used to describe the association relationship of associated objects, indicating that three relationships can exist. For example, A and / or B can represent: A exists alone, A and B exist simultaneously, and B exists alone. The character " / " generally represents an "or" relationship between the associated objects before and after. The term "multiple" in the embodiments of the present application refers to two or more, and other quantifiers are similar.
[0033] Figure 1 , It is a step flowchart of a method for cleaning a front-end project provided by an embodiment of the present application. As Figure 1 shown, the method may include:
[0034] Step 101: Based on the target front-end project selected by the user, receive a cleaning request sent by the user device through the task process, where the cleaning request carries cleaning configuration information.
[0035] Front-end development refers to the process of creating front-end interfaces such as World Wide Web (WEB) pages or application programs and presenting them to users. Through Hyper Text Markup Language (HTML), Cascading Style Sheets (CSS), JavaScript (a dynamic programming language), and various derived technologies, frameworks, and solutions, the user interface interaction of Internet products is realized.
[0036] A front-end project is a computer engineering project created through the front-end development process. A front-end project can include front-end resources such as pictures, code, scripts, style files, etc. The core value of cleaning a front-end project lies in dealing with a large number of redundant files and code problems caused by multi-person collaborative development and poor management of common modules during the continuous development and iteration of the front-end project. These problems seriously reduce the development efficiency and experience. Therefore, implementing the cleaning of the front-end project is a key strategy to optimize the structure of the front-end project and significantly improve the development efficiency, which can effectively solve the above problems and ensure the high efficiency and quality of the front-end project development.
[0037] Refer to Figure 2 , the embodiments of this application aim to provide a comprehensive front-end project cleaning tool, including a user interface, a controller, a project scanning module, a cleaning module (file cleaning module, code cleaning module, dependency cleaning module), and a log and report module. By integrating a comprehensive cleaning tool and adopting a visual interface interaction method, the front-end project can be comprehensively and systematically cleaned, and specific improvements are focused on aspects such as file cleaning, code cleaning, and dependency cleaning, so that developers do not need to spend a lot of time and effort to handle these problems, improving the development efficiency and reducing the project cost.
[0038] Among them, the user interface: is the entry for the user to interact with the front-end project cleaning tool, allowing the user to input the project path, select the cleaning type to be performed (such as file cleaning, code cleaning, dependency cleaning, etc.), view the cleaning report, and configure the cleaning rules.
[0039] The controller: as the core control unit, is responsible for receiving user input, calling each cleaning module, and coordinating the workflow between them. The controller will decide the next operation based on the user's operation and the results of the module to ensure the orderly progress of the entire cleaning process.
[0040] Project Scanning Module: Traverse the directory of the target front-end project specified by the user, parse the file types (such as HTML, CSS, JavaScript, images, etc.), collect file information (such as file size, modification time, reference relationship, etc.), and provide basic data for the subsequent cleaning module.
[0041] Redundant File List: According to the information provided by the project scanning module, find unused files (such as files not referenced by any other files), temporary files (usually with specific suffixes, such as.tmp,.bak), and duplicate files (files with the same or similar content) in the target front-end project, and mark these files as redundant files.
[0042] Unused Code List: Analyze the code files in the target front-end project, including static analysis (such as using a syntax tree to analyze JavaScript code to find unused functions, variables, classes, etc.) and possible dynamic analysis (special handling for dynamic code), find the unused code and mark it.
[0043] Redundant Dependency List: Check the project's dependency management files (such as package.json, bower.json, etc.), analyze the usage of dependencies in the project code, find the unused dependencies and mark them as redundant dependencies.
[0044] Cleaning Operation: Receive the cleaning task list from the redundant file identification, unused code identification, and redundant dependency identification modules, and perform specific cleaning operations. At the same time, be responsible for handling backup and recovery operations in case the user needs to restore the cleaning results, and handle exceptions during the cleaning process (such as file deletion failure, permission issues, etc.).
[0045] Log and Report Module: Record the operation logs of the entire cleaning process, including which files / codes / dependencies were cleaned, the operation time, the operation results, etc. Generate a report based on the cleaning results for the user to view, and at the same time provide a log viewing function to facilitate the user to understand the cleaning process and solve possible problems.
[0046] Specifically, in this step, the front-end project cleaning tool of the embodiment of the present application can be used to maintain the front-end projects developed by each team and display these front-end projects in the visualization interface of the front-end project cleaning tool (such as displayed in the form of a list). The user can perform selection operations on the visualization interface based on the user device installed with the front-end project cleaning tool client, select the target front-end project to be cleaned from all front-end projects, and send a cleaning request from the user device to the server of the front-end project cleaning tool for processing. When the user starts the front-end project cleaning tool, the project path of the target front-end project can be input, and the front-end project cleaning tool will read the file and directory information under this project path for subsequent processing.
[0047] Further, the server of the front-end project cleaning tool can be designed as a layered architecture, specifically divided into a rendering process layer, a task process layer, and a main process layer. The rendering process layer, the task process layer, and the main process layer are decoupled from each other. The rendering process layer is mainly used to implement the visualization interface rendering of the client. The task process layer is mainly used to implement the establishment and scheduling of cleaning tasks. The main process layer is mainly used to implement the execution of cleaning tasks. The three layers are integrated to realize the core application of front-end project cleaning through a multi-layer architecture.
[0048] In the embodiment of the present application, the cleaning request of the client can be encapsulated into a general http request. This type of request supports the calls of the main process layer, the rendering process layer, and the task process layer to smooth out the differences in upper-layer calls.
[0049] The design advantage of the layered architecture is that since the front-end project cleaning tool needs to support cross-terminal use and there are differences in the implementation of some underlying modules on different operating systems, the architecture can be designed in layers during development and design. In this way, the top-down calls seem the same to the upper layer, and the underlying differences are eliminated. The implementation of the underlying modules can be strictly distinguished by directories, so that when developing a underlying function, each segment can be independent of each other.
[0050] Step 102: Generate a cleaning task for the target front-end project through the task process according to the cleaning configuration information in the cleaning request.
[0051] In the embodiment of the present application, the task process layer of the front-end project cleaning tool server can process the cleaning request sent by the user device, generate a cleaning task for the target front-end project, and through task scheduling and distribution, allocate the cleaning task to each sub-task center of the main process layer for the specific execution of the cleaning task. Among them, the cleaning task can have the cleaning configuration information in the cleaning request, and the cleaning configuration information adds policy control to the execution of the cleaning task.
[0052] Step 103: In response to the execution of the cleaning task, parse the target front-end project by the main process according to the cleaning configuration information, and identify the objects to be cleaned from the parsing results.
[0053] Step 104: Execute the cleaning operation on the objects to be cleaned by the main process according to the cleaning configuration information, obtain the cleaning result, and perform rendering and display through the rendering process.
[0054] In the embodiment of the present application, the task process layer can allocate cleaning tasks to each subtask center of the main process layer for specific execution of the cleaning tasks through task scheduling and distribution. Each subtask center of the main process layer can call the resources at the bottom layer of the front-end project cleaning tool to execute the cleaning tasks and return the cleaning results to the server of the front-end project cleaning tool to display the cleaning results in the visualization interface. That is, the implementation idea of the embodiment of the present application is that the user selects the target front-end project to be cleaned, sets the corresponding cleaning configuration information (or according to the default rules that have been configured), and then triggers the task process layer to schedule the splitting, collection, and distribution of the cleaning tasks; finally, each subtask center of the main process layer at the bottom layer processes the cleaning tasks. The main process layer can respond to the cleaning tasks, first parse the target front-end project according to the cleaning configuration information, and identify the objects to be cleaned from the parsing results, such as redundant code, redundant files, redundant dependencies, etc., and then execute the cleaning operations on the objects to be cleaned according to the cleaning strategy defined in the cleaning configuration information to obtain the cleaning results.
[0055] After obtaining the cleaning results, the main process layer can send them to the rendering process layer, and the rendering process renders and displays the cleaning results, finally completing the cleaning of the target front-end project.
[0056] Optionally, in the first embodiment of the present application, the cleaning configuration information includes file cleaning rules for the target front-end project; the cleaning tasks include file cleaning tasks; step 103 may specifically include sub-steps 1031-1033:
[0057] Sub-step 1031: Parse the target front-end project according to the file cleaning rules to obtain the project files included in the target front-end project.
[0058] Sub-step 1032: Determine candidate project files from all the project files according to the cleaning scope defined by the file cleaning rules.
[0059] Sub-step 1033: Use the candidate project files that are not referenced by other files, temporary candidate project files, and candidate project files with duplicate content as the objects to be cleaned.
[0060] In the first embodiment of the present application, for sub-steps 1031 - 1033, a file cleaning function can be integrated into the front-end project cleaning tool. The file cleaning function is designed to scan the files in the front-end project and identify the unused files for deletion and cleaning. Specifically, the task process of the front-end project cleaning tool can receive a cleaning request sent by the client to the target front-end project to be cleaned, and generate a file cleaning task for the target front-end project. The cleaning request can carry file cleaning rules for the target front-end project. The file cleaning rules configure the characteristics of the files to be cleaned (file type, format, etc.), time (creation time, modification time, etc.), directory, cleaning method (direct deletion, put into recycle bin), backup strategy (whether to backup), etc. These rules standardize and restrict the file cleaning process of the target front-end project, and these rules can be configured in the front-end project cleaning tool for subsequent cleaning of the files of the target front-end project based on the file cleaning rules.
[0061] Further, after the file cleaning task is scheduled and distributed through the task process layer, the file cleaning task can be assigned to the main process layer for execution. The main process layer first needs to parse the target front-end project and identify the objects to be cleaned from it. Specifically, the main process layer can first parse the target front-end project according to the file cleaning rules to obtain all the project files included in the target front-end project (such as HTML files, CSS files, JavaScript files, etc.), and then, according to the cleaning scope defined by the file cleaning rules, determine the candidate project files within the cleaning scope from all the project files. For example, assuming the cleaning scope defines a creation time range from October 1st to October 7th, and defines the cleaning of CSS file types, then the main process layer needs to find, from all the project files, the project files with a creation time between October 1st and October 7th and of CSS type as the subsequent project files.
[0062] After determining the candidate project files, the main process layer can screen the files among them, and regard the candidate project files not referenced by other files, temporary candidate project files, and candidate project files with duplicate content as the objects to be cleaned. Finally, the main process layer can perform the cleaning operation on the objects to be cleaned according to the cleaning configuration information, obtain the cleaning result and display it through the rendering process. That is, the front-end project cleaning tool can present the cleaning result to the user through the front-end interface. The cleaning result can record logs, and the logs include the content and operation time of the cleaning, and the logs can be stored locally or sent to a remote server for maintenance.
[0063] The file cleaning function for front-end projects can help maintain the health, stability, and efficiency of front-end projects. Its specific advantages include: 1. Improve performance: Cleaning unnecessary files, such as old caches and temporarily generated files during compilation, can reduce the size of front-end projects and improve the loading and running speeds of projects; 2. Reduce errors: Over time, some invalid or outdated files may accumulate in front-end projects, which may cause some difficult-to-track errors. Regularly cleaning these files can help reduce the occurrence of errors; 3. Keep tidy: Cleaning project files can make the front-end project structure clearer and tidier, facilitating developers to maintain and expand; 4. Save storage space: Deleting unnecessary files can free up storage space, which is particularly important for devices with limited storage space; 5. Optimize the development environment: Cleaning front-end project files can also help optimize the development environment, reduce unnecessary interference and conflicts, and improve development efficiency.
[0064] In the first embodiment of this application, if there is no modular native front-end framework inside the target front-end project, when parsing and scanning the target front-end project, for each scanned project file, the corresponding parser can be used for parsing to obtain the file content of the project file. By scanning the project file and pre-packaging recursive tag elements, it can be found whether the project file is referenced by other files. The project file that is not referenced is the project file that needs to be cleaned. For example, for a JavaScript file, a JavaScript parser can be used to parse the file into a syntax tree to obtain the file content; for a CSS file, style classes and selectors can be parsed to analyze the usage of the CSS file in HTML files and other CSS files.
[0065] Furthermore, during the identification process of the object to be cleaned, the reference situation of the candidate project file can be checked. For the candidate project file with no reference, it is marked as the object to be cleaned. In addition, temporary candidate project files (with specific formats, such as.tmp,.bak) and candidate project files with duplicate content can also be used as the objects to be cleaned.
[0066] Optionally, the cleaning scope includes the target file type, the target time range, and the target cleaning directory; Sub-step 1032 can specifically include sub-step 10321:
[0067] Sub-step 10321: Use the project files in the project files whose file type is the target file type, the creation or modification time is within the target time range, and the storage directory is within the target cleaning directory as the candidate project files.
[0068] In the first embodiment of the present application, the file cleaning rule can constrain the scope (time range, directory range, category range) where the project files to be cleaned are located by defining the cleaning scope.
[0069] Specifically, the configuration parameters in the cleaning scope may include:
[0070] Target file types, including: 1. JavaScript files: It is possible to select whether to clean.js format files, including unused JavaScript files or expired JavaScript library files; 2. CSS files: Select whether to clean.css format files, such as redundant style sheets or unused style files; Different cleaning policies can be set for different directories or modules, for example, cleaning.css files for specific projects or specific themes; 3. HTML files: Determine whether to clear redundant HTML files, such as unused pages or outdated HTML templates, and it is also possible to filter the HTML files to be cleaned according to the modification time or the last access time of the files; 4. Image files: Configure whether to clean image files in formats such as.jpg,.png,.gif,.svg, etc.; It is possible to determine whether to clean based on the size, resolution, usage frequency, or the last usage time of the image files; For example, cleaning images with too small a size or not used for a long time; 5. Font files: Select whether to clear unused font files, such as.woff,.woff2,.ttf, etc.; It is possible to decide whether to clean according to the usage of the font files, for example, whether they are referenced in CSS.
[0071] Target cleaning directory: Specifies the directory or folder to be cleaned, which can be precise to the sub - directory to limit the scope of the cleaning operation; Multiple directories can be added, or certain directories can be excluded to avoid accidentally deleting important files.
[0072] Target time range: Set the cleaning time range according to the creation time or modification time of the files, for example, cleaning files created 6 months ago; It is possible to select to clean only the files that have not been modified for a certain period of time to keep the project updated and concise.
[0073] Therefore, in this step, the first embodiment of the present application can select, from all the project files of the target front - end project, the project files whose file types are the target file types, the creation or modification time is within the target time range, and the storage directory is within the target cleaning directory, as candidate project files. By initially screening the project files according to the cleaning scope, the project files that the cleaning operation does not concern can be excluded, improving the efficiency of the subsequent cleaning operation and reducing unnecessary resource waste.
[0074] Optionally, in the first embodiment of the present application, the cleaning configuration information includes file cleaning rules for the target front-end project; the cleaning task includes a file cleaning task; step 103 may specifically include sub-steps 1034-1036:
[0075] Sub-step 1034: When the target front-end project is a front-end project of a modular project, in response to the execution of the cleaning task, according to the file cleaning rules, parse the target front-end project to obtain the project files included in the target front-end project.
[0076] Sub-step 1035: Through a pre-packaging operation, determine the pre-packaged files used for packaging the target front-end project.
[0077] Sub-step 1036: Use, as the object to be cleaned, the project files included in the target front-end project except for the pre-packaged files.
[0078] In the first embodiment of the present application, for sub-steps 1034-1036, when the target front-end project is a front-end project of a modular project, the main process layer can first scan all the project files of the target front-end project, and then find all the file sets used for project packaging through pre-packaging. Subtracting the file set used for packaging from the set of all project files can obtain the unused and useless files, and subsequent targeted cleaning and optimization can be performed.
[0079] Specifically, pre-packaging usually refers to a preparatory step for an application program or its components during the software development process, that is, integrating the required files, dependencies, configurations, etc. together to form a complete and directly usable release version. This process is usually automated. In the first embodiment of the present application, by parsing the target front-end project, all the project files included in the target front-end project can be obtained, and then a pre-packaging operation can be performed on the target front-end project; and the pre-packaged files used in the packaging process can be obtained. By finding the difference set between the set of all project files and the set of pre-packaged files, the difference set result is the useless files, which can be used as the object to be cleaned for subsequent cleaning.
[0080] Refer to Figure 3 , which shows a flowchart for implementing a method for cleaning a front-end project, including:
[0081] S1. Project cleaning configuration. That is, when the user starts the front-end project cleaning tool and inputs the path of the target front-end project, the tool will read the file and directory information under this path and configure the corresponding cleaning strategy rules according to the user's cleaning requirements.
[0082] S2. Determine whether to clean useless files; and S3. Determine whether to clean useless dependency files.
[0083] When both choose to clean up, execute S4 to scan the files.
[0084] S5. File reference analysis. File reference analysis is used to identify useless files, that is, files that are not referenced can be regarded as useless files.
[0085] S6. Generate an analysis report.
[0086] S7. Full backup before file cleanup. If the backup option is enabled in the cleanup configuration information, before cleaning up the useless files, the useless files can be fully backed up first. Subsequently, if you want to restore the useless files, you can search according to the project file name, find the matching backup file, and perform one-key recovery and restoration.
[0087] S8. Execute file cleanup.
[0088] Optionally, in the second embodiment of the present application, the cleanup configuration information includes a dependency cleanup rule for the target front-end project; the cleanup task includes a dependency cleanup task; step 103 may specifically include sub-steps 1037-1039:
[0089] Sub-step 1037. According to the dependency cleanup rule, obtain the dependency management file of the target front-end project.
[0090] Sub-step 1038. Parse the dependency management file and construct a dependency relationship graph according to the parsing result; the dependency relationship graph reflects the dependency relationship of function calls and class usage in the target front-end project.
[0091] Sub-step 1039. Based on the dependency relationship graph, identify the unused dependency objects as the objects to be cleaned up.
[0092] In the second embodiment of this application, for sub-steps 1037-1039, a dependency cleaning function can be integrated into the front-end project cleaning tool. The dependency cleaning function is designed to scan and analyze the dependency relationships in the front-end project, identify the dependency graph of function calls and class usages in the target front-end project, and then identify and delete unnecessary dependency objects based on the dependency graph. Specifically, the task process of the front-end project cleaning tool can receive a cleaning request sent by the client to the target front-end project to be cleaned, generate a dependency cleaning task for the target front-end project. The cleaning request can carry dependency cleaning rules for the target front-end project. The dependency cleaning rules configure the characteristics (file type, format, etc.), time (creation time, modification time, etc.), directory location, cleaning method (direct deletion, put into the recycle bin), backup strategy (whether to back up), etc. of the dependencies to be cleaned. These rules standardize and restrict the dependency cleaning process of the target front-end project. These rules can be configured in the front-end project cleaning tool for subsequent cleaning of the dependencies of the target front-end project based on the dependency cleaning rules.
[0093] Furthermore, after the file cleaning task is scheduled and distributed through the task process layer, the dependency cleaning task can be assigned to the main process layer for execution. The main process layer first needs to parse the target front-end project to obtain the dependency management files of the target front-end project, such as the package.json file (parsing can obtain the dependency list for analyzing the dependencies of related projects), the bower.json file, etc. Then, based on the dependency management files, a dependency graph reflecting the function calls and class usages in the target front-end project is constructed. Based on the dependency graph, the usage of dependencies in the target front-end project is analyzed, and the unused dependency objects are identified as the objects to be cleaned. For example, for JavaScript code, by parsing and identifying the "import" or "require" statements therein, the dependency relationships between resource files are determined. For CSS files, by parsing and identifying the "@import" statements and style selectors' dependencies on other style files and HTML elements. The dependency relationships are presented in a graphical dependency graph on the front-end interface, and developers can view the specific dependency information by clicking on the nodes.
[0094] For example, assume that the dependency graph includes the dependency relationship of resource file A on resource file B, the dependency relationship of resource file A on resource file C, and an independent resource file D that is not depended on and used by other resource files. Then, resource file D can be identified as an unnecessary dependency.
[0095] After determining the dependency objects to be cleaned, the main process layer can perform the cleaning operation on the dependency objects to be cleaned according to the cleaning configuration information, obtain the cleaning result, and display it through the rendering process.
[0096] The dependency cleaning function for front-end projects enables developers to no longer need to manually search for and delete unused dependencies, and invest more time and energy in core development work. For example, during development, there is no longer a need to spend a lot of time checking whether the dependencies in package.json are still in use, and the cleaning tool will automatically complete this task. Additionally, it can reduce the disk space occupied by the target front-end project, especially for target front-end projects stored in the cloud or on a server, reducing storage costs. For example, in a long-term development project, the continuously accumulating redundant files will occupy a large amount of storage space, and the cleaning tool can free up this space.
[0097] Optionally, in the third embodiment of the present application, the cleaning configuration information includes code cleaning rules for the target front-end project; the cleaning task includes a code cleaning task; step 103 can specifically include sub-step 10310:
[0098] Sub-step 10310: Pre-package the target front-end project, and during the execution of the pre-packaging, analyze the code of the target front-end project, and mark the unused code snippets as the objects to be cleaned.
[0099] Step 104 can specifically include sub-step 1041:
[0100] Sub-step 1041: Traverse the packaged files obtained from the pre-packaging, and according to the marking, find the objects to be cleaned and perform the cleaning operation.
[0101] In the third embodiment of the present application, for sub-step 10310 and sub-step 1041, a code cleaning function can be integrated into the front-end project cleaning tool. The code cleaning function is designed to identify and clean the useless code in the project files of the front-end project. For example, it can find and clean code snippets such as unused functions, variables, classes, etc. Specifically, the task process of the front-end project cleaning tool can receive a cleaning request sent by the client to the target front-end project to be cleaned, generate a code cleaning task for the target front-end project, and the cleaning request can carry the code cleaning rules for the target front-end project. After the file cleaning task is scheduled and distributed through the task process layer, the code cleaning task can be assigned to the main process layer for execution; the main process layer can perform a pre-packaging operation on the target front-end project. During the execution of the pre-packaging, analyze the reference situation of the code of the target front-end project, and mark the unused code snippets (unreferenced code snippets) as the objects to be cleaned (mainly for JavaScript files); when the packaging scan is completed to generate the packaged files, by looping through the corresponding packaged files, regular matching can be performed on the file content of the project files through the marking, and the code snippets corresponding to the marking can be found as the objects to be cleaned for the cleaning operation.
[0102] Among them, for the code cleaning of CSS style files, unused selector styles can be found in the style sheet and deleted. That is, first traverse all CSS file selectors, perform selector matching in the JavaScript code according to the selectors of all CSS files. If no match is found, the style code of the corresponding selector is deleted.
[0103] Refer to Figure 3 , after executing S8, file cleaning, S9 can be performed to determine whether to clean up useless code.
[0104] If so, execute S10, simulate packaging (pre-packaging) and mark the unused code.
[0105] S11, perform regular matching on the file content through node (mark).
[0106] S12, find the source code corresponding to the dead code of the build product.
[0107] S13, execute the cleaning operation.
[0108] The code cleaning function for front-end projects has the following advantages: 1. Improve code quality: By removing redundant, duplicate or useless code snippets, and improving naming conventions, code structure and comments, code cleaning can significantly improve the quality of the code; 2. Improve code readability: The cleaned code is more tidy and easy to read, which helps other developers to understand the code more easily, and thus easier to maintain and expand; 3. Improve code performance: Optimize front-end code, such as removing zombie code, can improve the performance of the web page, speed up the page loading time, reduce the occupation of system resources, and thus improve the user experience; 4. Reduce errors and vulnerabilities: During the code cleaning process, potential errors or vulnerabilities in the code can be fixed, thus improving the stability and security of the code.
[0109] Optionally, step 104 may specifically include sub-steps 1042-1043:
[0110] Sub-step 1042, execute the cleaning operation on the object to be cleaned according to the cleaning policy defined by the main process according to the cleaning configuration information, and obtain a cleaning result; the cleaning policy includes a backup policy and a deletion policy; the backup policy is used to configure whether to back up the object to be cleaned in a specified storage format and directory before cleaning; the deletion policy is used to configure whether to directly delete the object to be cleaned or move it to the recycle bin.
[0111] Sub-step 1043: Render the cleaning result as a visual chart through the rendering process for display; the cleaning result includes one or more of: a list of objects that have completed the cleaning operation, the execution time of the cleaning operation, the reason for the execution of the cleaning operation, and the size of the storage space released by the cleaning operation.
[0112] In the embodiment of the present application, for sub-steps 1042 - 1043, cleaning configuration information can define a cleaning policy, and the cleaning policy can control the execution of the cleaning operation. The cleaning policy can include:
[0113] Backup option: Configure whether to back up the objects to be cleaned before cleaning so that they can be restored when needed; the backup directory and the storage format of the backup files can be specified, such as the compressed package format.
[0114] Deletion policy: Select whether to directly delete the objects to be cleaned or move the objects to be cleaned to the recycle bin for safer cleaning; for the handling of accidentally deleted objects to be cleaned, a recovery mechanism or keep a copy of the file for a period of time can be set.
[0115] Thus, the embodiment of the present application can execute the cleaning operation on the objects to be cleaned according to the cleaning policy defined in the cleaning configuration information through the main process to obtain the cleaning result.
[0116] In addition, after obtaining the cleaning result, the embodiment of the present application can also render the cleaning result as a visual chart through the rendering process for display. The cleaning result records the operation logs of the entire cleaning process, including which files / codes / dependencies are cleaned, the operation time, the operation result, etc. Generate a report according to the cleaning result for the user to view, and at the same time provide a log viewing function to facilitate the user to understand the cleaning process and solve possible problems.
[0117] The cleaning log function mainly includes the cleaning record of project files and file restoration. After the cleaning operation is completed, the cleaning log can be viewed, and key cleaning information such as the location of the cleaned files, file names, and cleaning reasons can be viewed. Occasionally, files may be accidentally deleted or cleaned during the cleaning process. At this time, the corresponding files can be searched through the project or file name in the file restoration module, and the files can be restored to maintain the integrity of the files. This function mainly provides the viewing of file cleaning logs and a fault tolerance processing mechanism.
[0118] Optionally, step 102 can specifically include sub-steps 1021 - 1022:
[0119] Sub-step 1021: Generate a cleaning task for the target front-end project through the task process, and set the number of concurrent execution tasks of the cleaning task according to the speed parameter defined in the cleaning configuration information.
[0120] Sub-step 1022: Set the maximum memory occupancy of the cleaning task according to the memory usage parameters defined in the cleaning configuration information.
[0121] In the embodiment of the present application, for sub-steps 1021 - 1022, the execution of the cleaning task can also be controlled. According to the speed parameters defined in the cleaning configuration information, set the number of concurrent execution tasks of the cleaning task. That is, in the embodiment of the present application, when it is required to execute the cleaning task quickly, the number of concurrent execution tasks of the cleaning task can be set to a larger value, so that computer resources tend to execute the cleaning task, ensuring the rapid execution of the cleaning task. When the cleaning task does not affect the execution of other tasks, the number of concurrent execution tasks of the cleaning task is set to a smaller value, so that computer resources tend to execute other tasks, ensuring that the execution of the cleaning task does not affect other tasks.
[0122] In addition, the embodiment of the present application can also set the maximum memory occupancy of the cleaning task according to the memory usage parameters defined in the cleaning configuration information. This can control the maximum memory occupancy of the cleaning task, and the purpose of doing this is to prevent the cleaning task from occupying too much system resources and affecting the operation of other programs.
[0123] Optionally, the task process, the main process, and the rendering process are decoupled from each other.
[0124] Refer to Figure 4 , Figure 4 is a cleaning framework diagram of a front-end project provided by the embodiment of the present application. The entire framework is built based on Eletcorn and Vite. A basic framework is designed on top of the underlying dependencies and infrastructure to achieve build packaging. Through the design of architecture layering, some application management and graphical user interface (GUI) management capabilities are provided for the application program of the entire front-end project cleaning tool. The top layer is for providing some application capabilities for some business scenarios, including several core applications and the main policy engine. The system adopts a multi-process architecture system and realizes it by building multiple processes during development and construction. The core idea is to build three processes through Vite: the rendering process layer (related to the interface rendering of the client), the task process layer (related to task scheduling), and the main process layer (related to task execution), and then fuse the three processes to achieve the core application of front-end project cleaning through the multi-process method. The top-down call of the layered design seems the same from the upper layer, so it is necessary to smooth out the differences at the bottom layer of the terminal. At present, the implementation of the bottom layer module is strictly distinguished by directories, so that when developing a bottom layer function, each section can be independent of each other.
[0125] Among them, for local database management: local data storage is an important function commonly seen in business scenarios. Therefore, the embodiments of this application encapsulate the capabilities of commonly used database operations such as addition, deletion, modification, and query, and provide them for each process to use, so as to achieve persistent data storage.
[0126] For underlying bridging: underlying bridging is a necessary means to solve the problem that Electron (an open-source framework) cannot cover all application scenarios. The embodiments of this application encapsulate three bridging modes at the bridging layer, namely the jsBridge capability called by the rendering process, the capability of the main process to call dll and dylib plugins, and the capability to bridge third-party programs.
[0127] For client requests: the client request module is also crucial. It can be encapsulated into a general http request library, supporting calls from the main process, rendering process, and task process to smooth out the differences in upper-layer calls.
[0128] For task management: due to the particularity of business scenarios and clients, local task management is often required. Therefore, this application can encapsulate the task management module into a general tool class to support the management of various life cycles of tasks such as registration, startup, stop, and destruction.
[0129] Further, referring to Figure 5 , Figure 5 is an implementation framework diagram of a policy engine for a front-end project provided by the embodiments of this application. The embodiments of this application implement the function of on-device task scheduling and distribution through the policy engine; first, receive the policy information configured by the client, generate corresponding tasks, and distribute them to each sub-task center to execute the corresponding policies. Then, report the task execution status to the server. The main implementation idea is that the user selects their own project engineering, then sets the corresponding engineering cleaning rules (i.e., policy rules), and then triggers the task center scheduling to split, collect, and distribute tasks; finally, the underlying layer processes the tasks and reports the results, ultimately completing the cleaning task of the front-end project.
[0130] Referring to Figure 6 , Figure 6 is an implementation framework diagram of a front-end project cleaning tool provided by the embodiments of this application. The front-end project cleaning tool includes three parts: engineering file cleaning, code snippet cleaning, and cleaning logs; among them, engineering file cleaning is used to clean resources, project files, and project dependency packages; code snippet cleaning is used to clean code snippets such as JavaScript and frameworks (vue, react), as well as clean CSS file code snippets; cleaning logs are used to implement the display of the project cleaning log list and the restoration of cleaned files.
[0131] In summary, based on the target front-end project selected by the user, the embodiment of the present application receives the processing request sent by the user device through the task process. Then, according to the cleaning request, the cleaning task for the target front-end project is generated through the task process. Finally, in response to the execution of the cleaning task, the target front-end project is parsed by the main process according to the cleaning configuration information, and the objects to be cleaned are identified from the parsing results; the cleaning operation on the objects to be cleaned is performed by the main process according to the cleaning configuration information, and the cleaning result is obtained and rendered and displayed through the rendering process. During the entire cleaning process, the cleaning of the front-end project can be realized automatically and accurately, reducing the dependence on human resources.
[0132] Figure 7 FIG. 4 is a block diagram of a cleaning device for a front-end project provided by an embodiment of the present application. The device includes:
[0133] A receiving module 301, configured to receive a cleaning request sent by a user device through a task process based on a target front-end project selected by the user, where the cleaning request carries cleaning configuration information;
[0134] A generating module 302, configured to generate a cleaning task for the target front-end project through the task process according to the cleaning configuration information in the cleaning request;
[0135] An execution module 303, configured to, in response to the execution of the cleaning task, parse the target front-end project by the main process according to the cleaning configuration information, and identify objects to be cleaned from the parsing results;
[0136] A display module 304, configured to perform a cleaning operation on the objects to be cleaned by the main process according to the cleaning configuration information, obtain a cleaning result, and perform rendering and display through a rendering process.
[0137] Optionally, the cleaning configuration information includes a file cleaning rule for the target front-end project; the cleaning task includes a file cleaning task;
[0138] The execution module 303 includes:
[0139] A first processing sub-module, configured to parse the target front-end project according to the file cleaning rule to obtain project files included in the target front-end project;
[0140] A second processing sub-module, configured to determine candidate project files from all the project files according to the cleaning scope defined by the file cleaning rule;
[0141] A third processing sub-module, configured to use candidate project files that are not referenced by other files, temporary candidate project files, and candidate project files with duplicate content as the objects to be cleaned.
[0142] Optionally, the cleaning scope includes a target file type, a target time range, and a target cleaning directory;
[0143] The second processing sub-module includes:
[0144] A selection unit for using, as the candidate project files, the project files in the project files whose file type is the target file type, the creation or modification time is within the target time range, and the storage directory is within the target cleaning directory.
[0145] Optionally, the cleaning configuration information includes file cleaning rules for the target front-end project; the cleaning task includes a file cleaning task;
[0146] The execution module 303 includes:
[0147] A fourth processing sub-module for, when the target front-end project is the front-end project of a modular project, in response to the execution of the cleaning task, parsing the target front-end project according to the file cleaning rules to obtain the project files included in the target front-end project;
[0148] A fifth processing sub-module for determining, through a pre-packaging operation, the pre-packaging files used for packaging the target front-end project;
[0149] A sixth processing sub-module for using, as the objects to be cleaned, the project files other than the pre-packaging files among all the project files included in the target front-end project.
[0150] Optionally, the cleaning configuration information includes dependency cleaning rules for the target front-end project; the cleaning task includes a dependency cleaning task;
[0151] The execution module 303 includes:
[0152] A seventh processing sub-module for obtaining the dependency management files of the target front-end project according to the dependency cleaning rules;
[0153] An eighth processing sub-module for parsing the dependency management files and constructing a dependency relationship graph according to the parsing results; the dependency relationship graph reflects the dependency relationships of function calls and class uses in the target front-end project;
[0154] A ninth processing sub-module for identifying unused dependency objects as the objects to be cleaned based on the dependency relationship graph.
[0155] Optionally, the cleaning configuration information includes code cleaning rules for the target front-end project; the cleaning task includes a code cleaning task;
[0156] The execution module 303 includes:
[0157] A tenth processing sub-module, configured to pre-package the target front-end project, and during the execution of the pre-packaging, analyze the code of the target front-end project, mark unused code snippets as the objects to be cleaned up;
[0158] The display module 304 includes:
[0159] A traversal sub-module, configured to traverse the packaged files obtained by the pre-packaging, and according to the marks, find the objects to be cleaned up and perform the cleaning operation.
[0160] Optionally, the display module 304 includes:
[0161] A first policy sub-module, configured to execute the cleaning operation on the objects to be cleaned up according to the cleaning policy defined in the cleaning configuration information through the main process, and obtain a cleaning result; the cleaning policy includes a backup policy and a deletion policy; the backup policy is used to configure whether to back up the objects to be cleaned up in a specified storage format and directory before cleaning; the deletion policy is used to configure to directly delete the objects to be cleaned up or move them to the recycle bin;
[0162] A second policy sub-module, configured to render the cleaning result as a visual chart for display through the rendering process, and the cleaning result includes one or more of: a list of objects on which the cleaning operation has been completed, the execution time of the cleaning operation, the reason for the execution of the cleaning operation, and the size of the storage space released by the cleaning operation.
[0163] Optionally, the generation module 302 includes:
[0164] A first configuration sub-module, configured to generate a cleaning task for the target front-end project through the task process, and set the number of concurrent execution tasks of the cleaning task according to the speed parameter defined in the cleaning configuration information;
[0165] A second configuration sub-module, configured to set the maximum memory occupancy of the cleaning task according to the memory usage parameter defined in the cleaning configuration information.
[0166] Optionally, the task process, the main process, and the rendering process are decoupled from each other.
[0167] In summary, based on the target front-end project selected by the user, the embodiment of the present application receives a processing request sent by the user device through a task process, and then generates a cleaning task for the target front-end project according to the cleaning request through the task process. Finally, in response to the execution of the cleaning task, the main process parses the target front-end project according to the cleaning configuration information, and identifies the objects to be cleaned from the parsing results; the main process executes the cleaning operation on the objects to be cleaned according to the cleaning configuration information, obtains the cleaning result and performs rendering display through the rendering process. During the entire cleaning process, the cleaning of the front-end project can be realized automatically and accurately, reducing the dependence on human resources.
[0168] For the device embodiment, since it is basically similar to the method embodiment, the description is relatively simple. For the relevant parts, please refer to the partial description of the method embodiment.
[0169] Each embodiment in this specification is described in a progressive manner. The key point of each embodiment is the difference from other embodiments. The same or similar parts between each embodiment can be referred to each other.
[0170] Regarding the device in the above embodiment, the specific manner in which each module performs operations has been described in detail in the embodiment related to the method, and will not be elaborated here.
[0171] The embodiment of the present application provides a cleaning device for a front-end project, including a memory and more than one program. The more than one program is stored in the memory and is configured to be executed by more than one processor. The more than one program includes the method for performing the above one or more embodiments.
[0172] Figure 8 It is a block diagram of a cleaning device 800 for a front-end project shown according to an exemplary embodiment. For example, the device 800 can be a mobile phone, a computer, a digital broadcast terminal, a messaging device, a game console, a tablet device, a medical device, a fitness device, a personal digital assistant, etc.
[0173] Refer to Figure 8 , the device 800 may include one or more of the following components: a processing component 802, a memory 804, a power component 806, a multimedia component 808, an audio component 810, an input / output (I / O) interface 812, a sensor component 814, and a communication component 816.
[0174] The processing component 802 generally controls the overall operation of the device 800, such as operations associated with display, telephone calls, data communication, camera operations, and recording operations. The processing element 802 may include one or more processors 820 to execute instructions to complete all or part of the steps of the above-described methods. In addition, the processing component 802 may include one or more modules to facilitate the interaction between the processing component 802 and other components. For example, the processing component 802 may include a multimedia module to facilitate the interaction between the multimedia component 808 and the processing component 802.
[0175] The memory 804 is configured to store various types of data to support the operation of the device 800. Examples of such data include instructions for any application or method operating on the device 800, contact data, phone book data, messages, pictures, videos, and the like. The memory 804 may be implemented by any type of volatile or non-volatile storage device or a combination thereof, such as static random access memory (SRAM), electrically erasable programmable read-only memory (EEPROM), erasable programmable read-only memory (EPROM), programmable read-only memory (PROM), read-only memory (ROM), magnetic memory, flash memory, a magnetic disk, or an optical disk.
[0176] The power component 806 provides power to the various components of the device 800. The power component 806 may include a power management system, one or more power supplies, and other components associated with generating, managing, and distributing power for the device 800.
[0177] The multimedia component 808 includes a screen that provides an output interface between the device 800 and the user. In some embodiments, the screen may include a liquid crystal display (LCD) and a touch panel (TP). If the screen includes a touch panel, the screen may be implemented as a touch screen to receive input signals from the user. The touch panel includes one or more touch sensors to sense touches, swipes, and gestures on the touch panel. The touch sensors may sense not only the boundaries of the touch or swipe actions, but also check the duration and pressure associated with the touch or swipe operations. In some embodiments, the multimedia component 808 includes a front camera and / or a rear camera. When the device 800 is in an operating mode, such as a shooting mode or a video mode, the front camera and / or the rear camera may receive external multimedia data. Each of the front camera and the rear camera may be a fixed optical lens system or have a focal length and optical zoom capabilities.
[0178] The audio component 810 is configured to output and / or input audio signals. For example, the audio component 810 includes a microphone (MIC) that is configured to receive external audio signals when the device 800 is in an operating mode, such as a call mode, a recording mode, and a voice message processing mode. The received audio signals can be further stored in the memory 804 or sent via the communication component 816. In some embodiments, the audio component 810 further includes a speaker for outputting audio signals.
[0179] The I / O interface 812 provides an interface between the processing component 802 and peripheral interface modules, and the peripheral interface modules may be a keyboard, a click wheel, buttons, and the like. These buttons may include, but are not limited to: a home button, a volume button, a start button, and a lock button.
[0180] The sensor component 814 includes one or more sensors for providing an assessment of various aspects of the state of the device 800. For example, the sensor component 814 can detect the open / closed state of the device 800, the relative positioning of components, such as the display and keypad of the device 800. The sensor component 814 can also search for a change in the position of the device 800 or a component of the device 800, the presence or absence of user contact with the device 800, the orientation or acceleration / deceleration of the device 800, and the temperature change of the device 800. The sensor component 814 can include a proximity sensor configured to detect the presence of nearby objects without any physical contact. The sensor component 814 can also include a light sensor, such as a CMOS or CCD image sensor, for use in imaging applications. In some embodiments, the sensor component 814 can further include an acceleration sensor, a gyro sensor, a magnetic sensor, a pressure sensor, or a temperature sensor.
[0181] The communication component 816 is configured to facilitate communication between the device 800 and other devices in a wired or wireless manner. The device 800 can access a wireless network based on communication standards, such as WiFi, 2G, or 3G, or a combination thereof. In an exemplary embodiment, the communication component 816 receives a broadcast signal or broadcast-related information from an external broadcast management system via a broadcast channel. In an exemplary embodiment, the communication component 816 further includes a near field communication (NFC) module to facilitate short-range communication. For example, the NFC module can be implemented based on radio frequency identification (RFID) technology, infrared data association (IrDA) technology, ultra-wideband (UWB) technology, Bluetooth (BT) technology, and other technologies.
[0182] In an exemplary embodiment, the apparatus 800 may be implemented by one or more application specific integrated circuits (ASICs), digital signal processors (DSPs), digital signal processing devices (DSPDs), programmable logic devices (PLDs), field programmable gate arrays (FPGAs), controllers, microcontrollers, microprocessors, or other electronic components for performing the above method.
[0183] In an exemplary embodiment, a non-transitory computer-readable storage medium including instructions is also provided, such as a memory 804 including instructions, and the above instructions can be executed by a processor 820 of the apparatus 800 to complete the above method. For example, the non-transitory computer-readable storage medium may be a ROM, a random access memory (RAM), a CD-ROM, a magnetic tape, a floppy disk, and an optical data storage device, etc.
[0184] Figure 9 FIG. is a schematic structural diagram of a server in some embodiments of the present application. The server 1900 may vary greatly due to different configurations or performances, and may include one or more central processing units (CPUs) 1922 (for example, one or more processors) and a memory 1932, and one or more storage media 1930 (for example, one or more mass storage devices) for storing application programs 1942 or data 1944. Among them, the memory 1932 and the storage media 1930 may be transient storage or persistent storage. The program stored in the storage media 1930 may include one or more modules, and each module may include a series of instruction operations on the server. Further, the central processor 1922 may be configured to communicate with the storage media 1930 and execute a series of instruction operations in the storage media 1930 on the server 1900.
[0185] The server 1900 may further include one or more power supplies 1926, one or more wired or wireless network interfaces 1950, one or more input / output interfaces 1958, one or more keyboards 1956, and / or one or more operating systems 1941, such as Windows ServerTM, Mac OS XTM, UnixTM, LinuxTM, FreeBSDTM, and so on.
[0186] A non-transitory computer-readable storage medium, when the instructions in the storage medium are executed by a processor of a device (server or terminal), enables the device to execute the method of the above embodiment.
[0187] A non - transitory computer - readable storage medium, when the instructions in the storage medium are executed by a processor of a device (server or terminal), enables the device to execute the description of the method in the above - mentioned embodiments. Therefore, details will not be repeated here. Additionally, the description of the beneficial effects of the same method will not be repeated either. For the technical details not disclosed in the computer program product or computer program embodiments involved in this application, please refer to the description of the method embodiments of this application.
[0188] In addition, it should be noted that: The embodiments of this application also provide a computer program product or a computer program. The computer program product or the computer program may include computer instructions, and these computer instructions may be stored in a computer - readable storage medium. The processor of the computer device reads the computer instructions from the computer - readable storage medium, and the processor may execute the computer instructions, enabling the computer device to execute the description of the method in the above - mentioned embodiments. Therefore, details will not be repeated here. Additionally, the description of the beneficial effects of the same method will not be repeated either. For the technical details not disclosed in the computer program product or computer program embodiments involved in this application, please refer to the description of the method embodiments of this application.
[0189] Those skilled in the art will readily conceive of other embodiments of this application after considering the specification and practicing the application disclosed herein. This application is intended to cover any variations, uses, or adaptations of this application, which follow the general principles of this application and include known common knowledge or conventional technical means in the technical field not disclosed in this application. The specification and embodiments are only regarded as exemplary, and the true scope and spirit of this application are pointed out by the following claims.
[0190] It should be understood that this application is not limited to the exact structures already described and shown in the drawings, and various modifications and changes can be made without departing from its scope. The scope of this application is only limited by the appended claims.
[0191] The above - mentioned are only the preferred embodiments of this application and are not intended to limit this application. Any modifications, equivalent replacements, improvements, etc., made within the spirit and principles of this application shall be included in the protection scope of this application.
[0192] The above has introduced in detail a cleaning method, device, electronic device and computer-readable storage medium for a front-end project provided by this application. Specific examples are used in this article to elaborate on the principle and implementation manner of this application. The description of the above embodiments is only used to help understand the method and its core idea of this application; at the same time, for those of ordinary skill in the art, according to the idea of this application, there will be changes in the specific implementation manner and application scope. In summary, the content of this specification should not be construed as a limitation to this application.
Claims
1. A cleaning method for a front-end project, characterized in that, The method includes: Based on the target front-end project selected by the user, receiving a cleaning request sent by the user device through a task process, where the cleaning request carries cleaning configuration information; Generating a cleaning task for the target front-end project through the task process according to the cleaning configuration information in the cleaning request; In response to the execution of the cleaning task, parsing the target front-end project according to the cleaning configuration information through the main process, and identifying objects to be cleaned from the parsing results; Executing a cleaning operation on the objects to be cleaned according to the cleaning configuration information through the main process, obtaining a cleaning result and rendering and displaying it through a rendering process.
2. The cleaning method of the front-end project according to claim 1, wherein, The cleaning configuration information includes file cleaning rules for the target front-end project; the cleaning task includes a file cleaning task; The parsing of the target front-end project according to the cleaning configuration information and identifying objects to be cleaned from the parsing results includes: Parsing the target front-end project according to the file cleaning rules to obtain the project files included in the target front-end project; Determining candidate project files from all the project files according to the cleaning scope defined by the file cleaning rules; Taking the candidate project files that are not referenced by other files, temporary candidate project files, and candidate project files with duplicate content as the objects to be cleaned.
3. The cleaning method of the front-end project according to claim 2, characterized in that The cleaning scope includes target file types, target time ranges, and target cleaning directories; The determining of candidate project files from all the project files according to the cleaning scope defined by the file cleaning rules includes: Taking the project files in the project files whose file types are the target file types, the creation or modification time is within the target time range, and the storage directory is within the target cleaning directory as the candidate project files.
4. The cleaning method of the front-end project according to claim 1, wherein The cleaning configuration information includes file cleaning rules for the target front-end project; the cleaning task includes a file cleaning task; The parsing of the target front-end project according to the cleaning configuration information and identifying objects to be cleaned from the parsing results in response to the execution of the cleaning task includes: When the target front-end project is a front-end project of a modular project, in response to the execution of the cleaning task, parsing the target front-end project according to the file cleaning rules to obtain the project files included in the target front-end project; Determining pre-packaging files used for packaging the target front-end project through a pre-packaging operation; Taking the project files in all the project files included in the target front-end project except the pre-packaging files as the objects to be cleaned.
5. The cleaning method of the front-end project according to claim 1, characterized in that, The cleaning configuration information includes dependency cleaning rules for the target front-end project; the cleaning task includes a dependency cleaning task; The parsing of the target front-end project according to the cleaning configuration information and identifying objects to be cleaned from the parsing results includes: Obtaining the dependency management file of the target front-end project according to the dependency cleaning rules; Parsing the dependency management file and constructing a dependency relationship graph according to the parsing results; the dependency relationship graph reflects the dependency relationships of function calls and class uses in the target front-end project. Based on the dependency graph, identify the unused dependent objects as the objects to be cleaned up.
6. The cleaning method of the front-end project according to claim 1, wherein, The cleaning configuration information includes code cleaning rules for the target front-end project; the cleaning task includes a code cleaning task. Parsing the target front-end project according to the cleaning configuration information and identifying the objects to be cleaned up from the parsing results includes: Pre-packaging the target front-end project, and during the execution of the pre-packaging, analyzing the code of the target front-end project, marking the unused code snippets as the objects to be cleaned up. Performing the cleaning operation on the objects to be cleaned up includes: Traversing the packaged files obtained from the pre-packaging, and according to the marking, finding the objects to be cleaned up and performing the cleaning operation.
7. The cleaning method of the front-end project according to claim 1, wherein The main process performs the cleaning operation on the objects to be cleaned up according to the cleaning configuration information, obtains the cleaning result and renders and displays it through the rendering process, including: The main process performs the cleaning operation on the objects to be cleaned up according to the cleaning strategy defined in the cleaning configuration information, and obtains the cleaning result; the cleaning strategy includes a backup strategy and a deletion strategy; the backup strategy is used to configure whether to back up the objects to be cleaned up in a specified storage format and directory before cleaning; the deletion strategy is used to configure to directly delete the objects to be cleaned up or move them to the recycle bin. The rendering process renders the cleaning result into a visual chart for display; the cleaning result includes one or more of a list of objects for which the cleaning operation has been completed, the execution time of the cleaning operation, the reason for the execution of the cleaning operation, and the size of the storage space released by the cleaning operation.
8. The cleaning method of the front-end project according to claim 1, characterized in that, Generating a cleaning task for the target front-end project through the task process according to the cleaning configuration information in the cleaning request includes: Generating a cleaning task for the target front-end project through the task process, and setting the number of concurrent execution tasks of the cleaning task according to the speed parameter defined in the cleaning configuration information. Setting the maximum memory occupancy of the cleaning task according to the memory usage parameter defined in the cleaning configuration information.
9. The cleaning method of the front-end project according to any one of claims 1-8, characterized in that, The task process, the main process, and the rendering process are decoupled from each other.
10. A cleaning device for a front-end project, characterized in that, The device includes: A receiving module, configured to receive a cleaning request sent by a user device through a task process based on a selected target front-end project by the user, where the cleaning request carries cleaning configuration information. A generating module, configured to generate a cleaning task for the target front-end project through the task process according to the cleaning configuration information in the cleaning request. An execution module, configured to, in response to the execution of the cleaning task, parse the target front-end project according to the cleaning configuration information through the main process, and identify the objects to be cleaned up from the parsing results. A display module, configured to perform the cleaning operation on the objects to be cleaned up according to the cleaning configuration information through the main process, obtain the cleaning result and render and display it through the rendering process.
11. An electronic device, characterized in that, Includes: A processor; A memory for storing executable instructions of the processor; Wherein, the processor is configured to execute the instructions to implement the method according to any one of claims 1 to 9.
12. A computer-readable storage medium, characterized in that, When the instructions in the computer-readable storage medium are executed by a processor of an electronic device, the electronic device is enabled to execute the method according to any one of claims 1 to 9.