Canvas node dynamic storage system and management method based on multi-way tree

Abstract

The invention discloses a canvas node dynamic storage system and management method based on a multi-way tree, and belongs to the technical field of data storage, and the storage system comprises a node division unit which is used for dividing canvas data contained in canvas into a plurality of nodes and constructing basic information fields and data management fields of the nodes, the data management field comprises a father node ID, a right node ID and a left node ID; the multi-way tree construction unit is used for enabling the nodes to form a multi-way tree structure according to the data management fields, the father node ID is an identifier of a node at the upper level of the nodes, and the right node ID is an identifier of a node on the right side in the same level of the nodes; the left node ID is an identifier of a node on the left side in the same level of the nodes. Through the storage system and the management method based on the storage system, the query positioning time of the canvas nodes is shortened.

Description

TECHNICAL FIELD

[0001] The present application relates to the technical field of data storage, and more particularly to a canvas node dynamic storage system based on a multi-way tree and a management method. BACKGROUND

[0002] The storage of a traditional canvas node usually adopts a JSON tree structure or a linear table structure. Figure 1 As shown in the figure, in the JSON tree, each node saves child nodes in an array form through a children field, and the parent-child relationship is expressed as a strict single-parent hierarchical nesting. For example, the root node A contains child nodes B and C, node B contains child nodes D and E, and node C contains child node F. In this structure, the spatial position of a node is determined by the array index under its parent node. For example, the order of the child nodes D and E of node B is fixedly represented by the array [D, E], and adjacent nodes need to be queried by traversing the array; the hierarchical relationship is only expressed through the parent-child chain, and lacks horizontal association capability.

[0003] Due to the limitation of the storage structure, the traditional JSON tree causes active problems in the application and management of data, such as low query efficiency: finding adjacent nodes (such as left / right sibling nodes) of a certain node needs to traverse the child node array of the parent node, and the time complexity is O(n), which becomes a performance bottleneck especially when the number of child nodes is large; it is difficult to quickly locate spatially adjacent elements, for example, finding left and right elements adjacent to a certain node in the canvas needs to traverse all nodes.

[0004] Hierarchical redundancy and nesting limitation: the traditional single-parent node structure is difficult to express complex nested relationships (such as multiple parent nodes sharing child nodes or cross-level relative position relationships), resulting in data redundancy.

[0005] Update and memory consumption problem: modifying a single node needs to serialize the entire JSON tree or completely load it into memory, resulting in frequent I / O operations and high memory occupation; when dynamically inserting a child node, the child node array under the parent node needs to be reconstructed, and the complexity is O(n).

[0006] Therefore, it is urgent to design a new canvas node storage system to realize the fast management and query of canvas nodes. SUMMARY

[0007] Therefore, the present application provides a canvas node dynamic storage system based on a multi-way tree and a management method, which is used to at least solve some of the technical problems in the background art.

[0008] In order to achieve the above purpose, the present application adopts the following technical solutions:

[0009] The present application first discloses a canvas node dynamic storage system based on a multi-way tree, comprising:

[0010] a node division unit, configured to divide canvas data contained in a canvas into a plurality of nodes, and construct a class structure of each node, the class structure comprising a basic information field and a data management field of the node, the data management field comprising a parent node ID, a rightward node ID and a leftward node ID, and the basic information field comprising a position field, a node level field, an identifier field and a node type field;

[0011] a multi-ary tree construction unit, configured to form the nodes into a multi-ary tree structure according to the parent node ID, the rightward node ID and the leftward node ID in the class structure, wherein the parent node ID is an identifier of a node at a higher level of the node, the rightward node ID is an identifier of a node on the right side of the node at the same level, and the leftward node ID is an identifier of a node on the left side of the node at the same level.

[0012] Further, the node level field is configured to represent a level of the node in the multi-ary tree structure, and when the node is a root node, the node level field is represented by a number 0.

[0013] Further, the identifier field comprises an is_root field and an is_leaf field, the is_root field representing whether the current node is a root node of the canvas, and the is_leaf field representing whether the current node contains a child node.

[0014] Further, the node type field is configured to distinguish node types by enumeration values, including a material, a font, an icon and a palette group.

[0015] The application further discloses a multi-ary tree-based dynamic storage management method for canvas nodes, comprising the following steps.

