Table-based data updating method and device, electronic equipment and storage medium

Abstract

The embodiment of the invention discloses a table-based data updating method and device, electronic equipment and a storage medium, which are applied to the technical field of data updating, and can solve the problems that resources are consumed and the response speed and smoothness are influenced due to direct re-rendering in a traditional table data updating method. According to the target table, at least one initial virtual data node is created, and each initial virtual data node corresponds to one cell in the target table; according to the data updating instruction, modifying attribute information of at least one to-be-updated virtual data node to obtain a target virtual data node corresponding to each to-be-updated virtual data node, the to-be-updated virtual data node being a virtual node needing to be updated in the at least one initial virtual data node; comparing the target virtual data node with the actual data node to obtain an updating condition of the target table; and according to the updating condition, updating the actual data node, and synchronously updating the target table.

Description

Technical Field

[0001] The embodiments of the present application relate to the technical field of data updating, and in particular, to a table-based data updating method, device, electronic device, and storage medium. Background Art

[0002] In Web applications, two-dimensional tables are a common form of data display, in which the display and update of various data in the table are crucial to data readability and user interaction experience. Currently, the display of tables usually relies on traditional front-end libraries such as jQuery. When the data in the table is updated frequently, the table data update relying on traditional methods will cause the entire or most of the data to be re-rendered, which not only consumes resources, but also affects the response speed and operation fluency of the application. Summary of the invention

[0003] In order to solve the above technical problems or at least partially solve the above technical problems, the embodiments of the present application provide a table-based data update method, device, electronic device and storage medium to solve the problem that the traditional table data update method will directly re-render, which not only consumes resources but also affects the response speed and fluency.

[0004] In order to achieve the above purpose, the technical solutions provided by the embodiments of the present application are as follows:

[0005] In a first aspect, an embodiment of the present application provides a table-based data update method, the table-based data update method comprising: creating at least one initial virtual data node according to a target table, each initial virtual data node corresponding to a cell in the target table;

[0006] According to the data update instruction, modify the attribute information of at least one virtual data node to be updated, and obtain the target virtual data node corresponding to each virtual data node to be updated, wherein the virtual data node to be updated is the virtual node to be updated in the at least one initial virtual data node;

[0007] Compare the target virtual data node with the actual data node to obtain the update status of the target table;

[0008] According to the update situation, the actual data node is updated, and the target table is updated synchronously.

[0009] As an optional implementation manner, in the first aspect of the embodiment of the present application, creating at least one initial virtual data node according to the target table includes:

[0010] Obtaining attribute information of each cell in the target table, wherein the attribute information at least includes: content, style, and class name;

[0011] Creating a row and column index corresponding to each cell according to the position information of each cell in the target table;

[0012] The at least one initial virtual data node is created according to the attribute information of each cell and the corresponding row and column indexes.

[0013] As an optional implementation, in the first aspect of the embodiment of the present application, modifying the attribute information of at least one virtual data node to be updated according to the data update instruction to obtain the target virtual data node corresponding to each virtual data node to be updated includes:

[0014] Determine, according to the data update instruction, the at least one virtual data node to be updated, and the modification content corresponding to each virtual data node to be updated;

[0015] According to the modification content corresponding to each virtual data node to be updated, the attribute information of the at least one virtual data node to be updated is modified to obtain the target virtual data node corresponding to each virtual data node to be updated.

[0016] As an optional implementation manner, in the first aspect of the embodiment of the present application, updating the actual data node according to the update situation and synchronously updating the target table includes:

[0017] According to the update situation, the actual data node is updated, and the target table is synchronously updated through a data binding mechanism.

[0018] As an optional implementation, in the first aspect of the embodiment of the present application, after the actual data node is updated according to the update situation and the target table is synchronously updated through a data binding mechanism, the method further includes:

[0019] In the interface of the target table, the update status of the target table is displayed.

[0020] As an optional implementation manner, in the first aspect of the embodiment of the present application, updating the actual data node according to the update situation includes:

[0021] According to the update situation, determine the number of all actual data nodes to be updated;

[0022] Dividing all actual data nodes into at least one batch according to a preset update batch number;

[0023] The actual data nodes are updated sequentially according to the at least one batch.

[0024] As an optional implementation manner, in the first aspect of the embodiment of the present application, updating the actual data node according to the update situation includes:

[0025] According to the update situation, determining the priorities of all actual data nodes to be updated;

[0026] According to the priority, all the actual data nodes are sorted to obtain an update order;

[0027] The actual data nodes are updated in sequence according to the update order.

[0028] In a second aspect, an embodiment of the present application provides a table-based data update device, the table-based data update device comprising: a creation module, used to create at least one initial virtual data node according to a target table, each initial virtual data node corresponding to a cell in the target table;

[0029] A processing module, configured to modify the attribute information of at least one virtual data node to be updated according to the data update instruction, and obtain a target virtual data node corresponding to each virtual data node to be updated, wherein the virtual data node to be updated is a virtual node to be updated in the at least one initial virtual data node;

[0030] The processing module is further used to compare the target virtual data node with the actual data node to obtain the update status of the target table;

[0031] The processing module is further used to update the actual data node according to the update situation, and synchronously update the target table.

