Low-code blueprint optimization method and device and nonvolatile storage medium

Abstract

The invention discloses a low-code blueprint optimization method and device and a nonvolatile storage medium. The method comprises the following steps: performing rendering optimization on an original page of a low-code blueprint to obtain an optimized interface; acquiring blueprint JSON (JavaScript Object Notation) data corresponding to the optimized interface, and analyzing the blueprint JSON data; according to the analyzed blueprint JSON data, an executable initial code is generated; and converting the initial code into an abstract syntax tree, and performing code optimization on the abstract syntax tree of the initial code. According to the method and the device, the technical problem of low running efficiency caused by high resource consumption during running of the low-code blueprint in the prior art is solved.

Description

Technical Field

[0001] The present application relates to the fields of software development and information technology, and specifically, to an optimization method, device and non-volatile storage medium for a low-code blueprint. Background Art

[0002] In the digital age, low-code platforms have emerged with their outstanding features and have become an accelerator for enterprises to accelerate innovation and transformation. Blueprints play an indispensable role as a bridge between user intent and business logic in low-code architectures. They cleverly use drag-and-drop components, property configuration, and process connections to transform complex business logic into an intuitive and easy-to-understand graphical interface, effectively reducing the development burden and cutting costs. However, with the complexity of business processes and the surge in data volume, blueprints face many performance challenges in the process of orchestration, rendering, and execution.

[0003] Specifically, although the low-code platform has greatly reduced the difficulty and threshold of software development, it is still insufficient compared with the traditional development model in terms of data processing efficiency, memory management, code optimization and resource utilization. This efficiency gap not only exacerbates the consumption of system resources, but also invisibly raises the hardware threshold of the user end, so that computers with ordinary configurations may encounter performance bottlenecks, such as freezes and delays, when running low-code platforms. In the logical arrangement and visual rendering stage of the blueprint, facing the huge and complex graphical interface initialization tasks, the system often faces performance problems such as slow loading, time-consuming and interface freezes, which pose a direct challenge to the user experience. In the actual operation stage of the blueprint, especially when the first screen rendering efficiency becomes a key consideration, the low-code blueprint optimizes the execution speed of the blueprint and streamlines the initialization code size to reduce resource consumption during the operation stage. Improving operation efficiency has become an urgent problem to be solved. In the related technologies, the low-code blueprint has a large resource consumption during operation, resulting in low operation efficiency.

[0004] To address the above-mentioned problems, no effective solution has been proposed yet. Summary of the invention

[0005] The embodiments of the present application provide a low-code blueprint optimization method, device and non-volatile storage medium to at least solve the technical problem in the related art that the low-code blueprint has large resource consumption during operation, resulting in low operating efficiency.

[0006] According to one aspect of an embodiment of the present application, a method for optimizing a low-code blueprint is provided, including: optimizing the rendering of an original page of the low-code blueprint to obtain an optimized interface; obtaining blueprint JSON data corresponding to the optimized interface, and parsing the blueprint JSON data; generating executable initial code based on the parsed blueprint JSON data; converting the initial code into an abstract syntax tree, and performing code optimization on the abstract syntax tree of the initial code.

[0007] In some embodiments of the present application, the rendering of the original page of the low-code blueprint is optimized to obtain an optimized interface, including: obtaining the number of operations of each component and element when generating the original page; dividing the original page into a static layer and a dynamic layer according to the number of operations, wherein the static layer contains components and elements in the original page whose number of operations is less than a first threshold, and the dynamic layer contains components and elements in the original page whose number of operations is greater than or equal to the first threshold; dividing the static layer and the dynamic layer into multiple independent small areas, and rendering each independent small area separately to obtain an optimized interface.

[0008] In some embodiments of the present application, after dividing the original page into a static layer and a dynamic layer according to the number of operations, the method further includes: drawing the static content in the static layer into the background layer; and when the background layer contains all the static content in the static layer, transferring the content in the background layer to the foreground layer for display.

[0009] In some embodiments of the present application, after the static layer and the dynamic layer are divided into multiple independent small areas, the method also includes: obtaining a first graphic element that remains unchanged in the static layer and a second graphic element in the dynamic layer whose operation times are greater than a second threshold; caching the first graphic element and the second graphic element as an image.

[0010] In some embodiments of the present application, executable initial code is generated based on the parsed blueprint JSON data, including: obtaining node information, connection information and attribute information in the blueprint JSON data; determining the blueprint element model based on the node information, connection information and attribute information; constructing node functions and data flow code snippets based on the blueprint element model, wherein the data flow code is used to represent the flow direction between nodes; determining the initial code based on the node function and the data flow code snippet.

[0011] In some embodiments of the present application, the initial code is converted into an abstract syntax tree, including: parsing the initial code to obtain basic elements contained in the initial code; determining the grammatical structure of the initial code based on the basic elements; creating tree nodes of the abstract syntax tree based on the grammatical structure; and connecting the tree nodes to obtain the abstract syntax tree.

[0012] In some embodiments of the present application, code optimization is performed on the abstract syntax tree of the initial code, including: performing a depth-first traversal on the abstract syntax tree, converting the tree nodes in the abstract syntax tree into corresponding code snippets, and determining the code to be optimized contained in the abstract syntax tree; after optimizing the code to be optimized, obtaining the target code snippet corresponding to each tree node; combining the target code snippets corresponding to each tree node to obtain a completed code file.