[0016] constructing a dynamic storage system for canvas nodes:

[0017] divide canvas data contained in a canvas into a plurality of nodes, and construct a class structure of each node, the class structure comprising a basic information field and a data management field of the node, the data management field comprising a parent node ID, a rightward node ID and a leftward node ID, and the basic information field comprising a position field, an identifier field and a node type field; form the nodes into a multi-ary tree structure according to the parent node ID, the rightward node ID and the leftward node ID in the class structure, wherein the parent node ID is an identifier of a node at a higher level of the node, the rightward node ID is an identifier of a node on the right side of the node at the same level, and the leftward node ID is an identifier of a node on the left side of the node at the same level.

[0018] The constructed canvas node dynamic storage system realizes the relationship management of the canvas nodes, including vertical hierarchical relationship management and horizontal hierarchical relationship management.

[0019] Further, the vertical relationship management of the canvas nodes is realized, and specifically includes:

[0020] Query management: when all ancestor nodes of a certain node need to be queried, the vertical data chain composed of the parent node IDs is traversed upward by recursion or iteration.

[0021] Further, the horizontal relationship management of the canvas nodes is realized, and specifically includes:

[0022] Query management: when the nodes of the current level of a certain node need to be queried, the horizontal data chain composed of all rightward node IDs and leftward node IDs in the current level of the node is traversed by recursion or iteration.

[0023] Insertion management:

[0024] When the head is inserted, the rightward node ID of the inserted new node points to the original head node.

[0025] When the tail is inserted, the leftward node ID of the inserted new node points to the original tail node.

[0026] When the middle is inserted, the rightward node ID of the predecessor node and the leftward node ID of the successor node are modified, so that the rightward node ID of the predecessor node and the leftward node ID of the successor node both point to the inserted new node.

[0027] Further, the above management method further includes:

[0028] The deletion management of the canvas nodes:

[0029] The predecessor node corresponding to the leftward node ID of the node to be deleted and the successor node corresponding to the rightward node ID of the node to be deleted are queried, the rightward node ID of the predecessor node is set as the rightward node ID of the node to be deleted, and the leftward node ID of the successor node is set as the leftward node ID of the node to be deleted.

[0030] All child nodes of the node to be deleted are deleted by depth-first traversal.

[0031] According to the above technical solution, compared with the prior art, the application discloses a canvas node dynamic storage system and management method based on a multi-way tree, which has the following beneficial effects:

[0032] The application constructs a horizontal bidirectional linked list through the rightward node ID and the leftward node ID, and when the nodes are queried and positioned, the child node list of the parent node does not need to be traversed, the query time can be effectively reduced, and the fast positioning and querying of the canvas nodes are realized. BRIEF DESCRIPTION OF DRAWINGS

[0033] In order to more clearly illustrate the technical solutions in the embodiments of the present application or the prior art, the following will briefly introduce the drawings needed to be used in the embodiments or prior art description. Obviously, the drawings in the following description only constitute a part of the embodiments of the present application, and for those skilled in the art, other drawings can also be obtained based on the provided drawings without creative labor.

[0034] Figure 1 The JSON tree structure schematic diagram provided in the background of the present application.

[0035] Figure 2 The canvas node dynamic storage management method flowchart based on the multi-way tree provided in the embodiments of the present application. DETAILED DESCRIPTION

[0036] The technical solutions in the embodiments of the present application will be described clearly and completely in the following with reference to the drawings in the embodiments of the present application. Obviously, the described embodiments only constitute a part of the embodiments of the present application, rather than all the embodiments. Based on the embodiments in the present application, all other embodiments obtained by those skilled in the art without creative labor are within the protection scope of the present application.

[0037] The embodiments of the present application disclose a canvas node dynamic storage system based on a multi-way tree. The dynamic storage system comprises a node division unit and a multi-way tree construction unit. The node division unit is used to divide canvas data contained in a canvas into a plurality of nodes and construct a class structure of each node. The class structure comprises a basic information field and a data management field of the node. The data management field comprises a parent node ID (parent_id), a right node ID (right_id) and a left node ID (right_id). The basic information field comprises a position field, a node level field, an identifier field and a node type field. The multi-way tree construction unit is used to form a multi-way tree structure according to the parent node ID, the right node ID and the left node ID in the class structure. The parent node ID is an identifier of a node at a higher level of the node. The right node ID is an identifier of a node at a right side of the node at the same level. The left node ID is an identifier of a node at a left side of the node at the same level.