[0032] As an optional implementation, in the second aspect of the embodiment of the present application, the acquisition module is used to acquire the attribute information of each cell in the target table, and the attribute information at least includes: content, style, and class name;

[0033] The creation module is specifically used to create a row and column index corresponding to each cell according to the position information of each cell in the target table;

[0034] The creation module is specifically used to create the at least one initial virtual data node according to the attribute information of each cell and the corresponding row and column indexes.

[0035] As an optional implementation, in the second aspect of the embodiment of the present application, the processing module is specifically used to determine the at least one virtual data node to be updated and the modification content corresponding to each virtual data node to be updated according to the data update instruction;

[0036] The processing module is specifically configured to modify the attribute information of the at least one virtual data node to be updated according to the modification content corresponding to each virtual data node to be updated, and obtain the target virtual data node corresponding to each virtual data node to be updated.

[0037] As an optional implementation, in the second aspect of the embodiment of the present application, the processing module is specifically used to update the actual data node according to the update situation, and synchronously update the target table through a data binding mechanism.

[0038] As an optional implementation, in the second aspect of the embodiment of the present application, the processing module is further configured to display the update status of the target table in the interface of the target table.

[0039] As an optional implementation, in the second aspect of the embodiment of the present application, the processing module is specifically used to determine the number of all actual data nodes to be updated according to the update situation;

[0040] The processing module is specifically used to divide all the actual data nodes into at least one batch according to a preset update batch number;

[0041] The processing module is specifically configured to update the actual data nodes in sequence according to the at least one batch.

[0042] As an optional implementation, in the second aspect of the embodiment of the present application, the processing module is specifically used to determine the priorities of all actual data nodes to be updated according to the update situation;

[0043] The processing module is specifically used to sort all the actual data nodes according to the priority to obtain an update order;

[0044] The processing module is specifically used to update the actual data nodes in sequence according to the update order.

[0045] In a third aspect, an embodiment of the present application provides an electronic device, the electronic device comprising:

[0046] A memory storing executable program code;

[0047] a processor coupled to the memory;

[0048] The processor calls the executable program code stored in the memory to execute the table-based data updating method in the first aspect of the embodiment of the present application.

[0049] In a fourth aspect, an embodiment of the present application provides a computer-readable storage medium storing a computer program, wherein the computer program enables a computer to execute the table-based data update method in the first aspect of the embodiment of the present application. The computer-readable storage medium includes a ROM / RAM, a magnetic disk or an optical disk, etc.

[0050] In a fifth aspect, an embodiment of the present application provides a computer program product, which, when executed on a computer, enables the computer to execute part or all of the steps of any one of the methods of the first aspect.

[0051] In a sixth aspect, an embodiment of the present application provides an application publishing platform, which is used to publish a computer program product, wherein when the computer program product runs on a computer, the computer executes part or all of the steps of any one method of the first aspect.

[0052] Compared with the prior art, the embodiments of the present application have the following beneficial effects:

[0053] The embodiment of the present application provides a table-based data update method, device, electronic device and storage medium. According to the target table, at least one initial virtual data node is created, and each initial virtual data node corresponds to a cell in the target table; according to the data update instruction, the attribute information of at least one virtual data node to be updated is modified to obtain the target virtual data node corresponding to each virtual data node to be updated, and the virtual data node to be updated is the virtual node that needs to be updated in at least one initial virtual data node; the target virtual data node is compared with the actual data node to obtain the update status of the target table; according to the update status, the actual data node is updated, and the target table is updated synchronously. In this scheme, by constructing data nodes to represent the table, differential updates are performed, the minimum changes are intelligently identified, unnecessary data operations are reduced, and synchronous updates of data and views are realized. Data changes can be reflected in the view in a timely manner, which can reduce resource consumption and effectively improve performance and efficiency when processing large amounts of data. BRIEF DESCRIPTION OF THE DRAWINGS

[0054] The accompanying drawings, which are incorporated in and constitute a part of this specification, illustrate embodiments consistent with the present application and, together with the description, serve to explain the principles of the present application.

[0055] In order to more clearly illustrate the technical solutions in the embodiments of the present application, the drawings required for use in the embodiments will be briefly introduced below. Obviously, the drawings described below are only some embodiments of the present application. For ordinary technicians in this field, other drawings can be obtained based on these drawings without paying creative work.

[0056] Figure 1 This is a flowchart of a table-based data update method provided in an embodiment of the present application. Figure 1 ;

[0057] Figure 2 This is a flowchart of a table-based data update method provided in an embodiment of the present application. Figure 2 ;

[0058] Figure 3 It is a structural diagram of a table-based data updating device provided in an embodiment of the present application;

[0059] Figure 4 It is a structural schematic diagram of an electronic device provided in an embodiment of the present application. DETAILED DESCRIPTION

[0060] In order to more clearly understand the above-mentioned purposes, features and advantages of the present application, the technical solutions 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. It should be noted that the embodiments of the present application and the features in the embodiments can be combined with each other without conflict. Obviously, the described embodiments are 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 are within the scope of protection of this application.

[0061] The terms “first”, “second” and the like in the description and claims of the present application are used to distinguish different objects rather than to describe a specific order of the objects.