[0013] According to another aspect of an embodiment of the present application, a low-code blueprint optimization device is also provided, including: a first optimization module, used to perform rendering optimization on the original page of the low-code blueprint to obtain an optimized interface; a parsing module, used to obtain the blueprint JSON data corresponding to the optimized interface, and parse the blueprint JSON data; a generation module, used to generate executable initial code based on the parsed blueprint JSON data; a second optimization module, used to convert the initial code into an abstract syntax tree, and perform code optimization on the abstract syntax tree of the initial code.

[0014] According to another aspect of an embodiment of the present application, an electronic device is also provided, including: a memory for storing program instructions; a processor, connected to the memory, for executing program instructions to implement the following functions: rendering and optimizing the original page of the low-code blueprint to obtain an optimized interface; obtaining the blueprint JSON data corresponding to the optimized interface, and parsing the blueprint JSON data; generating executable initial code based on the parsed blueprint JSON data; converting the initial code into an abstract syntax tree, and performing code optimization on the abstract syntax tree of the initial code.

[0015] According to another aspect of an embodiment of the present application, a non-volatile storage medium is also provided, the non-volatile storage medium including a stored computer program, wherein the device where the non-volatile storage medium is located executes any one of the above low-code blueprint optimization methods by running the computer program.

[0016] According to another aspect of an embodiment of the present application, a computer program product is also provided, including computer instructions, which, when executed by a processor, implement any one of the above low-code blueprint optimization methods.

[0017] In an embodiment of the present application, the original page of the low-code blueprint is rendered and optimized to obtain an optimized interface; the blueprint JSON data corresponding to the optimized interface is obtained, and the blueprint JSON data is parsed; an executable initial code is generated based on the parsed blueprint JSON data; the initial code is converted into an abstract syntax tree, and the abstract syntax tree of the initial code is optimized. The original page of the low-code blueprint is rendered and optimized to obtain an optimized interface, the blueprint JSON data corresponding to the optimized interface is parsed to obtain the initial code, and the initial code is optimized by converting it into a syntax tree, thereby reducing resource consumption and improving operating efficiency, thereby solving the technical problem in the related technology that the low-code blueprint has large resource consumption during operation, resulting in low operating efficiency. BRIEF DESCRIPTION OF THE DRAWINGS

[0018] The drawings described herein are used to provide a further understanding of the present application and constitute a part of the present application. The illustrative embodiments of the present application and their descriptions are used to explain the present application and do not constitute an improper limitation on the present application. In the drawings:

[0019] Figure 1 It is a hardware structure block diagram of a computer terminal for implementing an optimization method for a low-code blueprint according to an embodiment of the present application;

[0020] Figure 2 It is a flowchart of a method for optimizing a low-code blueprint provided according to an embodiment of the present application;

[0021] Figure 3 It is an overall architecture diagram of a low-code blueprint optimization method provided according to an embodiment of the present application;

[0022] Figure 4 It is a flowchart of another low-code blueprint optimization method provided according to an embodiment of the present application;

[0023] Figure 5 It is a structural diagram of a low-code blueprint optimization device provided according to an embodiment of the present application. DETAILED DESCRIPTION

[0024] In order to enable those skilled in the art to better understand the solution of the present application, the technical solution in the embodiments of the present application will be clearly and completely described below in conjunction with the drawings in the embodiments of the present application. Obviously, the described embodiments are only part of the embodiments of the present application, not all of the embodiments. Based on the embodiments in the present application, all other embodiments obtained by ordinary technicians in this field without creative work should fall within the scope of protection of the present application.

[0025] It should be noted that the terms "first", "second", etc. in the specification and claims of the present application and the above-mentioned drawings are used to distinguish similar objects, and are not necessarily used to describe a specific order or sequence. It should be understood that the data used in this way can be interchangeable where appropriate, so that the embodiments of the present application described herein can be implemented in an order other than those illustrated or described herein. In addition, the terms "including" and "having" and any of their variations are intended to cover non-exclusive inclusions, for example, a process, method, system, product or device comprising a series of steps or units is not necessarily limited to those steps or units clearly listed, but may include other steps or units that are not clearly listed or inherent to these processes, methods, products or devices.

[0026] In order to better understand the embodiments of the present application, the technical terms involved in the embodiments of the present application are explained as follows:

[0027] Low-code: Low-code development platforms are software development tools that allow developers to create applications through a graphical interface and a small amount of programming code. These platforms typically provide drag-and-drop components, visual modeling tools, and automatic code generation capabilities to speed up the development process and reduce the need for professional programming skills.

[0028] Blueprint: In a low-code development environment, blueprint is a visual logic orchestration tool used to design the business process and logical structure of an application. Blueprints represent logic such as data processing, business rules, and service calls through graphical components (such as nodes and flow lines), allowing developers to intuitively build and modify application logic, and serve as a bridge between developers and final applications.

[0029] Performance optimization: Performance optimization refers to the process of improving system performance indicators such as execution efficiency, response speed, and resource utilization by improving the system structure and algorithm and optimizing its operating environment. Performance optimization aims to adjust and improve the software system through a series of technical means and methods to improve its execution efficiency, response speed, resource utilization, and stability, thereby providing a better user experience and higher system reliability.

[0030] JSON (JavaScript Object Notation) data: JSON data is a standardized data format used to describe the structure of low-code blueprints. It is a lightweight data exchange format that is easy for people to read and write, and easy for machines to parse and generate. In the low-code development platform, the blueprint's logical structure, node attributes, connection relationships and other information can all be stored and transmitted in the form of JSON.

[0031] Canvas: It is a graphics rendering technology introduced in the fifth generation Hypertext Markup Language (HTML5), which provides a way to draw dynamic graphics and images directly on web pages.