[0038] Specifically, in the above-mentioned canvas node dynamic storage system, the node level field is used to represent the level of the node in the multi-way tree structure. When the node is a root node, the node level field is represented by the number 0.

[0039] The identifier field includes an is_root field and an is_leaf field, the is_root field indicates whether the current node is a root node of the canvas (generally, is_root=1 indicates that the current node is a root node of the canvas), and the is_leaf field indicates whether the current node contains a child node (generally, is_leaf=1 indicates that the current node has no child node), and the setting of the identifier field can be used to optimize the rendering process: the rendering engine can skip the child tree traversal of the leaf node and directly draw its own content, thereby reducing the amount of calculation.

[0040] The node type field (node_type) is used to distinguish the node type by enumeration value, such as 0=material, 1=font, 2=icon, and 3=canvas group. Different types of nodes can correspond to differentiated management strategies: canvas group (node_type=3): allow to contain child nodes, and the size is automatically calculated by the child nodes (such as width=maximum right boundary of the child node). Material node (node_type=0): reference external resources (such as pictures, vector graphics), need to associate element_id to point to specific files in the resource library.

[0041] Based on the above storage system, the embodiment of the application further discloses a multi-way tree-based canvas node dynamic storage management method, as shown in the following formula (1): Figure 2 The method comprises the following steps:

[0042] Constructing a canvas node dynamic storage system:

[0043] Dividing the canvas data contained in the canvas into multiple nodes, and constructing the class structure of each node, the class structure including the basic information field and the data management field of the node, the data management field including the parent node ID, the right node ID and the left node ID, and the basic information field including the position field, the identifier field and the node type field;

[0044] According to the parent node ID, the right node ID and the left node ID in the class structure, the nodes form a multi-way tree structure, wherein the parent node ID is the identifier of the upper node of the node, the right node ID is the identifier of the right node in the same level of the node, and the left node ID is the identifier of the left node in the same level of the node;

[0045] Based on the constructed canvas node dynamic storage system, the relationship management of the canvas nodes is realized, including vertical hierarchical relationship management and horizontal hierarchical relationship management.

[0046] The management method disclosed by the application will be further described in combination with specific embodiments.

[0047] 1) Node insertion flow management: (take the example of inserting child node F at the tail of the linked list of parent node B) Specifically, the following steps are included:

[0048] Initialize node metadata:

[0049] Generate a unique identifier: generate F.snowflake_id through the snowflake algorithm to ensure that the ID is globally unique in a distributed environment.

[0050] Set the hierarchical relationship: F.parent_id=B.id, F.node_level=B.node_level+1.

[0051] Mark the node type: set F.node_type according to the inserted content (e.g. set to 0 if a picture material is inserted).

[0052] Position the insertion location:

[0053] Query the current last child node E of parent node B: query all nodes with parent_id=B.id through B.id, and filter out the tail node by right_id=0.

[0054] If B has no child nodes (i.e. B.is_leaf=1), directly set F.left_id=0, F.right_id=0, and update the is_leaf flag of B to 0.

[0055] Update the linked list pointer:

[0056] Modify the right_id of the original tail node E to F.id.

[0057] Set the left_id of F to E.id and the right_id of F to 0.

[0058] Update the space metadata:

[0059] If B is a palette group (B.node_type=3), automatically adjust the size of B:

[0060] B.width = max(B.width, F.left_position + F.width)

[0061] B.height = max(B.height, F.top_position + F.height)

[0062] If the position of F exceeds the current range of the canvas, trigger the automatic expansion logic of the canvas.

[0063] Database transaction processing:

[0064] The atomicity of the following operations is guaranteed using the @Transactional annotation:

[0065] Insert a record for the new node F.

[0066] Update the right_id field of E.

[0067] Update the is_leaf and size fields of B.

[0068] Optimize I / O performance through batch update and reduce the number of database connections.

[0069] Through the above method, the following beneficial effects can be achieved:

[0070] Reduce time complexity: the insertion operation only needs to modify the pointers of adjacent nodes, with a time complexity of O (1), while the traditional array structure needs O (n) time to move elements.

[0071] Reduce memory usage: only the metadata of parent node B and its direct child node E need to be loaded, reducing memory consumption by 80% compared to full tree loading.

[0072] 2) Node deletion process management (take deleting node D and its subtree as an example), which includes the following steps:

[0073] Break the link list relationship:

[0074] Query the predecessor node (left_id) and successor node (right_id) of D.

[0075] If there is a predecessor node C, the original right_id of C is D node, after deleting D node, the right_id of C is: if D has a successor node E, then the right_id of C = E, if there is no right_id of C is Null.

[0076] If there is a successor node E, set E.left_id to: if D has a predecessor node C, then E.left_id = C; if not, E.left_id = Null.

[0077] Recursively delete the subtree:

[0078] Delete all child nodes of D through depth-first search (DFS), after deleting D node, the entire node contains all the tree nodes under the node, the original node position is not preserved.

[0079] Batch delete database records using the batchDelete interface to reduce the number of SQL statement executions.

[0080] Update the parent node status:

[0081] Check if the child node linked list of parent node B is empty (i.e., B.left_id = 0 and B.right_id = 0).

[0082] If it is empty, set B.is_leaf = 1 and reset its size to the default value (e.g., width = 0, height = 0).

[0083] Resource release:

[0084] If D is a material node (node_type = 0), call iDrawingBoardElementService.deleteElement(D.element_id) to delete the associated image or vector file.

[0085] If D is a drawing board group, release the occupied canvas space and trigger the position rearrangement of adjacent nodes.

[0086] Through the above methods, the following beneficial effects can be achieved

[0087] Improved deletion efficiency: subtree deletion quickly locates child nodes through the pre-stored node_level field, avoiding full tree traversal.

[0088] Improved transaction consistency: through database transactions, the atomicity of linked list relationships, subtree deletion, and resource release is guaranteed, preventing data inconsistency.

[0089] 3) Node update strategy (taking adjusting node size as an example) includes the following steps:

[0090] Local attribute modification:

[0091] Update the width and height fields, for example, adjust the width of node D from 80.0 to 120.0.

[0092] Layout recalculation:

[0093] If D belongs to drawing board group B (B.node_type = 3), trigger the automatic layout of the group:

[0094] If the size adjustment of D causes collision with other nodes (e.g., E), trigger the collision handling logic:

[0095] Horizontal direction: move E to the right (E.left_position += D.width - original width).

[0096] Vertical direction: If there is overlap, translate E down to the bottom of D.

[0097] Batch update optimization:

[0098] Use the batchUpdate interface to submit the modifications of D and E at the same time, reducing the number of database transaction commits.

[0099] Group by parent node ID through Collectors.groupingBy and process different groups of update operations in parallel.

[0100] In addition to the above method, the embodiment of the application also discloses a query optimization algorithm, specifically comprising the following steps:

[0101] Spatial adjacent query, including horizontal adjacent query and vertical adjacent query, specifically, left and right sibling nodes are directly obtained through left_id and right_id to perform horizontal adjacent query, for example, querying right adjacent nodes of node D, directly reading D.right_id=E. Vertical adjacent query is performed in combination with node_level and position data, for example, querying nodes located directly below node D

[0102] Cross-level relationship determination, including ancestor path query: specifically, all ancestor nodes are obtained through recursive query of parent_id chain to perform query, for example, the ancestor path of node E is B→A.

[0103] Descendant node traversal: specifically, a subtree is screened through node_level and parent_id, for example, querying all descendants of node B.

[0104] In addition, range query acceleration can also be implemented, specifically, the acceleration can be implemented through spatial index construction, a composite index is created on the left_position and top_position fields, and the following query is optimized. Specifically, the composite index is stored in a defined column order (such as col1, col2 from left to right) through a B + tree structure, the columns need to be matched from left to right during query, the index is used to quickly locate data or directly cover the query result, reducing disk I / O and table lookup operations.

[0105] A quadtree partitioning can also be used: specifically, the canvas is divided into multiple regions during storage, and each region maintains an independent subtree, reducing the query range.