[0062] The terms "including" and "having" and any variations thereof in the embodiments of the present application are intended to cover non-exclusive inclusions. For example, a process, method, system, product or apparatus comprising a series of steps or units is not necessarily limited to those steps or units explicitly listed, but may include other steps or units not explicitly listed or inherent to these processes, methods, products or apparatuses.

[0063] It should be noted that, in the embodiments of the present application, words such as "exemplary" or "for example" are used to indicate examples, illustrations or descriptions. Any embodiment or design described as "exemplary" or "for example" in the embodiments of the present application should not be interpreted as being more preferred or more advantageous than other embodiments or designs. Specifically, the use of words such as "exemplary" or "for example" is intended to present related concepts in a specific way.

[0064] In Web applications, two-dimensional tables are a common form of data display, in which the display and update of various data in the table are crucial to data readability and user interaction experience. Currently, the display of tables usually relies on traditional front-end libraries such as jQuery, but faces performance bottlenecks when processing large amounts of data. Especially when it is necessary to dynamically update one or a large amount of data in a table, these technologies tend to directly operate on data nodes, thereby triggering the redrawing of the entire data, resulting in significant performance degradation and user experience issues. Existing table data update methods have failed to effectively solve performance issues in large-scale data dynamic update scenarios. When table data is updated frequently, table data updates that rely on traditional methods will cause the entire or most of the data to be re-rendered. This method not only consumes resources, but also affects the application's response speed and operational fluency.

[0065] In order to solve the above technical problems, the embodiment of the present application proposes a data update method, device, electronic device and storage medium based on a table. According to the target table, at least one initial virtual data node is created, and each initial virtual data node corresponds to a cell in the target table; according to the data update instruction, the attribute information of at least one virtual data node to be updated is modified to obtain the target virtual data node corresponding to each virtual data node to be updated, and the virtual data node to be updated is the virtual node that needs to be updated in at least one initial virtual data node; the target virtual data node is compared with the actual data node to obtain the update status of the target table; according to the update status, the actual data node is updated, and the target table is updated synchronously. In this scheme, by constructing data nodes to represent the table, differential updates are performed, the minimum changes are intelligently identified, unnecessary data operations are reduced, and synchronous updates of data and views are realized. Data changes can be reflected in the view in a timely manner, which can reduce resource consumption and effectively improve performance and efficiency when processing large amounts of data.

[0066] like Figure 1 As shown, Figure 1 A flowchart of a table-based data updating method provided in an embodiment of the present application, the method may include the following steps:

[0067] 101. Create at least one initial virtual data node according to the target table.

[0068] In an embodiment of the present application, each initial virtual data node corresponds to a cell in the target table. The target table is the table displayed in the interface that needs to be updated with data. The table includes multiple rows and columns, corresponding to multiple cells, and each cell corresponds to an initial virtual data node.

[0069] In some embodiments, the at least one initial virtual data node may actually be a virtual node on a virtual DOM tree, and the virtual DOM tree may include multiple initial virtual data nodes.

[0070] It should be noted that the virtual DOM tree is an important concept in Web development. It is a lightweight JavaScript object representation of the real DOM. That is to say, at least one initial virtual data node on the virtual DOM tree can be understood as a lightweight JavaScript object, which is used to optimize the performance of Web applications and reduce unnecessary DOM operations. Virtual DOM: It is an abstract concept that simulates the structure of a real DOM tree, but does not contain event handlers and complex underlying implementations on real DOM nodes. The virtual DOM tree is a tree structure of a JavaScript object that contains all DOM elements and their attributes. When modifying an existing UI, the performance and user experience of the page can be improved by comparing the differences between the two virtual DOM trees and updating only the parts that need to be updated.

[0071] It should be noted that JavaScript objects are a composite data type used to store key-value pairs (also called properties). In JavaScript, almost everything is an object, such as strings, numbers, arrays, functions, etc., but except for primitive data types (such as Number, String, Boolean, Undefined, Null, Symbol, and BigInt), all others are object types. There are several ways to create objects in JavaScript: object literals, or using newObject, or by defining a constructor and then using the new keyword to create an object instance, or through classes, which provide a clearer and more object-oriented way to create objects and handle inheritance.

[0072] 102. According to the data update instruction, modify the attribute information of at least one virtual data node to be updated, and obtain the target virtual data node corresponding to each virtual data node to be updated.

[0073] In an embodiment of the present application, the data update instruction can be used to instruct the modification of the attribute information of some or all cells in the target table. The data update instruction can include all virtual data nodes to be updated, and the update content of each virtual data node to be updated, that is, what form and attributes each virtual data node to be updated needs to be updated to, etc. The at least one virtual data node to be updated can be a virtual node that needs to be updated in at least one initial virtual data node. Therefore, according to the data update instruction, the attribute information of at least one virtual data node to be updated can be modified, thereby obtaining a modified target virtual data node corresponding to each virtual data node to be updated.

[0074] There is no limit on the number of virtual data nodes to be updated, which is at least one, and may be one, two, or more.

[0075] In some embodiments, the data update instruction may be issued by the user in real time or by the server. The instruction issued by the user may mean that the user currently needs to modify the target table, so the corresponding data update instruction is issued; the instruction issued by the server may mean that a third party needs to modify the target table, so the data update instruction is sent through the server, or it may be a pre-set data update task, and the data update instruction is sent through the server. The data update task may be a timed task set by time, such as: a data update task automatically triggered at a certain moment; or it may be a task set by preset rules, such as: a data update task automatically triggered after a certain requirement is met. The embodiments of the present application do not impose specific restrictions.