[0032] The information collected in the embodiments of the present application is information and data authorized by the user or fully authorized by all parties, and the collection, storage, use, processing, transmission, provision, disclosure and application of the relevant data comply with the relevant laws, regulations and standards of the relevant regions, take necessary confidentiality measures, do not violate public order and good morals, and provide corresponding operation entrances for users to choose to authorize or reject automated decision-making results; if the user chooses to reject, the expert decision-making process will be entered.

[0033] The low-code blueprint optimization method embodiment provided in the embodiment of the present application can be executed in a mobile terminal, a computer terminal or a similar computing device. Figure 1 The hardware structure block diagram of a computer terminal for implementing an optimization method for a low-code blueprint is shown. Figure 1 As shown, the computer terminal 10 may include one or more (102a, 102b, ..., 102n are used to illustrate) processors (the processor may include but is not limited to a processing device such as a microprocessor MCU or a programmable logic device FPGA), a memory 104 for storing data, and a transmission module 106 for communication functions connected via a wired and / or wireless network. In addition, it may also include: a display, a keyboard, a cursor control device, an input / output interface (I / O interface), a universal serial bus (USB) port (which may be included as one of the ports of the I / O interface), a network interface, and a BUS bus. Those skilled in the art can understand that Figure 1 The structure shown is only for illustration and does not limit the structure of the above electronic device. Figure 1 More or fewer components as shown, or with Figure 1 Different configurations are shown.

[0034] It should be noted that the one or more processors and / or other data processing circuits described above may generally be referred to herein as "data processing circuits". The data processing circuits may be embodied in whole or in part as software, hardware, firmware, or any other combination thereof. In addition, the data processing circuit may be a single independent processing module, or may be incorporated in whole or in part into any of the other components in the computer terminal 10. As described in the embodiments of the present application, the data processing circuit acts as a processor control (e.g., selection of a variable resistor terminal path connected to an interface).

[0035] The memory 104 can be used to store software programs and modules of application software, such as the program instructions / data storage device corresponding to the optimization method of the low-code blueprint in the embodiment of the present application. The processor executes various functional applications and data processing by running the software programs and modules stored in the memory 104, that is, realizing the optimization method of the low-code blueprint mentioned above. The memory 104 may include a high-speed random access memory, and may also include a non-volatile memory, such as one or more magnetic storage devices, flash memory, or other non-volatile solid-state memory. In some instances, the memory 104 may further include a memory remotely arranged relative to the processor, and these remote memories may be connected to the computer terminal 10 via a network. Examples of the above-mentioned network include, but are not limited to, the Internet, an intranet, a local area network, a mobile communication network, and combinations thereof.

[0036] The transmission module 106 is used to receive or send data via a network. The specific example of the above network may include a wireless network provided by a communication provider of the computer terminal 10. In one example, the transmission module 106 includes a network adapter (Network Interface Controller, NIC), which can be connected to other network devices through a base station so as to communicate with the Internet. In one example, the transmission module 106 can be a radio frequency (RF) module, which is used to communicate with the Internet wirelessly.

[0037] The display may be, for example, a touch screen liquid crystal display (LCD) that enables a user to interact with a user interface of the computer terminal 10 .

[0038] It should be noted that, in some optional embodiments, the above Figure 1 The computer terminal shown may include hardware elements (including circuits), software elements (including computer code stored on a computer-readable medium), or a combination of hardware elements and software elements. It should be noted that Figure 1 This is merely one example of a particular embodiment and is intended to illustrate the types of components that may be present in the computer terminal described above.

[0039] Under the above-mentioned operating environment, an embodiment of the present application provides an optimization method embodiment of a low-code blueprint. It should be noted that the steps shown in the flowchart in the accompanying drawings can be executed in a computer system such as a set of computer executable instructions, and although the logical order is shown in the flowchart, in some cases, the steps shown or described can be executed in an order different from that shown here.

[0040] Figure 2 It is a flowchart of a low-code blueprint optimization method provided according to an embodiment of the present application, such as Figure 2 As shown, the method comprises the following steps:

[0041] Step S202, rendering optimization is performed on the original page of the low-code blueprint to obtain an optimized interface.

[0042] In the technical solution provided in step S202, there are many ways to optimize the rendering of the original page of the low-code blueprint to obtain an optimized interface. For example, the optimized interface can be obtained in the following ways: obtaining the number of operations of each component and element when generating the original page; dividing the original page into a static layer and a dynamic layer according to the number of operations, wherein the static layer contains components and elements in the original page whose number of operations is less than a first threshold, and the dynamic layer contains components and elements in the original page whose number of operations is greater than or equal to the first threshold; dividing the static layer and the dynamic layer into multiple independent small areas, and rendering each independent small area separately to obtain an optimized interface. This layered rendering technology can significantly reduce page loading time and improve user experience, and is suitable for dynamic web pages or applications that need to update content frequently.

[0043] In the above steps, after the original page is divided into a static layer and a dynamic layer according to the number of operations, in order to further reduce the rendering burden of the dynamic layer and improve the page response speed, the static content in the static layer can be drawn into the background layer; when the background layer contains all the static content in the static layer, the content in the background layer is transferred to the foreground layer for display. By separating static content from dynamic content, the rendering burden of the dynamic layer can be further reduced and the page response speed can be improved, which is particularly suitable for data-intensive applications such as reporting systems and data analysis platforms.