[0106] The application realizes the composite structure design of the multiway tree and the horizontal linked list of the canvas node storage system, and the specific principle is that the mechanism is:

[0107] Longitudinal multi-tree structure implementation mechanism: Each node points to its direct parent node through parent_id, forming a tree hierarchy. For example, the parent_id of root node A is 0, and the parent_id of its child nodes B and C is A. The tree structure supports unlimited hierarchical nesting and is suitable for complex canvas scenarios (such as multi-layer group nesting, page - palette - layer three-level structure). For example, there are A layer, B layer, and C layer in the canvas; C layer is nested in B layer, and B layer is nested in A layer. In the data structure, the tree represented by C layer is a child node of the tree represented by B layer, and the tree represented by B layer is a child node of the tree represented by A layer.

[0108] The parent_id chain can be queried recursively to obtain the complete path from the root node to the current node in O (h) time.

[0109] In addition, the sub-trees of different parent nodes do not interfere with each other during storage and query, supporting parallel processing.

[0110] Lateral double-linked list structure implementation mechanism: Each node constructs a sibling node linked list under the same parent node through left_id and right_id. For example, child nodes D and E of parent node B form a linked list: D→E. The linked list supports bidirectional traversal, and can be searched forward through left_id or backward through right_id.

[0111] Through the above lateral double-linked list structure, O (1) time complexity insertion / deletion can be achieved: when inserting node F in the middle of the linked list, only the pointers of the predecessor node E and the successor node G of F need to be modified (E.right_id=F, G.left_id=F).

[0112] Spatial locality optimization: adjacent nodes are as close as possible in physical storage to improve cache hit rate.

[0113] Dynamic balancing mechanism: when the tree structure is too deep (such as node_level>20), the balancing operation is automatically triggered, and the deep layer nodes are promoted to logical groups (node_type=3), reducing the recursive query overhead.

[0114] Mixed index strategy: joint index is established on the parent_id, left_id, and right_id fields (such as INDEXidx_parent_left_right (parent_id, left_id, right_id)), accelerating composite queries.

[0115] As a further optimization extension of the embodiment of the present application, the above method further comprises a metadata pre-computation and caching mechanism, and the implementation process is as follows:

[0116] Pre-stored implementation mechanism of hierarchical depth: the node_level field is automatically calculated at insertion (node_level = parent node_level + 1), and remains unchanged in subsequent operations (unless the node is moved).

[0117] Application scenarios of pre-stored hierarchical depth include the following:

[0118] Layout calculation: determine the indentation amount according to node_level, for example, margin_left = node_level × 20px.

[0119] Rendering optimization: skip the subtree whose depth exceeds the threshold (e.g., fold display when node_level > 5).

[0120] As a further optimization extension of the embodiment of the present application, the above method further comprises a leaf node marker, and the specific dynamic update logic is as follows: when the child node list of the node is empty (left_id = 0 and right_id = 0), automatically set is_leaf = 1.

[0121] Through the above steps, the rendering engine can skip the subtree traversal of the is_leaf = 1 node, and in a scenario containing 10,000 leaf nodes, the rendering time is reduced by 40%.

[0122] As a further optimization extension of the embodiment of the present application, a dynamic pointer adjustment algorithm can also be used, and the specific content is as follows:

[0123] Insertion operation optimization, head insertion in the linked list: set left_id of new node F = 0, right_id of original head node E, left_id of original head node E = F, and increment the children_count field of parent node B.

[0124] Insertion in the middle of the linked list: locate the predecessor node E and successor node G of the insertion position, set left_id of new node F = E, right_id of new node F = G, update right_id of node E = F and left_id of node G = F.

[0125] Deletion operation optimization, including single node deletion and batch deletion of subtree, and the specific,

[0126] Single node deletion includes obtaining left_id=E and right_id=F of the node D to be deleted, setting right_id=F of node E (if E exists), and setting left_id=E of node F (if F exists).

[0127] Subtree batch deletion, specifically includes filtering all descendant nodes (SELECT * WHERE parent_id IN (subtree ID list)) through node_level. Batch delete node records (DELETE FROM table WHERE id IN (list)).