[0076] 103. Compare the target virtual data node and the actual data node to obtain the update status of the target table.

[0077] In an embodiment of the present application, the target virtual data node is a modified virtual data node, and the actual data node is an actual data node corresponding to the initial virtual data node. Comparing the target virtual data node with the actual data node is actually comparing the target virtual data node with the initial virtual data node. The comparison result obtained is the modification status of the virtual data node. Regardless of whether it is a virtual data node or an actual data node, each data node corresponds to a cell in the target table. Therefore, the modification status of the virtual data node actually represents the update status of the target table.

[0078] In some embodiments, when comparing the target virtual data node and the actual data node, since the target virtual data node and the actual data node are both constructed in the form of a DOM tree, it is possible to start from the root data node and compare the child data nodes layer by layer. If the data node types are different or the key values ​​are different, it is considered that the data node and its child data nodes need to be replaced. If the data node types are the same and the key values ​​are the same, then their attributes and child data nodes are further compared. For the same data nodes, compare whether their attributes have changed. If the attributes have changed, update the corresponding attributes of the actual data node. For child data nodes, a similar comparison strategy is usually adopted. If the list of child data nodes has changed (such as adding, deleting or reordering), the actual data node is updated according to the difference results.

[0079] In some embodiments, specifically, a Diff algorithm can be used for comparison. The Diff algorithm mainly compares the difference between the virtual data node before and after the update, that is, the difference between the new and old virtual DOM trees, to calculate the minimum set of changes that need to be applied to the real DOM. This process occurs in the update process of React. When the props or state of a component changes, React will re-render the component and generate a new virtual DOM tree, then use the Diff algorithm to find the difference between the old virtual DOM tree and the old virtual DOM tree, and finally apply these differences to the real DOM.

[0080] The Diff algorithm can perform Tree Diff (tree comparison): React uses updateDepth to perform hierarchical control on the virtual DOM tree, and only compares data nodes at the same level. If the data node does not exist, the data node and all child data nodes under this data node are deleted, and no further comparison is performed. When the root data node type is different, React will directly destroy the old tree, recreate the new tree and insert it into the DOM. Cross-level move operations are considered a combination of delete and create operations in React, because React officially does not recommend cross-level DOM operations, which will affect performance. Alternatively, perform Component Diff (component comparison): If the component type is the same, React will continue to compare the component's props and children. If the component type is different, the entire component and its subtree will be completely replaced. React allows users to use the shouldComponentUpdate lifecycle method to determine whether the component needs to be updated, thereby avoiding unnecessary rendering. Or, perform Element Diff (element comparison): When data nodes are at the same level, React provides three data node operations: deletion, insertion, and movement. React assists in comparison by setting a unique key attribute for each child data node, so as to more accurately identify which child elements have changed. If the element has a key, React will directly use the key to compare the identity of the element. If there is no key, React will use a heuristic method to try to match the element.

[0081] 104. According to the update situation, the actual data node is updated, and the target table is updated synchronously.

[0082] In an embodiment of the present application, after the update status is determined, the actual data nodes can be updated according to the update status. That is, only the modified part of the data nodes need to be updated, and all of them do not need to be modified. At the same time, the target table is also updated synchronously, that is, the content and form of the target table displayed in the interface are updated.

[0083] The embodiment of the present application provides a table-based data update method, which creates at least one initial virtual data node according to the target table, and each initial virtual data node corresponds to a cell in the target table; according to the data update instruction, modifies the attribute information of at least one virtual data node to be updated, and obtains the target virtual data node corresponding to each virtual data node to be updated, and the virtual data node to be updated is the virtual node that needs to be updated in at least one initial virtual data node; compares the target virtual data node with the actual data node to obtain the update status of the target table; according to the update status, updates the actual data node, and synchronously updates the target table. In this scheme, by constructing data nodes to represent the table, differential updates are performed, the minimum changes are intelligently identified, unnecessary data operations are reduced, and synchronous updates of data and views are realized, and data changes can be reflected in the view in a timely manner, which can reduce resource consumption and effectively improve performance and efficiency when processing large amounts of data.

[0084] like Figure 2 As shown, Figure 2 A flowchart of a table-based data updating method provided in an embodiment of the present application, the method may also include the following steps:

[0085] 201. Get the attribute information of each cell in the target table.

[0086] In an embodiment of the present application, the attribute information may include at least: content, style, and class name, wherein content refers to the content embodied in the cell, which may include text, pictures, links, etc. Style may refer to the data style, color style, background style, etc. of the cell; and class name may refer to the category to which the cell belongs, that is, the category of the row or column corresponding to the cell.

[0087] In some embodiments, the attribute information may also include other information. As long as the information can reflect the display of the cell and can be modified, it can be regarded as attribute information.

[0088] 202. Create a row and column index corresponding to each cell according to the position information of each cell in the target table.