[0044] After the static layer and the dynamic layer are divided into multiple independent small areas, in order to further improve the page loading speed, the unchanged first graphic element in the static layer and the second graphic element in the dynamic layer with the number of operations greater than the second threshold can be obtained; the first graphic element and the second graphic element are cached as images. The application of caching technology can greatly reduce network requests and data processing, improve page loading speed, and is suitable for graphics-intensive applications such as game development, graphic design software, etc.

[0045] The following is a specific embodiment:

[0046] The layered rendering strategy based on the visual rendering optimization module optimizes the rendering of the original page of the low-code blueprint, which is divided into a static layer and a dynamic layer. Because the dynamic layer needs to be updated frequently, while the static layer remains relatively stable, the rendering burden is greatly reduced and the overall efficiency is improved. By reducing the rendering burden of frequently updated areas, the overall rendering efficiency is significantly improved. The layered rendering strategy is: when generating the original page, you first need to monitor and count the number of operations of each component or element, which includes but is not limited to user clicks, data updates, animation executions, etc. Event listeners and counters can be used, or the scripting language JavaScript can be used to count the number of operations of each element on the page (such as clicks, scrolling, data updates, etc.). Components and elements whose number of operations is less than the first threshold (for example, 5) are divided into the static layer, and components and elements whose number of operations is greater than or equal to the first threshold are divided into the dynamic layer.

[0047] For ease of management and rendering, the static layer and the dynamic layer can be divided into multiple independent small areas through block area drawing, and rendering can be performed separately in each independent small area to obtain an optimized interface. For example, block area drawing can use canvas as the underlying rendering cornerstone, and achieve regional drawing through the clipping capability of Canvas, and divide the canvas into multiple small blocks evenly to re-render only the changed areas, avoid redrawing the entire canvas, and improve rendering speed. The entire canvas is divided into independent area blocks by even division, and the dynamic layer and the static layer are divided into small areas. In the face of most changes, only the dynamic layer needs to be re-rendered, avoiding redrawing of the entire canvas.

[0048] The rendering process is as follows: create rendering environments for the static layer and the dynamic layer separately, and then render in these environments separately. In this way, when the page is updated, only small areas of the dynamic layer need to be re-rendered, while the static layer remains unchanged, which reduces the need for full page refresh. In the rendering of the dynamic layer, double buffering technology is applied. This means creating two Canvases, one for background rendering and the other for foreground display. After the background Canvas finishes rendering, its content will be quickly transferred to the foreground Canvas, thus avoiding the lag of the user interface.

[0049] Double buffering technology is used, that is, two canvases are set up, the foreground layer and the background layer. The background layer is responsible for pre-drawing the content of all time-consuming tasks, and then transferring it to the foreground layer for display at one time: drawing the static content in the static layer to the background layer; when the background layer contains all the static content in the static layer, the content in the background layer is transferred to the foreground layer for display. The foreground layer focuses on presentation without taking on additional computing load. The background layer is implemented with the help of the off-screen Canvas capability provided by canvas, which can avoid blocking the main thread and is suitable for scenes that require complex calculations and drawing in the background thread; because the calculations are not calculated in the main thread, this process can completely solve the problem of page jams in the main thread, but it also introduces a disadvantage, which is screen flickering and rendering delay (in the face of a large amount of calculation and drawing overhead, it takes a certain amount of time, and rendering transfer will inevitably cause delays and flickering). In order to solve the above screen flickering problem and enhance the visual smoothness during data conversion, the blur-sharp transition effect is incorporated. Before the area is updated, the area is blurred first, and then quickly sharpened after the update is completed, which can reduce the flickering and discontinuity perceived by the user. This makes interface changes more natural and smooth, optimizes user experience, and reduces visual flickering and discontinuity.

[0050] In order to solve the above-mentioned rendering delay problem, image caching technology is used to cache commonly used graphic elements (the second graphic elements in the dynamic layer whose operation times are greater than the second threshold, the second threshold is 8, for example) or unchanged elements as images (that is, the unchanged first graphic elements in the above-mentioned static layer) so as to quickly draw them when needed. Through image caching technology, commonly used or unchanged graphic elements are cached as images, which reduces repeated drawing calculations and improves rendering efficiency.

[0051] Step S204, obtaining the blueprint JSON data corresponding to the optimization interface, and parsing the blueprint JSON data.

[0052] In the technical solution provided in step S204, there are multiple ways to generate executable initial code based on the parsed blueprint JSON data, such as: obtaining node information, connection information and attribute information in the blueprint JSON data; determining the blueprint element model based on the node information, connection information and attribute information; constructing node functions and data flow code snippets based on the blueprint element model, wherein the data flow code is used to represent the flow direction between nodes; determining the initial code based on the node function and data flow code snippet. This method can quickly convert the visual design of the blueprint into executable code, accelerate the development process, and is suitable for rapid prototyping and agile development environments.

[0053] It should be noted that the initial code can be converted into an abstract syntax tree in many ways, such as: parsing the initial code to obtain the basic elements contained in the initial code; determining the grammatical structure of the initial code based on the basic elements; creating tree nodes of the abstract syntax tree based on the grammatical structure; connecting the tree nodes to obtain the abstract syntax tree. By creating an abstract syntax tree, the code structure can be understood more clearly, which is convenient for subsequent optimization and maintenance, and is suitable for scenarios such as code review, automated testing, and continuous integration.

[0054] The following is a specific embodiment:

[0055] The JSON data of the blueprint is parsed through the blueprint JSON parsing module, and the blocks are marked according to the necessity of the nodes and the node connection relationship, so as to optimize the processing of the blueprint structure. For example, the JSON data of the blueprint is parsed using JavaScript to extract the node information, connection information and attribute information: read and parse the information of all nodes and connections from the JSON data of the blueprint. Each node has a unique id, type (such as Addition, Constant, etc.), and possible inputs and outputs. The connection describes the connection relationship between nodes, including the id of the source node, the handle of the source node output, the id of the target node, and the handle of the target node input. According to the extracted node information, connection information and attribute information, the blueprint element model is determined: based on the parsed JSON data, a blueprint element model is created, in which each node is represented as an object containing its type, input and output information and attributes. This model is a bridge between blueprint visualization and code generation. It converts the graphical description into a more structured data representation for subsequent processing. According to the type of each node, the corresponding node function is generated. If the node is an Addition type, define a function that takes two parameters (usually representing inputs from other nodes) and returns the sum of the two parameters. If the node is a Constant type, define a function that returns the constant value of the node. These functions will be used to build the actual business logic. By traversing the wiring information, determine the order in which data flows in the blueprint. This usually involves identifying which nodes have no inputs (i.e. constant nodes or data sources), and then recursively processing the outputs of these nodes until all nodes have been processed. If there are circular dependencies in the blueprint, algorithms such as topological sorting need to be used to resolve the dependencies and ensure the correct execution order of the code snippets. For each node, generate a code snippet that contains the call of the node function and the storage of the result. If the node is a constant node with no input, the code snippet may simply be a constant assignment statement. For other nodes that require input, the code snippet will call the corresponding node function and use the result of the input node determined in the data flow order. Combine all generated code snippets in the data flow order to form a complete code snippet. In this code snippet, all node logics will be called and executed in sequence, and the final result can be the final output of the blueprint or some intermediate state. The following is a model and data flow code of an addition node and a constant node for obtaining node information, connection information, and attribute information in the blueprint JSON data:

[0056] Node 1: addition;

[0057] Node 2: constant 5;

[0058] Node 3: constant 3;

[0059] Connection: Node 2->Node 1;

[0060] Connection: Node 3 -> Node 1.

[0061] Step S206, generating executable initial code based on the parsed blueprint JSON data.

[0062] The following is a specific embodiment:

[0063] Based on the above parsed blueprint JSON data, a model of an addition node and a constant node and a data flow code are obtained, and the following initial code represented by natural language (for example, a JavaScript code) is generated:

[0064] 1. Create a variable additionNode, which is an object representing an addition operation node with a type attribute (value is Addition), and left and right attributes (initial value is null).

[0065] 2. Create a variable constantNode5, which is an object representing a constant node, whose type attribute is Constant and value attribute value is 5.

[0066] 3. Create another variable constantNode3, which also represents a constant node, with a type attribute of Constant and a value attribute of 3.

[0067] 4. Connect constantNode5 to the left attribute of additionNode, indicating that 5 is the left operand of the addition node.

[0068] 5. Connect constantNode3 to the right attribute of additionNode, indicating that 3 is the right operand of the addition node.

[0069] 6. Define a function evaluate that receives a parameter node, which indicates the node to be executed. The function determines the execution logic based on the type attribute of the parameter: if the value of the type attribute is Constant, the function returns the value of the value attribute; if the value of the type attribute is Addition, the function recursively executes the evaluate function to calculate the values ​​of the left operand and the right operand, and then adds the two values.

[0070] 7. Execute the evaluate function, pass in additionNode as a parameter, and get the calculation result of the entire blueprint.

[0071] 8. Assign the calculation result to the variable result.

[0072] 9. Output the value of the variable result to the console.

[0073] Step S208: convert the initial code into an abstract syntax tree, and perform code optimization on the abstract syntax tree of the initial code.

[0074] In the technical solution provided in step S208, there are many ways to optimize the abstract syntax tree of the initial code, for example: perform a depth-first traversal on the abstract syntax tree, convert the tree nodes in the abstract syntax tree into corresponding code snippets, and determine the code to be optimized contained in the abstract syntax tree; after optimizing the code to be optimized, obtain the target code snippet corresponding to each tree node; combine the target code snippet corresponding to each tree node to obtain the completed code file. The application of depth-first traversal and code optimization technology can effectively reduce code redundancy and improve execution efficiency, and is suitable for scenarios with high requirements for code execution efficiency, such as high-performance computing and big data processing.

[0075] The following is a specific embodiment:

[0076] Convert the initially generated JavaScript code into an abstract syntax tree (AST), which is a tree-like data structure used to describe the various elements in the source code (such as operators, variables, function calls, etc.). For example, the above initial code is converted into the following abstract syntax tree (JSON format):

[0077] 1. Define a constant called additionNode, which is an object with the type property set to Addition and the left and right properties initialized to empty.

[0078] 2. Define another constant constantNode5, which is also an object with a type attribute set to Constant and a value attribute set to the number 5.

[0079] 3. Also define a constant constantNode3, the object structure is similar to constantNode5, but the value attribute is set to 3.

[0080] 4. Assigning constantNode5 to the left attribute of additionNode means using the number 5 as the left operand of the addition node.

[0081] 5. Assigning constantNode3 to the right attribute of additionNode means using the number 3 as the right operand of the addition node.

[0082] 6. Define a function evaluate that takes a single parameter, node. The body of this function contains a conditional statement that checks if the type of node is Constant. If it is of type Constant, the function returns the value of the value property of node. If it is not of type Constant (in this case, it is implicitly of type Addition), the function recursively calls the evaluate function to calculate the left and right properties of node, and then returns the sum of the two results.

[0083] 7. Define a constant result, whose value is calculated by calling the evaluate function and passing in additionNode as a parameter. This actually starts the entire calculation process and finally calculates the value of additionNode, which is the sum of 5 and 3.