[0128] The various embodiments in the specification are described in a progressive manner, and each embodiment focuses on the difference from other embodiments. The same or similar parts between the various embodiments can be referred to each other. For the device disclosed by the embodiments, since it corresponds to the method disclosed by the embodiments, the description is relatively simple, and the related parts can be referred to the method part.

[0129] The above description of the disclosed embodiments enables a person skilled in the art to implement or use the present application. Various modifications to the embodiments will be apparent to those skilled in the art, and the general principles defined herein can be implemented in other embodiments without departing from the spirit or scope of the present application. Therefore, the present application will not be limited to the embodiments shown herein, but will conform to the widest scope consistent with the principles and novel features disclosed herein.

Claims

1. A canvas node dynamic storage system based on a multi-tree, characterized in that: include: A node division unit, configured to divide the canvas data contained in the canvas into a plurality of nodes and construct a class structure for each node, wherein the class structure includes a basic information field and a data management field for the node, wherein the data management field includes a parent node ID, a right node ID, and a left node ID, and the basic information field includes a position field, a node level field, an identifier field, and a node type field; A multi-branch tree construction unit is used to form the nodes into a multi-branch tree structure according to the parent node ID, right node ID and left node ID in the class structure, wherein the parent node ID is the identifier of the node one level above the node, the right node ID is the identifier of a node to the right of the node at the same level; and the left node ID is the identifier of a node to the left of the node at the same level.

2. A multi-tree-based canvas node dynamic storage system according to claim 1, characterized in that: The node level field is used to indicate the level of the node in the multi-tree structure. When the node is a root node, the node level field is represented by the number 0.

3. A multi-tree-based canvas node dynamic storage system according to claim 1, characterized in that: The identifier field includes an is_root field and an is_leaf field. The is_root field indicates whether the current node is the root node of the canvas, and the is_leaf field indicates whether the current node contains child nodes.

4. A multi-tree-based canvas node dynamic storage system according to claim 1, characterized in that: The node type field is used to distinguish node types through enumeration values, including materials, fonts, icons, and artboard groups.

5. A method for dynamic storage management of canvas nodes based on a multi-tree, characterized in that: The following steps are involved: Build a dynamic storage system for canvas nodes: Divide the canvas data contained in the canvas into multiple nodes and construct a class structure for each node, wherein the class structure includes a basic information field and a data management field for the node, wherein the data management field includes a parent node ID, a right node ID, and a left node ID, and the basic information field includes a position field, an identifier field, and a node type field; According to the parent node ID, right node ID and left node ID in the class structure, the nodes are formed into a multi-branch tree structure, wherein the parent node ID is the identifier of the node one level above the node, the right node ID is the identifier of the node to the right of the node at the same level; and the left node ID is the identifier of the node to the left of the node at the same level; The relationship management of canvas nodes is realized based on the constructed dynamic storage system of canvas nodes, including vertical hierarchical relationship management and horizontal hierarchical relationship management.

6. A method for dynamic storage management of canvas nodes based on a multi-tree according to claim 5, characterized in that: Implement vertical relationship management of canvas nodes, including: Query management: When you need to query all ancestor nodes of a node, traverse the vertical data chain composed of parent node IDs upwards through recursion or iteration.

7. The method for dynamic storage management of canvas nodes based on a multi-tree according to claim 5, characterized in that: Implement horizontal relationship management of canvas nodes, including: Query management: When it is necessary to query the nodes at the current level of a node, the horizontal data chain consisting of all right-facing node IDs and left-facing node IDs in the current level of the node is traversed recursively or iteratively; Insert Management: When the head is inserted, the right node ID of the new node points to the original head node; When the tail is inserted, the left node ID of the new node points to the original tail node; When inserting in the middle, modify the right node ID of the predecessor node and the left node ID of the successor node so that both the right node ID of the predecessor node and the left node ID of the successor node point to the inserted new node.

8. The method for dynamic storage management of canvas nodes based on a multi-tree according to claim 5, characterized in that: Also includes: Deletion management of canvas nodes: Query the predecessor node corresponding to the left node ID of the node to be deleted, and the successor node corresponding to the right node ID, set the right node ID of the predecessor node to the right node ID of the node to be deleted, and set the left node ID of the successor node to the left node ID of the node to be deleted; Delete all child nodes of the node to be deleted through depth-first traversal.

Images