[0089] In an embodiment of the present application, the target table includes a large number of cells, and each row and column in the target table is numbered. Therefore, each cell has unique location information in the target table, which can be represented by the number of rows and columns, that is, the row and column index of the cell. The row and column index is unique, and the row and column indexes corresponding to each cell are different. Through the row and column index, the location information of the cell can be directly located.

[0090] 203. Create at least one initial virtual data node according to the attribute information of each cell and the corresponding row and column indexes.

[0091] In an embodiment of the present application, when creating the initial virtual data node, since the initial virtual data node is created based on the actual data node, that is, the initial virtual data node and the actual data node are exactly the same, the initial virtual data node also needs to reflect the attribute information and row and column indexes of each cell. Therefore, the initial virtual data node can be created based on the attribute information of each cell and the corresponding row and column indexes.

[0092] In some embodiments, in at least one initial virtual data node, each initial virtual data node can be considered as an independent node, that is, the cell corresponding to each initial virtual data node can be considered as an independent component. The component manages its own state internally and uses state changes to trigger updates, thereby achieving fine-grained update control and efficient local refresh.

[0093] 204. Determine, according to the data update instruction, at least one virtual data node to be updated and modification content corresponding to each virtual data node to be updated.

[0094] In an embodiment of the present application, after obtaining the data update instruction, the data update instruction can be analyzed to obtain at least one virtual data node to be updated included in the data update instruction, and the modification content corresponding to each virtual data node to be updated. It can be seen that the virtual data node to be updated actually indicates the cell that needs to be updated in the target table, and there is a complete one-to-one correspondence between the virtual data node to be updated and the cell to be updated. The modification content can be used to indicate what the attribute information of each cell needs to be modified to.

[0095] 205. Modify the attribute information of at least one virtual data node to be updated according to the modification content corresponding to each virtual data node to be updated, and obtain the target virtual data node corresponding to each virtual data node to be updated.

[0096] In an embodiment of the present application, when making modifications, only the attribute information of at least one virtual data node to be updated included in the data update instruction needs to be modified, and other virtual data nodes do not need to be modified, thereby obtaining the target virtual data nodes corresponding to each virtual data node to be updated after modification.

[0097] It should be noted that the modification performed at this time is only for the modification of the virtual data node, and does not involve the modification of the actual data node, nor does it involve the modification of the target table.

[0098] 206. Compare the target virtual data node and the actual data node to obtain the update status of the target table.

[0099] 207. According to the update situation, the actual data node is updated, and the target table is synchronously updated through the data binding mechanism.

[0100] In the embodiment of the present application, since the target table is supported by the actual data node, the target table will be updated synchronously when the actual data node is updated. Therefore, the synchronization between the actual data node and the target table is ensured through a data binding mechanism.

[0101] In some embodiments, the data binding mechanism is a simple mechanism for providing display data to applications and interacting with data. It mainly connects the data source with the interface element (or binding target) to achieve dynamic update and display of data. Data binding refers to associating the data source with the interface element so that when the data source changes, the interface element can automatically update the display; at the same time, the state change of the interface element can also be reflected in the data source.

[0102] The data source can be an internal data source (such as an object or array in memory) or an external data source (such as a database or file). The binding target is usually an interface element, such as a text box or list, which is used to display the data in the data source. The binding engine is usually responsible for realizing the connection and synchronization between the data source and the binding target, including data binding mode, value converter, data validation and other functions.

[0103] It should be noted that the data binding mechanism can include one-way binding and two-way binding. One-way binding means that changes in the data source will be automatically updated to the interface elements, but changes in the interface elements will not be reflected in the data source; two-way binding means that changes between the data source and the interface elements are synchronized in both directions, that is, changes in the data source will update the interface elements, and changes in the interface elements will also update the data source.

[0104] In some embodiments, event delegation technology can be used to reduce event processing overhead, avoid binding events to each cell separately, and improve overall performance.

[0105] Among them, event delegation is a commonly used design pattern in software development, especially effective when handling DOM events. It allows parent elements or higher-level elements to handle events of child elements instead of directly binding event listeners on each child element. Event delegation is based on the bubbling mechanism of events. In DOM, the event flow is divided into three stages: capture stage, target stage, and bubbling stage. The bubbling stage refers to the process in which the event starts from the target element and propagates upward step by step to the root node of the DOM tree. Event delegation uses this mechanism to perform corresponding operations by listening to events on the parent element and judging the target element of the event (that is, the child element that actually triggered the event).

[0106] In some embodiments, when updating actual data nodes, it may be necessary to modify many virtual data nodes, and accordingly many actual data nodes also need to be modified. However, the system may not be able to guarantee that the attribute information of more data nodes can be modified at one time. Therefore, the update can be performed in batches. Specifically, the number of all actual data nodes to be updated can be determined based on the update situation; all actual data nodes can be divided into at least one batch according to the preset update batch number; and the actual data nodes can be updated in sequence according to at least one batch.

[0107] It should be noted that the preset update batch number can be determined based on the system carrying capacity or the historical update situation. All actual data nodes to be updated can be divided according to the preset update batch number and then updated in batches.

[0108] It should be noted that the preset update batch number can also be adjusted dynamically, and will be adjusted in real time according to the current system load to avoid blocking the main thread.

[0109] In some embodiments, multiple update operations are executed in batches, and each batch is scheduled through requestAnimationFrame or setTimeout.