[0084] 8.Finally, a function is used to output the value of result, which is 8.

[0085] The completed code file obtained by building the abstract syntax tree (AST) module requires depth-first traversal of the AST to convert each node into a corresponding code snippet. The various code snippets are combined into a complete code file to ensure that the logical order is correct and the syntax is correct. During the code generation process, the generated code is further optimized. For example, dead code elimination (deleting code that will not be executed), recursive looping, loop unrolling (reducing the number of loops), eliminating redundant code, code compression, etc. Ensure high performance and low latency at runtime. It should be noted that the various modules of the process are an independent whole. When a large number of conversions need to be processed, the multi-line parallel execution module can be used to coordinate the use of related resources to make full use of the performance of multi-core processors and improve conversion efficiency.

[0086] The following is the implementation process of performing a depth-first traversal of the abstract syntax tree and converting the tree nodes in the abstract syntax tree into corresponding code snippets:

[0087] Depth-First Search (DFS) is an algorithm for traversing or searching a tree or graph. It starts from the starting node and searches the branches of the tree as deeply as possible until it reaches a leaf node, then backtracks to the previous node and continues to go deeper into the unsearched branches until all nodes are visited. In AST, this means starting from the root node and recursively visiting its child nodes until the entire tree structure is traversed. During the traversal process, each time a node type is encountered, the corresponding code generation function is executed. For example, if a function definition node is encountered, a code snippet of the function declaration will be generated; if a variable declaration node is encountered, the code of the variable definition will be generated, and so on. This usually requires defining a conversion function for each AST node type. Depending on the AST node type, the corresponding code snippet is generated. For example, if the node represents an addition operation, a code snippet of an addition expression will be generated; if the node represents a variable assignment, a code snippet of an assignment statement will be generated. For more complex nodes, such as loop structures or conditional branches, the generated code snippet will be more complex and need to include the code of the loop body or conditional branch.

[0088] Determine the code to be optimized contained in the abstract syntax tree, and optimize the code to be optimized. The optimization methods may include: dead code elimination (deleting code that will not be executed), recursive looping, loop unrolling (reducing the number of loops), eliminating redundant code, code compression, etc. After the optimization is completed, combine all target code fragments into a complete code file.

[0089] Through the above steps, the execution efficiency and page loading speed of low-code blueprints can be significantly improved. Especially in enterprise-level application development, it can quickly respond to business needs and improve development efficiency.

[0090] The present application also provides an overall architecture diagram of a low-code blueprint optimization method, such as Figure 3 As shown, it includes the following stages:

[0091] Blueprint logic orchestration stage: In the browser, according to the results of user orchestration, the orchestration JSON is formed and rendered to the visual interface. The visual rendering optimization module is responsible for providing efficient user interface display in the blueprint logic orchestration stage. Its main goal is to ensure a smooth user experience even when dealing with complex blueprint structures. Specific optimization measures include: Layered rendering strategy: Divide the interface into static and dynamic layers, and significantly improve the overall rendering efficiency by reducing the rendering burden of frequently updated areas. Block area drawing: Use the area drawing function of Canvas to divide the canvas into multiple small blocks to re-render only the changed areas, avoid redrawing the entire canvas, and improve the rendering speed. Double buffering technology: Use two canvases, the foreground layer and the background layer, and draw static content in the background and then transfer it to the foreground layer for display, thereby reducing the computational burden of the foreground layer. Asynchronous drawing: Use OffscreenCanvas to perform drawing operations in Web Workers to avoid blocking the main thread, reduce page freezes and rendering delays. Blur oversharpening: Introduce blur sharpening effects to smooth interface changes, optimize user visual experience, and reduce visual flickering and discontinuity. Efficient graphics update: Through image caching technology, commonly used or unchanged graphic elements are cached as images, reducing repeated drawing calculations and improving rendering efficiency. The above process is the process of rendering and optimizing the original page of the low-code blueprint to obtain the optimized interface, which will not be repeated here.

[0092] Upload the blueprint JSON to the server, decompose the logic of the blueprint JSON, compile it into code, optimize the corresponding code content and store it in the database (that is, convert the tree nodes in the abstract syntax tree into corresponding code snippets, combine the target code snippets corresponding to each tree node, and obtain the completed code file). When running, the compiled code can be directly loaded to achieve efficient operation of the blueprint. The visualization and operation separation module is responsible for a design idea that separates the design phase from the execution phase of the blueprint. This separation helps to improve the overall performance and maintainability of the system. The design phase focuses on the creation and editing of the blueprint, while the execution phase focuses on the execution of the blueprint and the output of the results. Specifically include: Blueprint JSON parsing module: parse the JSON data of the blueprint, mark the blocks according to the necessity of the nodes and the connection relationship between the nodes, and optimize the processing of the blueprint structure. Dynamic code generation module: preliminarily build executable JavaScript code (that is, the above-mentioned initial code) based on the parsed blueprint JSON to prepare for further optimization and conversion. Build abstract syntax tree (AST) module: convert the preliminarily generated JavaScript code into AST, which is a tree-like data structure used to describe each element in the source code. Code optimization algorithm module: optimize AST, apply dead code elimination, recursive looping, code compression and other technologies to build efficient and high-performance code Multi-threaded parallel execution module: improve the efficiency of the server by breaking down complex tasks into multiple independent modules and using multi-threaded parallel processing of these modules. Store the executable code in the code storage module, and send the code generated by the request to the blueprint running stage for code running. The implementation process of each of the above steps has been described in detail in the above embodiments and will not be repeated here.