[0110] Among them, setTimeout is a basic function in JavaScript that is used to set a timer that executes a function or a specified piece of code after a specified delay time. This function is part of the Web API, and it is available in both browsers and Node.js environments. The setTimeout function accepts two parameters: the first parameter is the function to be executed after the delay time, and the second parameter is the delay time (in milliseconds). If the first parameter is a string, it will be parsed as JavaScript code and executed.

[0111] In addition, requestAnimationFrame is part of the Web API, which provides developers with a method to call a specified function before the next browser redraw to update the animation. This method is more suitable for animation than the traditional setTimeout or setInterval method because it is automatically optimized by the browser. The calling frequency means that it will update the animation as quickly as the browser can handle it, and reduce the update frequency when the browser is busy, thereby avoiding excessive use of system resources and improving performance and fluency. requestAnimationFrame accepts a callback function as a parameter, which will be executed before the next browser redraw.

[0112] In some embodiments, when updating actual data nodes, it may happen that many virtual data nodes need to be modified, and accordingly many actual data nodes also need to be modified. If it is not possible to ensure that all actual data nodes are updated at the same time, the update can be performed in the order of priority of each data node, and the data nodes with high priority are updated first. Specifically, the priority of all actual data nodes to be updated can be determined according to the update situation; all actual data nodes can be sorted according to the priority to obtain the update order; and the actual data nodes can be updated in sequence according to the update order.

[0113] It should be noted that the priority of each data node can be carried in the data update instruction, or it can be the priority determined according to the hierarchical structure between data nodes. After the priorities of all actual data nodes to be updated are sorted, they can be updated in this order.

[0114] It should be noted that the priority can be used to indicate the importance of each actual data node (also a cell), and of course it can also be the order of modification time. For example: there is a cell, first there is an instruction to change the background to red, and then later there is an instruction to change the background to green. The instruction to change to green is later than the instruction to change to red. Therefore, it can be considered that the priority of the instruction to change to green is higher than the priority of the instruction to change to red. Therefore, the background of the cell can be directly changed to green, and the instruction to change to red can be deleted.

[0115] 208. In the interface of the target table, the update status of the target table is displayed.

[0116] In the embodiment of the present application, when the actual data node is updated, the target table will be updated synchronously, and the update status of the target table will also be displayed synchronously, that is, the modified status of the target table will be displayed directly in the interface of the target table.

[0117] In the embodiment of the present application, modern development tools and technologies such as ES6+, Webpack, and Sass can be introduced to optimize the development process and application performance. Among them, ES6+ is a major update of JavaScript, which introduces many new features, such as arrow functions, template strings, deconstruction assignments, extension operators, etc., making JavaScript more powerful and easy to use. Webpack is a static module bundler for modern JavaScript applications. When Webpack processes an application, it recursively builds a dependency graph containing each module required by the application, and then packages all these modules into one or more bundles. Sass (Syntactically Awesome Stylesheets) is a CSS preprocessor that extends the functionality of CSS, adding features such as variables, nested rules, mixins, and inheritance. Sass has two syntaxes: SCSS (Sassy CSS) and Sass (indentation syntax). The SCSS syntax is similar to CSS, but with the addition of Sass features.

[0118] The embodiment of the present application provides a table-based data update method, which constructs data nodes to represent tables, thereby performing differentiated updates, intelligently identifying minimal changes, reducing unnecessary data operations, and realizing synchronous updates of data and views. Data changes can be reflected in the view in a timely manner, which can reduce resource consumption and effectively improve the performance and efficiency when processing large amounts of data.

[0119] like Figure 3 As shown, an embodiment of the present application provides a table-based data update device, which may include: a creation module 301, used to create at least one initial virtual data node according to a target table, each initial virtual data node corresponding to a cell in the target table;

[0120] The processing module 302 is used to modify the attribute information of at least one virtual data node to be updated according to the data update instruction, and obtain the target virtual data node corresponding to each virtual data node to be updated, where the virtual data node to be updated is a virtual node to be updated in at least one initial virtual data node;

[0121] The processing module 302 is further used to compare the target virtual data node with the actual data node to obtain the update status of the target table;

[0122] The processing module 302 is further used to update the actual data node according to the update situation, and synchronously update the target table.

[0123] In some embodiments, the acquisition module 303 is used to acquire the attribute information of each cell in the target table, and the attribute information at least includes: content, style, and class name;

[0124] The creation module 301 is specifically used to create a row and column index corresponding to each cell according to the position information of each cell in the target table;

[0125] The creation module 301 is specifically configured to create at least one initial virtual data node according to the attribute information of each cell and the corresponding row and column indexes.

[0126] In some embodiments, the processing module 302 is specifically configured to determine at least one virtual data node to be updated and modification content corresponding to each virtual data node to be updated according to the data update instruction;

[0127] The processing module 302 is specifically configured to modify the attribute information of at least one virtual data node to be updated according to the modification content corresponding to each virtual data node to be updated, and obtain the target virtual data node corresponding to each virtual data node to be updated.

[0128] In some embodiments, the processing module 302 is specifically used to update the actual data node according to the update situation, and simultaneously update the target table through the data binding mechanism.

[0129] In some embodiments, the processing module 302 is further configured to display the update status of the target table in the interface of the target table.

[0130] In some embodiments, the processing module 302 is specifically configured to determine the number of all actual data nodes to be updated according to the update situation;

[0131] The processing module 302 is specifically configured to divide all actual data nodes into at least one batch according to a preset update batch number;

[0132] The processing module 302 is specifically configured to update the actual data nodes in sequence according to at least one batch.

[0133] In some embodiments, the processing module 302 is specifically used to determine the priorities of all actual data nodes to be updated according to the update situation;

[0134] The processing module 302 is specifically used to sort all actual data nodes according to the priority to obtain the update order;

[0135] The processing module 302 is specifically configured to update the actual data nodes in sequence according to the update sequence.

[0136] In the embodiments of the present application, each module can implement the table-based data updating method provided in the above method embodiments and can achieve the same technical effect. To avoid repetition, it will not be described here.

[0137] like Figure 4 As shown, an embodiment of the present application further provides an electronic device, which may include:

[0138] A memory 401 storing executable program codes;

[0139] a processor 402 coupled to the memory 401;

[0140] The processor 402 calls the executable program code stored in the memory 401 to execute the table-based data updating method executed by the electronic device in the above-mentioned method embodiments.

[0141] An embodiment of the present application provides a computer-readable storage medium, on which a computer program is stored. When the computer program is executed by a processor, the various processes of the table-based data update method in the above method embodiment are implemented, and the same technical effect can be achieved. To avoid repetition, it will not be repeated here.

[0142] An embodiment of the present application also provides a computer program product, which stores a computer program. When the computer program is executed by a processor, it implements the various processes of the table-based data update method in the above method embodiment and can achieve the same technical effect. To avoid repetition, it will not be repeated here.

[0143] Those skilled in the art will appreciate that the embodiments of the present application may be provided as methods, systems, or computer program products. Therefore, the present application may adopt the form of a complete hardware embodiment, a complete software embodiment, or an embodiment combining software and hardware. Moreover, the present application may adopt the form of a computer program product implemented on one or more computer-usable storage media that include computer-usable program code.

[0144] In several embodiments provided by the present application, it should be understood that the disclosed devices and methods can also be implemented in other ways. The device embodiments described above are merely schematic. For example, the flowcharts and block diagrams in the accompanying drawings show the possible architecture, functions and operations of the devices, methods and computer program products according to multiple embodiments of the present application. In this regard, each box in the flowchart or block diagram can represent a module, a program segment or a part of the code, and a part of the module, program segment or code contains one or more executable instructions for implementing the specified logical function. It should also be noted that in some alternative implementations, the functions marked in the box can also occur in a different order from the order marked in the accompanying drawings. For example, two consecutive boxes can actually be executed substantially in parallel, and they can sometimes be executed in the opposite order, depending on the functions involved. It should also be noted that each box in the block diagram and / or flowchart, and the combination of boxes in the block diagram and / or flowchart can be implemented with a dedicated hardware-based system that performs a specified function or action, or can be implemented with a combination of dedicated hardware and computer instructions.

[0145] In the present application, the processor may be a central processing unit (CPU), or other general-purpose processors, digital signal processors (DSP), application-specific integrated circuits (ASIC), field-programmable gate arrays (FPGA) or other programmable logic devices, discrete gate or transistor logic devices, discrete hardware components, etc. A general-purpose processor may be a microprocessor or the processor may also be any conventional processor, etc.

[0146] In this application, memory may include non-permanent memory in a computer-readable medium, random access memory (RAM) and / or non-volatile memory, such as read-only memory (ROM) or flash RAM. Memory is an example of a computer-readable medium.

[0147] In this application, a person skilled in the art can understand that all or part of the steps in the various methods of the above embodiments can be completed by instructing the relevant hardware through a program, and the program can be stored in a computer-readable storage medium, and the computer-readable medium includes permanent and non-permanent, removable and non-removable storage media. The storage medium can implement information storage by any method or technology, and the information can be a computer-readable instruction, a data structure, a module of a program, or other data. Examples of computer storage media include, but are not limited to, Parallel Random Access Memory (PRAM), Static Random Access Memory (SRAM), Dynamic Random Access Memory (DRAM), Programmable Read-only Memory (PROM), Erasable Programmable Read Only Memory (EPROM), other types of Random Access Memory (RAM), Read-Only Memory (ROM), One-time Programmable Read-Only Memory (OTPROM), Electrically-Erasable Programmable Read-Only Memory (EEPROM), flash memory or other memory technology, Compact Disc Read-Only Memory (CD-ROM), Digital Versatile Disc (DVD) or other optical storage, magnetic cassettes, magnetic disk storage or other magnetic storage devices, or any other non-transmission medium that can be used to store information that can be accessed by a computing device. According to the definition in this article, computer-readable media does not include temporary computer-readable media (transitory media), such as modulated data signals and carrier waves.

[0148] It should be noted that, in this article, relational terms such as "first" and "second" are only used to distinguish one entity or operation from another entity or operation, and do not necessarily require or imply any such actual relationship or order between these entities or operations. Moreover, the term "comprising" or any other variant thereof is intended to cover non-exclusive inclusion, so that a process, method, article or device including a series of elements includes not only those elements, but also other elements not explicitly listed, or also includes elements inherent to such process, method, article or device. In the absence of further restrictions, the elements defined by the sentence "comprising a ..." do not exclude the existence of other identical elements in the process, method, article or device including the elements.