[0093] The present application embodiment also provides a flowchart of another low-code blueprint optimization method, such as Figure 4 As shown:

[0094] First, through the blueprint logic orchestration stage, the user implements the orchestration business logic through the visualization panel, and sends the JSON of the orchestration result to the visualization rendering optimization module for rendering optimization (that is, the above-mentioned rendering optimization of the original page of the low-code blueprint is performed to obtain an optimized interface). The orchestration results are efficiently fed back to the visualization platform and efficiently rendered to the visualization interface. After editing, it is uploaded to the server. Through the visualization and operation separation module, the orchestrated business logic is converted into executable code (that is, the completed code file mentioned above) and written to the database. On the server, the orchestrated data and executable code can be stored to obtain executable JS (JavaScript) code, and the browser can directly run the executable code.

[0095] The present application also provides a schematic diagram of a low-code blueprint optimization device. Figure 5 As shown, including:

[0096] The first optimization module 502 is used to optimize the rendering of the original page of the low-code blueprint to obtain an optimized interface.

[0097] The first optimization module 502 is also used to obtain the number of operations of each component and element when generating the original page; divide the original page into a static layer and a dynamic layer according to the number of operations, wherein the static layer contains components and elements in the original page whose number of operations is less than a first threshold, and the dynamic layer contains components and elements in the original page whose number of operations is greater than or equal to the first threshold; divide the static layer and the dynamic layer into multiple independent small areas, and render them in each independent small area to obtain an optimized interface.

[0098] The first optimization module 502 is further configured to draw the static content in the static layer into the background layer; when the background layer contains all the static content in the static layer, the content in the background layer is transferred to the foreground layer for display.

[0099] The first optimization module 502 is further configured to obtain a first graphic element that remains unchanged in the static layer and a second graphic element in the dynamic layer whose operation times are greater than a second threshold; and cache the first graphic element and the second graphic element as an image.

[0100] The parsing module 504 is used to obtain the blueprint JSON data corresponding to the optimization interface and parse the blueprint JSON data.

[0101] The generation module 506 is used to generate executable initial code according to the parsed blueprint JSON data.

[0102] The generation module 506 is also used to obtain the node information, connection information and attribute information in the blueprint JSON data; determine the blueprint element model based on the node information, connection information and attribute information; construct node functions and data flow code snippets based on the blueprint element model, wherein the data flow code is used to indicate the flow direction between nodes; determine the initial code based on the node function and the data flow code snippet.

[0103] The second optimization module 508 is used to convert the initial code into an abstract syntax tree and perform code optimization on the abstract syntax tree of the initial code.

[0104] The second optimization module 508 is also used to parse the initial code to obtain basic elements contained in the initial code; determine the grammatical structure of the initial code based on the basic elements; create tree nodes of the abstract syntax tree based on the grammatical structure; and connect the tree nodes to obtain the abstract syntax tree.

[0105] The second optimization module 508 is also used to perform a depth-first traversal on the abstract syntax tree, convert the tree nodes in the abstract syntax tree into corresponding code snippets, and determine the code to be optimized contained in the abstract syntax tree; after optimizing the code to be optimized, obtain the target code snippet corresponding to each tree node; combine the target code snippets corresponding to each tree node to obtain a completed code file.

[0106] It should be noted that Figure 5 The optimized device of the low-code blueprint shown is used to execute Figure 2 The optimization approach of the low-code blueprint shown, therefore Figure 2 The relevant explanations in the optimization method of the low-code blueprint also apply to the optimization device of the low-code blueprint and will not be repeated here.

[0107] An embodiment of the present application also provides an electronic device, which includes a memory and a processor, wherein the memory is used to store program instructions; the processor is connected to the memory, and is used to execute program instructions to implement the following functions: rendering and optimizing the original page of the low-code blueprint to obtain an optimized interface; obtaining the blueprint JSON data corresponding to the optimized interface, and parsing the blueprint JSON data; generating executable initial code based on the parsed blueprint JSON data; converting the initial code into an abstract syntax tree, and performing code optimization on the abstract syntax tree of the initial code.

[0108] An embodiment of the present application also provides a non-volatile storage medium, which includes a stored computer program, wherein the device where the non-volatile storage medium is located executes the following low-code blueprint optimization method by running the computer program: rendering and optimizing the original page of the low-code blueprint to obtain an optimized interface; obtaining the blueprint JSON data corresponding to the optimized interface, and parsing the blueprint JSON data; generating executable initial code based on the parsed blueprint JSON data; converting the initial code into an abstract syntax tree, and performing code optimization on the abstract syntax tree of the initial code.

[0109] An embodiment of the present application also provides a computer program product, including computer instructions, which, when executed by a processor, implement the steps of the optimization method of the low-code blueprint in each embodiment of the present application.

[0110] An embodiment of the present application also provides a computer program, which, when executed by a processor, implements the steps of the optimization method of the low-code blueprint in each embodiment of the present application.

[0111] The serial numbers of the above-mentioned embodiments of the present application are for description only and do not represent the advantages or disadvantages of the embodiments.

[0112] In the above embodiments of the present application, the description of each embodiment has its own emphasis. For parts that are not described in detail in a certain embodiment, please refer to the relevant description of other embodiments.

[0113] In the several embodiments provided in this application, it should be understood that the disclosed technical content can be implemented in other ways. Among them, the device embodiments described above are only schematic. For example, the division of the units can be a logical function division. There may be other division methods in actual implementation. For example, multiple units or components can be combined or integrated into another system, or some features can be ignored or not executed. Another point is that the mutual coupling or direct coupling or communication connection shown or discussed can be through some interfaces, indirect coupling or communication connection of units or modules, which can be electrical or other forms.