[0149] It should be understood that "one embodiment" or "an embodiment" mentioned throughout the specification means that specific features, structures or characteristics related to the embodiment are included in at least one embodiment of the present application. Therefore, "in one embodiment" or "in an embodiment" appearing throughout the specification does not necessarily refer to the same embodiment. In addition, these specific features, structures or characteristics can be combined in one or more embodiments in any suitable manner. Those skilled in the art should also be aware that the embodiments described in the specification are all optional embodiments, and the actions and modules involved are not necessarily required by the present application. The above-mentioned multiple embodiments are not necessarily multiple independent embodiments. Dividing into multiple embodiments is only used to highlight the different technical features in different embodiments. Those skilled in the art should be aware that the above-mentioned multiple embodiments can also be combined in any way.

[0150] In the various embodiments of the present application, it should be understood that the size of the serial numbers of the above-mentioned processes does not necessarily mean the order of execution. The execution order of each process should be determined by its function and internal logic, and should not constitute any limitation on the implementation process of the embodiments of the present application.

[0151] The units described above 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 network units. Some or all of the units may be selected according to actual needs to achieve the purpose of the solution of this embodiment.

[0152] 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.

[0153] If the above-mentioned 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-accessible memory. 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, which is stored in a memory and includes several requests for a computer device (which can be a personal computer, a server or a network device, etc., specifically a processor in a computer device) to perform some or all of the steps of the above-mentioned methods of various embodiments of the present application.

[0154] The above is only a specific implementation of the present application, so that those skilled in the art can understand or implement the present application. Various modifications to these 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 these embodiments herein, but will conform to the widest scope consistent with the principles and novel features disclosed herein.

Claims

1. A table-based data updating method, characterized in that: The method comprises: According to the target table, create at least one initial virtual data node, each initial virtual data node corresponds to a cell in the target table; According to the data update instruction, modify the attribute information of at least one virtual data node to be updated, and obtain the target virtual data node corresponding to each virtual data node to be updated, wherein the virtual data node to be updated is the virtual node to be updated in the at least one initial virtual data node; Compare the target virtual data node with the actual data node to obtain the update status of the target table; According to the update situation, the actual data node is updated, and the target table is updated synchronously.

2. The method according to claim 1, characterized in that The step of creating at least one initial virtual data node according to the target table includes: Obtaining attribute information of each cell in the target table, wherein the attribute information at least includes: content, style, and class name; Creating a row and column index corresponding to each cell according to the position information of each cell in the target table; The at least one initial virtual data node is created according to the attribute information of each cell and the corresponding row and column indexes.

3. The method according to claim 1, characterized in that The step of modifying the attribute information of at least one virtual data node to be updated according to the data update instruction to obtain the target virtual data node corresponding to each virtual data node to be updated includes: Determine, according to the data update instruction, the at least one virtual data node to be updated, and the modification content corresponding to each virtual data node to be updated; According to the modification content corresponding to each virtual data node to be updated, the attribute information of the at least one virtual data node to be updated is modified to obtain the target virtual data node corresponding to each virtual data node to be updated.

4. The method according to claim 1, characterized in that The updating of the actual data node according to the update situation and synchronously updating the target table includes: According to the update situation, the actual data node is updated, and the target table is synchronously updated through a data binding mechanism.

5. The method according to claim 4, characterized in that After updating the actual data node according to the update situation and synchronously updating the target table through a data binding mechanism, the method further includes: In the interface of the target table, the update status of the target table is displayed.

6. The method according to claim 1, characterized in that The updating of the actual data node according to the update situation includes: According to the update situation, determine the number of all actual data nodes to be updated; Dividing all actual data nodes into at least one batch according to a preset update batch number; The actual data nodes are updated sequentially according to the at least one batch.

7. The method according to claim 1, characterized in that The updating of the actual data node according to the update situation includes: According to the update situation, determining the priorities of all actual data nodes to be updated; According to the priority, all the actual data nodes are sorted to obtain an update order; The actual data nodes are updated in sequence according to the update order.

8. A table-based data updating device, characterized in that: The table-based data updating device comprises: A creation module, used to create at least one initial virtual data node according to a target table, each initial virtual data node corresponding to a cell in the target table; A processing module, configured to modify the attribute information of at least one virtual data node to be updated according to the data update instruction, and obtain a target virtual data node corresponding to each virtual data node to be updated, wherein the virtual data node to be updated is a virtual node to be updated in the at least one initial virtual data node; The processing module is further used to compare the target virtual data node with the actual data node to obtain the update status of the target table; The processing module is further used to update the actual data node according to the update situation, and synchronously update the target table.

9. An electronic device, characterized in that: include: A memory storing executable program code; and a processor coupled to the memory; The processor calls the executable program code stored in the memory to execute the table-based data updating method according to any one of claims 1 to 7.

10. A computer-readable storage medium, characterized in that: include: The computer-readable storage medium stores computer instructions, and when the computer instructions are executed by a processor, the table-based data updating method according to any one of claims 1 to 7 is implemented.

Images