[0114] The units described as separate components may or may not be physically separated, and the components shown as units may or may not be physical units, that is, they may be located in one place or distributed on multiple units. Some or all of the units may be selected according to actual needs to achieve the purpose of the present embodiment.

[0115] In addition, each functional unit in each embodiment of the present application may be integrated into one processing unit, or each unit may exist physically separately, or two or more units may be integrated into one unit. The above-mentioned integrated unit may be implemented in the form of hardware or in the form of software functional units.

[0116] If the integrated unit is implemented in the form of a software functional unit and sold or used as an independent product, it can be stored in a computer-readable storage medium. Based on this understanding, the technical solution of the present application, in essence, or the part that contributes to the prior art or all or part of the technical solution can be embodied in the form of a software product, and the computer software product is stored in a storage medium, including a number of instructions to enable a computer device (which can be a personal computer, a server or a network device, etc.) to perform all or part of the steps of the method described in each embodiment of the present application. The aforementioned storage medium includes: U disk, read-only memory (ROM, Read-Only Memory), random access memory (RAM, Random Access Memory), mobile hard disk, disk or optical disk and other media that can store program codes.

[0117] The above is only a preferred implementation of the present application. It should be pointed out that for ordinary technicians in this technical field, several improvements and modifications can be made without departing from the principles of the present application. These improvements and modifications should also be regarded as the scope of protection of the present application.

Claims

1. A method for optimizing a low-code blueprint, characterized in that: include: Optimize the rendering of the original page of the low-code blueprint to obtain an optimized interface; Obtaining the blueprint JSON data corresponding to the optimization interface, and parsing the blueprint JSON data; Generate executable initial code based on the parsed blueprint JSON data; The initial code is converted into an abstract syntax tree, and code optimization is performed on the abstract syntax tree of the initial code.

2. The method according to claim 1, characterized in that Optimize the rendering of the original page of the low-code blueprint to obtain an optimized interface, including: Obtain the number of operations of each component and element when generating the original page; Dividing the original page into a static layer and a dynamic layer according to the number of operations, wherein the static layer includes components and elements in the original page whose number of operations is less than a first threshold, and the dynamic layer includes components and elements in the original page whose number of operations is greater than or equal to the first threshold; The static layer and the dynamic layer are divided into a plurality of independent small areas, and rendering is performed in each independent small area to obtain the optimized interface.

3. The method according to claim 2, characterized in that After dividing the original page into a static layer and a dynamic layer according to the number of operations, the method further includes: Drawing the static content in the static layer into the background layer; In a case where the background layer contains all the static contents in the static layer, the contents in the background layer are transferred to the foreground layer for display.

4. The method according to claim 2, characterized in that: After dividing the static layer and the dynamic layer into a plurality of independent small areas, the method further includes: Acquire a first graphic element that remains unchanged in the static layer and a second graphic element in the dynamic layer whose operation times are greater than a second threshold; The first graphical element and the second graphical element are cached as images.

5. The method according to claim 1, characterized in that Generates executable initial code based on the parsed blueprint JSON data, including: Obtain node information, connection information and property information in the blueprint JSON data; Determine a blueprint element model according to the node information, the connection information and the attribute information; According to the blueprint element model, construct node functions and data flow code snippets, wherein the data flow code is used to represent the flow direction between nodes; The initial code is determined according to the node function and the data flow code fragment.

6. The method according to claim 1, characterized in that Converting the initial code into an abstract syntax tree includes: Parsing the initial code to obtain basic elements contained in the initial code; Determining the grammatical structure of the initial code according to the basic elements; Creating a tree node of the abstract syntax tree according to the grammatical structure; The tree nodes are connected to obtain the abstract syntax tree.

7. The method according to claim 1, characterized in that The abstract syntax tree of the initial code is optimized, including: Performing a depth-first traversal on the abstract syntax tree, converting tree nodes in the abstract syntax tree into corresponding code snippets, and determining the code to be optimized contained in the abstract syntax tree; After optimizing the code to be optimized, a target code fragment corresponding to each tree node is obtained; Combine the target code snippets corresponding to each tree node to get the completed code file.

8. A low-code blueprint optimization device, characterized in that: include: The first optimization module is used to optimize the rendering of the original page of the low-code blueprint to obtain an optimized interface; A parsing module, used to obtain the blueprint JSON data corresponding to the optimization interface and parse the blueprint JSON data; The generation module is used to generate executable initial code based on the parsed blueprint JSON data; The second optimization module is used to convert the initial code into an abstract syntax tree and perform code optimization on the abstract syntax tree of the initial code.

9. An electronic device, characterized in that: include: A memory for storing program instructions; A processor, connected to the memory, for executing program instructions to implement the following functions: rendering and optimizing an original page of a low-code blueprint to obtain an optimized interface; Obtaining the blueprint JSON data corresponding to the optimization interface, and parsing the blueprint JSON data; Generate executable initial code based on the parsed blueprint JSON data; The initial code is converted into an abstract syntax tree, and code optimization is performed on the abstract syntax tree of the initial code.

10. A non-volatile storage medium, characterized in that: The non-volatile storage medium includes a stored computer program, wherein the device where the non-volatile storage medium is located executes the low-code blueprint optimization method described in any one of claims 1 to 7 by running the computer program.

11. A computer program product comprising computer instructions, characterized in that: When the computer instructions are executed by a processor, they implement the optimization method of the low-code blueprint described in any one of claims 1 to 7.

Images