Page rendering and update methods, devices and electronic equipment
Patent Information
- Authority / Receiving Office
- CN · China
- Patent Type
- Applications(China)
- Current Assignee / Owner
- Filing Date
- 2026-06-01
- Publication Date
- 2026-08-14
AI Technical Summary
[0003]然而,基于虚拟DOM数进行渲染,无论数据变化的范围大小,即便是单一数据项发生变化,仍需执行完整的虚拟DOM树构建与全量递归对比过程
[0016]本发明还提供一种计算机程序产品,包括计算机程序,所述计算机程序被处理器执行时实现如上述任一种所述页面渲染更新方法。
Smart Images

Figure CN122570840A_ABST
Abstract
Description
Technical Field
[0001] This invention relates to the field of page update technology, and in particular to a page rendering update method, apparatus, and electronic device. Background Technology
[0002] According to relevant technologies, for front-end application page updates, the Virtual Document Object Model (hereinafter referred to as "virtual DOM") is often used as the core rendering mechanism. When the application state or page data changes, the framework will rebuild a complete new virtual DOM tree, and recursively compare the new virtual DOM tree with the old virtual DOM tree retained from the last rendering, layer by layer and node by node. Then, the differences found in the comparison are mapped to the real DOM nodes in batches to complete the view update.
[0003] However, rendering based on the virtual DOM tree requires a complete virtual DOM tree construction and full recursive comparison process, regardless of the range of data changes, even if only a single data item changes. For pages with a large number of nodes and deep nesting levels, this process will incur significant computational overhead and rendering latency.
[0004] Therefore, finding a method that can quickly and accurately update page rendering has become a current research hotspot. Summary of the Invention
[0005] This invention provides a page rendering and updating method, apparatus, and electronic device, which enables fast and accurate page rendering and updating.
[0006] This invention provides a page rendering and updating method, characterized in that the method includes: obtaining a first node data identifier for each page node in the page to be updated, wherein the node data identifier is uniquely mapped to page node data; in response to the page to be updated receiving new page data, obtaining a second node data identifier for each page node in the page to be updated; comparing the first node data identifier and the second node data identifier, identifying at least one target page node whose node data identifier has changed among the page nodes; obtaining updated node data of the target page node based on the target page node; and rendering and updating the page to be updated based on the updated node data of the target page node.
[0007] According to a page rendering update method provided by the present invention, determining that the page to be updated has received new page data is achieved by the following method: obtaining a first page data hash value of the page to be updated; obtaining a second page data hash value of the page to be updated at a preset time interval; and determining that the page to be updated has received new page data in response to the first page data hash value and the second page data hash value being different.
[0008] According to a page rendering update method provided by the present invention, the first node data identifier includes a first node data hash value; the second node data identifier includes a second node data hash value; the step of comparing the first node data identifier and the second node data identifier to identify at least one target page node in the page nodes whose node data identifier has changed includes: comparing the first node data hash value and the second node data hash value to identify at least one target page node in the page nodes whose node data hash value has changed.
[0009] According to a page rendering update method provided by the present invention, before comparing the first node data hash value with the second node data hash value and identifying at least one target page node whose node data hash value has changed in the page nodes, the method further includes: storing each first node data hash value of each page node into a first hash value group; storing each second node data hash value of each page node into a second hash value group; the step of comparing the first node data hash value with the second node data hash value and identifying at least one target page node whose node data hash value has changed in the page nodes includes: comparing the first node data hash value with the second node data hash value through the first hash value group and the second hash value group to identify at least one target page node whose node data hash value has changed in the page nodes.
[0010] According to a page rendering update method provided by the present invention, the first node data identifier includes a first node data timestamp; the second node data identifier includes a second node data timestamp; the step of comparing the first node data identifier and the second node data identifier to identify at least one target page node in the page nodes whose node data identifier has changed includes: comparing the first node data timestamp and the second node data timestamp to identify at least one target page node in the page nodes whose node data timestamp has changed.
[0011] According to a page rendering update method provided by the present invention, before comparing the first node data timestamp with the second node data timestamp to identify at least one target page node whose node data timestamp has changed, the method further includes: storing each first node data timestamp of each page node into a first timestamp group; storing each second node data timestamp of each page node into a second timestamp group; the step of comparing the first node data timestamp with the second node data timestamp to identify at least one target page node whose node data timestamp has changed includes: comparing the first node data timestamp with the second node data timestamp using the first timestamp group and the second timestamp group to identify at least one target page node whose node data timestamp has changed.
[0012] According to a page rendering update method provided by the present invention, the update node data of the target page node is obtained by performing a reverse mapping calculation on the node data identifier of the target page node to obtain the update node data of the target page node.
[0013] The present invention also provides a page rendering and updating apparatus, the apparatus comprising: a first acquisition module, configured to acquire a first node data identifier of each page node in the page to be updated, wherein the node data identifier is uniquely mapped to page node data; a second acquisition module, configured to acquire a second node data identifier of each page node in the page to be updated in response to the page receiving new page data; a comparison module, configured to compare the first node data identifier and the second node data identifier, and identify at least one target page node in the page nodes whose node data identifier has changed; a processing module, configured to acquire updated node data of the target page node based on the target page node; and a rendering module, configured to render and update the page to be updated based on the updated node data of the target page node.
[0014] The present invention also provides an electronic device, including a memory, a processor, and a computer program stored in the memory and executable on the processor, wherein the processor executes the computer program to implement the page rendering update method as described above.
[0015] The present invention also provides a non-transitory computer-readable storage medium having a computer program stored thereon, which, when executed by a processor, implements the page rendering update method as described above.
[0016] The present invention also provides a computer program product, including a computer program that, when executed by a processor, implements the page rendering and updating method as described above.
[0017] This invention provides a page rendering update method, apparatus, and electronic device. The method includes: acquiring a first node data identifier for each page node in a page to be updated, wherein the node data identifier is uniquely mapped to page node data; in response to the page to be updated receiving new page data, acquiring a second node data identifier for each page node in the page to be updated; comparing the first node data identifier and the second node data identifier to identify at least one target page node whose node data identifier has changed; acquiring updated node data of the target page node based on the target page node; and rendering and updating the page to be updated based on the updated node data of the target page node, thereby achieving fast and accurate page rendering updates. Attached Figure Description
[0018] To more clearly illustrate the technical solutions in this invention or the prior art, the drawings used in the description of the embodiments or the prior art will be briefly introduced below. Obviously, the drawings described below are some embodiments of this invention. For those skilled in the art, other drawings can be obtained from these drawings without creative effort.
[0019] Figure 1 This is a flowchart illustrating the page rendering and updating method provided by the present invention.
[0020] Figure 2 This is a schematic diagram of the process for determining whether the page to be updated has received new page data, provided by the present invention.
[0021] Figure 3 This is a schematic diagram of the page rendering and updating device provided by the present invention.
[0022] Figure 4 This is a schematic diagram of the structure of the electronic device provided by the present invention. Detailed Implementation
[0023] To make the objectives, technical solutions, and advantages of this invention clearer, the technical solutions of this invention will be clearly and completely described below with reference to the accompanying drawings. Obviously, the described embodiments are only some, not all, of the embodiments of this invention. All other embodiments obtained by those skilled in the art based on the embodiments of this invention without creative effort are within the scope of protection of this invention.
[0024] Figure 1 This is a flowchart illustrating the page rendering and updating method provided by the present invention.
[0025] The following will combine Figure 1 The process of the page rendering and updating method provided by this invention will be described.
[0026] In an exemplary embodiment of the present invention, combined with Figure 1 As can be seen, the page rendering update method may include steps 110 to 150, and each step will be described below.
[0027] In step 110, the first node data identifier of each page node in the page to be updated is obtained, wherein the node data identifier is uniquely mapped to the page node data.
[0028] In one embodiment, after the page is first rendered or after the last update, a first node data identifier can be generated for each page node in the current page to be updated, that is, the data node corresponding to the UI component, which is uniquely mapped to its page node data.
[0029] The node data identifier can be a hash value calculated based on the node data content, such as MD5, SHA-1 or CRC32 algorithms. The node data identifier can also be a timestamp, version number or globally unique identifier (GUID) of the node data. In this embodiment, no specific limitation is made on the node data identifier, as long as it can be ensured that the node data identifier corresponds one-to-one with the node data content. When the node data content (corresponding to the page node data) changes, the corresponding node data identifier also changes.
[0030] In step 120, in response to the page to be updated receiving new page data, the second node data identifier of each page node in the page to be updated is obtained.
[0031] In one embodiment, when the page receives new data, such as updated data obtained from a backend API or changes triggered by user input, the second node data identifier for each node in the same group of page nodes can be recalculated based on the new data. The calculation method is exactly the same as in step 110, for example, using the same hash algorithm to ensure the comparability of the identifiers.
[0032] In step 130, the first node data identifier and the second node data identifier are compared, and at least one target page node whose node data identifier has changed is identified in the page nodes.
[0033] In one embodiment, the first node data identifier and the second node data identifier of each node can be compared one by one. If the two identifiers of a node are exactly the same, it indicates that the data corresponding to that node has not changed and does not need to be updated; if the two identifiers are different, it is determined that the node is a target page node and its data has been changed. Through this comparison process, all nodes that need to be updated can be quickly filtered out without traversing the entire virtual DOM tree or rebuilding all nodes.
[0034] In another embodiment, to improve comparison efficiency, the first node data identifier and the second node data identifier of all page nodes can be organized into arrays, and a fast comparison can be performed by looping through them or using a mapping table.
[0035] In step 140, based on the target page node, the update node data of the target page node is obtained.
[0036] In another embodiment, for each identified target page node, its corresponding updated node data can be extracted from the new page data. For example, if the node is the text content of a list item, the updated data is the new text string; if the node is a complex component, the updated data may be a new sub-data structure.
[0037] In step 150, the page to be updated is rendered and updated based on the update node data of the target page node.
[0038] In another embodiment, based on the updated node data of the target page node, the corresponding node in the virtual DOM where the data update has occurred is directly located, and rendering update operations are performed only on these nodes. For example, in a web environment, DOM elements can be directly manipulated to update their content or attributes through document.getElementById or the framework's ref mechanism; in a virtual DOM framework, new virtual child nodes can be generated and partially replaced only for these target nodes, without triggering a full comparison.
[0039] In this embodiment, precise updates are performed only on page nodes where data changes, avoiding the performance overhead of traditional technologies that require full construction and comparison of the virtual DOM tree regardless of the size of the data change.
[0040] The page rendering update method provided by this invention includes: obtaining a first node data identifier for each page node in the page to be updated, wherein the node data identifier is uniquely mapped to page node data; in response to the page to be updated receiving new page data, obtaining a second node data identifier for each page node in the page to be updated; comparing the first node data identifier and the second node data identifier, identifying at least one target page node whose node data identifier has changed among the page nodes; obtaining updated node data of the target page node based on the target page node; and rendering and updating the page to be updated based on the updated node data of the target page node, thereby achieving fast and accurate page rendering updates.
[0041] Figure 2 This is a schematic diagram of the process for determining whether the page to be updated has received new page data, provided by the present invention.
[0042] The following will combine Figure 2 The process of determining that the page to be updated has received new page data, as provided by the present invention, will be described.
[0043] In an exemplary embodiment of the present invention, combined with Figure 2 It can be seen that determining that the page to be updated has received new page data may include steps 210 to 230, which will be described in detail below: In step 210, the hash value of the first page data of the page to be updated is obtained.
[0044] In one embodiment, after the initial rendering of the page is completed or the last update operation has ended, the complete data object of the page to be updated is obtained, such as the state tree or data model of the entire page. After serializing the complete data object, a preset hash algorithm, such as MD5, SHA-1, or SHA-256, is used to calculate its first page data hash value, and this hash value is stored in memory as a base value.
[0045] In step 220, at preset time intervals, the second page data hash value of the page to be updated is obtained at the preset time interval.
[0046] In another embodiment, a preset time interval can be set according to business needs. For example, it can be set to 500ms for scenarios with high real-time requirements and 3 seconds for ordinary scenarios. Every time this preset time interval is reached, the system automatically triggers a data polling operation to obtain the latest page data from the data source, such as the backend interface, local cache, or user input buffer, and calculates the hash value of the second page data at that moment using the same hash algorithm as in step 210.
[0047] In step 230, in response to the fact that the hash value of the first page data is different from the hash value of the second page data, it is determined that the page to be updated has received new page data.
[0048] In another embodiment, the calculated hash value of the second page data can be compared with the previously stored hash value of the first page data. If they are the same, it indicates that the overall page data has not changed since the last update to the current polling. In this case, the subsequent node-level comparison and rendering update process is not triggered, and the system continues to wait for the next timer cycle. If they are different, it is determined that the page has received new page data. At this time, the second node data identifier of each page node can be obtained, compared with the first node data identifier, the target page node can be identified, and a precise update can be performed.
[0049] It should be noted that after the page rendering update is completed, the hash value of the second page data obtained in this poll is stored as the new hash value of the first page data, and used as a comparison benchmark in the next round of timed polling.
[0050] In this embodiment, by coordinating with node-level precise updates, that is, using the overall hash value as a "coarse filter" and node identifier comparison as a "fine location", the combination of the two achieves full-process optimization from data change detection to local rendering, significantly improving the overall efficiency of page update technology.
[0051] In yet another exemplary embodiment of the present invention, continuing with the previously described embodiment as an example, the first node data identifier may include a first node data hash value; the second node data identifier may include a second node data hash value. Specifically, by comparing the first node data identifier and the second node data identifier, identifying at least one target page node in the page nodes whose node data identifier has changed can be achieved in the following manner: By comparing the hash value of the first node data with the hash value of the second node data, at least one target page node whose node data hash value has changed is identified among the page nodes.
[0052] In one embodiment, after the page is first rendered or after the last update, all page nodes in the current page to be updated are traversed, and for the data content bound to each node, a preset hash algorithm, such as MD5, SHA-1, SHA-256 or CRC32, is used to calculate the hash value of the first node data of the page node.
[0053] In another embodiment, after determining that the page to be updated has received new page data, for the same group of page nodes, the second node data hash value of each node is recalculated based on the new data. The calculation method is consistent with the calculation of the first node data hash value to ensure the comparability of the hash values before and after.
[0054] Furthermore, the hash values of the first and second nodes of each node are compared item by item. If the two hash values are exactly the same, it indicates that the data content corresponding to that node has not changed and does not need to be updated; if the two hash values are different, the node is determined to be a target page node, and its data content has changed. Through the above hash value comparison, all nodes whose data has changed can be quickly filtered out, forming a set of target page nodes. For each identified target page node, its corresponding updated node data can be extracted from the new page data, and the corresponding node in the real DOM or virtual DOM can be directly located. Rendering update operations are only performed on these nodes.
[0055] In yet another exemplary embodiment of the present invention, continuing with the previously described embodiments, before comparing the first node data hash value with the second node data hash value and identifying at least one target page node in the page nodes whose node data hash value has changed, the method further includes: Store the hash value of each first node data of each page node into the first hash value group; Store the hash value of each second node data of each page node into the second hash value group; The step of comparing the hash values of the first node data and the hash values of the second node data to identify at least one target page node whose node data hash value has changed includes: By comparing the first hash value group and the second hash value group, the hash value of the first node data is compared with the hash value of the second node data to identify at least one target page node whose node data hash value has changed in the page node.
[0056] In one embodiment, after the page is first rendered or after the last update, all page nodes are traversed in a predetermined order, such as the rendering order of page nodes in the page, the ascending order of node IDs, or the depth-first traversal order of the node tree. For each page node, its first node data hash value is calculated and stored sequentially in an array structure according to the traversal order, forming a first hash value group. The data structure of this first hash value group can be represented as a list or an array, with the array index corresponding one-to-one with the page node.
[0057] Once it is determined that the page to be updated has received new page data, all page nodes are retraced in the same order as the nodes that constructed the first hash value group. The second node data hash value of each node is calculated based on the new data and stored in another array structure in the same order to form the second hash value group.
[0058] Furthermore, by using the two pre-constructed hash value groups, a comparison operation of the node data hash values can be performed to identify at least one target page node whose node data hash value has changed. This comparison operation can be performed by iterating through each index position of the two hash value groups and comparing the first hash value with the second hash value at the same index. If they are different, the page node corresponding to that index is determined to be the target page node.
[0059] In this embodiment, storing hash values centrally in an array or list leverages modern processors' optimizations for contiguous memory access, reducing cache misses and improving traversal speed. Simultaneously, the code implementation is more concise, requiring only a single loop or vectorized instruction to compare all nodes.
[0060] In yet another exemplary embodiment of the present invention, the description continues with the previously described embodiments, wherein the first node data identifier includes a first node data timestamp; and the second node data identifier includes a second node data timestamp. The step of comparing the first node data identifier with the second node data identifier to identify at least one target page node whose node data identifier has changed includes: By comparing the timestamp of the first node data with the timestamp of the second node data, at least one target page node whose node data timestamp has changed is identified among the page nodes.
[0061] In one embodiment, after the page is first rendered or after the last update, all page nodes in the current page to be updated are traversed, and the first node data timestamp corresponding to each node is obtained. The node data timestamp can be a time field carried by the data source itself, the system time when the data was loaded or updated, or a version timestamp generated by the backend and distributed along with the data. Each node's timestamp must uniquely map to its node data; that is, its timestamp will only be updated if and only if the node data changes.
[0062] Furthermore, once it is determined that the page to be updated has received new page data, for example through overall data hash value detection or a polling mechanism, for the same group of page nodes, the second node data timestamp corresponding to each node is extracted from the new data. The extraction method must be consistent with the extraction of the second node data timestamp.
[0063] The timestamps of the first and second nodes of each node are compared item by item. If the two timestamps are equal, it means that the data content of that node has not changed since the last update and does not need to be updated. If the two timestamps are not equal, the node is determined to be a target page node, and its data content has changed. By comparing the timestamps, all nodes whose data has changed can be quickly filtered out, forming a set of target page nodes.
[0064] In yet another exemplary embodiment of the present invention, continuing with the previously described embodiments, before comparing the first node data timestamp with the second node data timestamp and identifying at least one target page node in the page nodes whose node data timestamp has changed, the method further includes: Store the timestamps of the first node data of each of the page nodes into the first timestamp group; Store the timestamps of the second node data of each of the page nodes into the second timestamp group; The step of comparing the timestamps of the first node data and the second node data to identify at least one target page node whose timestamp has changed includes: By comparing the first node data timestamp with the second node data timestamp using the first timestamp group and the second timestamp group, at least one target page node whose node data timestamp has changed can be identified in the page nodes.
[0065] In one embodiment, after the page is first rendered or after the last update, all page nodes are traversed in a predetermined unified order, such as the order in which nodes appear in the page document flow, the ascending order of node IDs, or the depth-first traversal order of the node tree. For each node, its corresponding first node data timestamp is obtained and stored sequentially in an array structure according to the traversal order to form a first timestamp group.
[0066] Once it is determined that the page to be updated has received new page data, all page nodes are retraced in the same order as the nodes that constructed the first timestamp group. Based on the new data, the second node data timestamp of each node is obtained and stored in another array structure in the same order to form the second timestamp group.
[0067] Furthermore, the two constructed timestamp groups can be used to compare the timestamps of node data. For example, by looping through each index position of the two timestamp groups, the first timestamp and the second timestamp under the same index can be compared. If they are different, the page node corresponding to that index is determined to be the target page node.
[0068] In this embodiment, storing timestamps in a contiguous array of memory allows for significant reduction in memory access latency by leveraging the CPU's cache prefetching mechanism. Traversing the two arrays and comparing each element requires only one loop, resulting in concise code and fast execution.
[0069] In yet another exemplary embodiment of the present invention, the updated node data of the target page node is obtained in the following manner: The node data identifier of the target page node is reverse mapped to obtain the updated node data of the target page node.
[0070] In one embodiment, during system initialization or data loading, a reversible mapping mechanism can be established between each page node data and its identifier. This mechanism can be encoding / decoding mapping, index / pointer mapping, hash table mapping, etc. For encoding / decoding mapping, if the node data is a simple numerical value or string, the node data identifier can be the result of some reversible encoding, such as Base64 or a custom compression algorithm. The original data can be restored from the identifier using the corresponding decoding algorithm, i.e., reverse mapping calculation. For index / pointer mapping, the node data identifier can be an index, pointer, or key pointing to a data storage location, such as an array subscript, memory address, or database primary key. During reverse mapping calculation, the storage location is directly accessed through the identifier to retrieve the corresponding node data. For hash table mapping, a mapping table can be maintained from node data identifiers, such as hash values, to the original data. Reverse mapping calculation involves searching in this mapping table; if a match is found, the corresponding original data is directly returned.
[0071] During application, after identifying the target page node through node data identification comparison, the second node data identifier of the target page node is obtained, which is the identifier corresponding to the new data. Subsequently, according to a pre-established reversible mapping mechanism, a reverse mapping calculation can be performed on this second node data identifier to directly obtain the updated node data corresponding to the target page node. The updated node data obtained from the reverse mapping calculation can be directly used for rendering and updating the target page node.
[0072] In this embodiment, node data identifiers typically occupy less storage space than the original data, such as indexes, hash values, and compressed strings. When updated data is needed, it can be directly obtained from the identifier through reverse mapping, without needing to request the complete data from the server again, which is especially suitable for scenarios with limited network bandwidth.
[0073] As described above, the page rendering update method provided by the present invention includes: obtaining a first node data identifier for each page node in the page to be updated, wherein the node data identifier is uniquely mapped to page node data; in response to the page to be updated receiving new page data, obtaining a second node data identifier for each page node in the page to be updated; comparing the first node data identifier and the second node data identifier, identifying at least one target page node whose node data identifier has changed among the page nodes; obtaining updated node data of the target page node based on the target page node; and rendering and updating the page to be updated based on the updated node data of the target page node, thereby achieving fast and accurate page rendering updates.
[0074] The page rendering and updating apparatus provided by the present invention will be described below. The page rendering and updating apparatus described below can be referred to in correspondence with the page rendering and updating method described above.
[0075] Figure 3 This is a structural schematic diagram of the page rendering and updating device provided by the present invention. The following will be combined with… Figure 3 The page rendering and updating apparatus provided by the present invention will be described.
[0076] In an exemplary embodiment of the present invention, combined with Figure 3 As can be seen, the page rendering update device may include a first acquisition module 310, a second acquisition module 320, a comparison module 330, a processing module 340, and a rendering module 350. Each module will be described in detail below.
[0077] The first acquisition module 310 can be configured to acquire the first node data identifier of each page node in the page to be updated, wherein the node data identifier is uniquely mapped to the page node data. The second acquisition module 320 can be configured to acquire the second node data identifier of each page node in the page to be updated in response to the page to be updated receiving new page data; The comparison module 330 can be configured to compare the first node data identifier with the second node data identifier, and identify at least one target page node in the page node whose node data identifier has changed; The processing module 340 can be configured to obtain the updated node data of the target page node based on the target page node; The rendering module 350 can be configured to render and update the page to be updated based on the update node data of the target page node.
[0078] In an exemplary embodiment of the present invention, the second acquisition module 320 may determine that the page to be updated has received new page data in the following manner: Obtain the hash value of the first page data of the page to be updated; At preset time intervals, obtain the second page data hash value of the page to be updated at the preset time interval; In response to the fact that the hash value of the first page data is different from the hash value of the second page data, it is determined that the page to be updated has received new page data.
[0079] In an exemplary embodiment of the present invention, the first node data identifier includes a first node data hash value; the second node data identifier includes a second node data hash value. The comparison module 330 can compare the first node data identifier with the second node data identifier in the following way, and identify at least one target page node in the page nodes whose node data identifier has changed: By comparing the hash value of the first node data with the hash value of the second node data, at least one target page node whose node data hash value has changed is identified among the page nodes.
[0080] In an exemplary embodiment of the present invention, the comparison module 330 may further be configured to: Store the hash value of each first node data of each page node into the first hash value group; Store the hash value of each second node data of each page node into the second hash value group; The comparison module 330 can compare the hash values of the first node data and the second node data in the following way, and identify at least one target page node whose node data hash value has changed in the page nodes: By comparing the first hash value group and the second hash value group, the hash value of the first node data is compared with the hash value of the second node data to identify at least one target page node whose node data hash value has changed in the page node.
[0081] In an exemplary embodiment of the present invention, the first node data identifier includes a first node data timestamp; the second node data identifier includes a second node data timestamp. The comparison module 330 can also compare the first node data identifier with the second node data identifier in the following way, and identify at least one target page node in the page nodes whose node data identifier has changed: By comparing the timestamp of the first node data with the timestamp of the second node data, at least one target page node whose node data timestamp has changed is identified among the page nodes.
[0082] In an exemplary embodiment of the present invention, the comparison module 330 may further be configured to: Store the timestamps of the first node data of each of the page nodes into the first timestamp group; Store the timestamps of the second node data of each of the page nodes into the second timestamp group; The comparison module 330 can compare the timestamps of the first node data and the second node data in the following way, and identify at least one target page node whose node data timestamp has changed in the page nodes: By comparing the first node data timestamp with the second node data timestamp using the first timestamp group and the second timestamp group, at least one target page node whose node data timestamp has changed can be identified in the page nodes.
[0083] In an exemplary embodiment of the present invention, the second acquisition module 320 may acquire the update node data of the target page node in the following manner: The node data identifier of the target page node is reverse mapped to obtain the updated node data of the target page node.
[0084] Figure 4 An example is a schematic diagram of the physical structure of an electronic device, such as... Figure 4 As shown, the electronic device may include a processor 410, a communications interface 420, a memory 430, and a communication bus 440, wherein the processor 410, communications interface 420, and memory 430 communicate with each other via the communication bus 440. The processor 410 can call logical instructions in the memory 430 to execute a page rendering update method. This method includes: obtaining a first node data identifier for each page node in the page to be updated, wherein the node data identifier uniquely maps to page node data; in response to the page to be updated receiving new page data, obtaining a second node data identifier for each page node in the page to be updated; comparing the first node data identifier and the second node data identifier to identify at least one target page node whose node data identifier has changed; based on the target page node, obtaining updated node data for the target page node; and rendering and updating the page to be updated based on the updated node data of the target page node.
[0085] Furthermore, the logical instructions in the aforementioned memory 430 can be implemented as software functional units and, when sold or used as independent products, can be stored in a computer-readable storage medium. Based on this understanding, the technical solution of the present invention, or the part that contributes to the prior art, or a part of the technical solution, can be embodied in the form of a software product. This computer software product is stored in a storage medium and includes several instructions to cause a computer device (which may be a personal computer, server, or network device, etc.) to execute all or part of the steps of the methods described in the various embodiments of the present invention. The aforementioned storage medium includes various media capable of storing program code, such as USB flash drives, portable hard drives, read-only memory (ROM), random access memory (RAM), magnetic disks, or optical disks.
[0086] On the other hand, the present invention also provides a computer program product, which includes a computer program that can be stored on a non-transitory computer-readable storage medium. When the computer program is executed by a processor, the computer can execute the page rendering update method provided by the above methods. The method includes: obtaining a first node data identifier for each page node in the page to be updated, wherein the node data identifier is uniquely mapped to page node data; in response to the page to be updated receiving new page data, obtaining a second node data identifier for each page node in the page to be updated; comparing the first node data identifier and the second node data identifier, identifying at least one target page node in the page nodes whose node data identifier has changed; obtaining updated node data of the target page node based on the target page node; and rendering and updating the page to be updated based on the updated node data of the target page node.
[0087] In another aspect, the present invention also provides a non-transitory computer-readable storage medium storing a computer program thereon, which, when executed by a processor, implements the page rendering update method provided by the above methods. The method includes: obtaining a first node data identifier for each page node in the page to be updated, wherein the node data identifier uniquely maps to page node data; in response to the page to be updated receiving new page data, obtaining a second node data identifier for each page node in the page to be updated; comparing the first node data identifier and the second node data identifier, identifying at least one target page node among the page nodes whose node data identifier has changed; based on the target page node, obtaining updated node data of the target page node; and rendering and updating the page to be updated based on the updated node data of the target page node.
[0088] The device embodiments described above are merely illustrative. The units described as separate components may or may not be physically separate. The components shown as units may or may not be physical units; that is, they may be located in one place or distributed across multiple network units. Some or all of the modules can be selected to achieve the purpose of this embodiment according to actual needs. Those skilled in the art can understand and implement this without any creative effort.
[0089] Through the above description of the embodiments, those skilled in the art can clearly understand that each embodiment can be implemented by means of software plus necessary general-purpose hardware platforms, and of course, it can also be implemented by hardware. Based on this understanding, the above technical solutions, in essence or the part that contributes to the prior art, can be embodied in the form of a software product. This computer software product can be stored in a computer-readable storage medium, such as ROM / RAM, magnetic disk, optical disk, etc., and includes several instructions to cause a computer device (which may be a personal computer, server, or network device, etc.) to execute the methods described in the various embodiments or some parts of the embodiments.
[0090] Finally, it should be noted that the above embodiments are only used to illustrate the technical solutions of the present invention, and not to limit them; although the present invention has been described in detail with reference to the foregoing embodiments, those skilled in the art should understand that modifications can still be made to the technical solutions described in the foregoing embodiments, or equivalent substitutions can be made to some of the technical features; and these modifications or substitutions do not cause the essence of the corresponding technical solutions to deviate from the spirit and scope of the technical solutions of the embodiments of the present invention.
Claims
1. A page rendering and updating method, characterized in that, The method includes: Obtain the first node data identifier of each page node in the page to be updated, where the node data identifier is uniquely mapped to the page node data; In response to the page to be updated receiving new page data, the second node data identifier of each page node in the page to be updated is obtained; By comparing the first node data identifier with the second node data identifier, at least one target page node whose node data identifier has changed is identified in the page nodes; Based on the target page node, obtain the updated node data of the target page node; Based on the update node data of the target page node, the page to be updated is rendered and updated.
2. The page rendering and updating method according to claim 1, characterized in that, The following method is used to determine that the page to be updated has received new page data: Obtain the hash value of the first page data of the page to be updated; At preset time intervals, obtain the second page data hash value of the page to be updated at the preset time interval; In response to the fact that the hash value of the first page data is different from the hash value of the second page data, it is determined that the page to be updated has received new page data.
3. The page rendering and updating method according to claim 1 or 2, characterized in that, The first node data identifier includes the hash value of the first node data; the second node data identifier includes the hash value of the second node data. The step of comparing the first node data identifier with the second node data identifier to identify at least one target page node whose node data identifier has changed includes: By comparing the hash value of the first node data with the hash value of the second node data, at least one target page node whose node data hash value has changed is identified among the page nodes.
4. The page rendering and updating method according to claim 3, characterized in that, Before comparing the first node data hash value with the second node data hash value and identifying at least one target page node whose node data hash value has changed, the method further includes: Store the hash value of each first node data of each page node into the first hash value group; Store the hash value of each second node data of each page node into the second hash value group; The step of comparing the hash values of the first node data and the hash values of the second node data to identify at least one target page node whose node data hash value has changed includes: By comparing the first hash value group and the second hash value group, the hash value of the first node data is compared with the hash value of the second node data to identify at least one target page node whose node data hash value has changed in the page node.
5. The page rendering and updating method according to claim 1 or 2, characterized in that, The first node data identifier includes a first node data timestamp; the second node data identifier includes a second node data timestamp. The step of comparing the first node data identifier with the second node data identifier to identify at least one target page node whose node data identifier has changed includes: By comparing the timestamp of the first node data with the timestamp of the second node data, at least one target page node whose node data timestamp has changed is identified among the page nodes.
6. The page rendering and updating method according to claim 5, characterized in that, Before comparing the first node data timestamp with the second node data timestamp and identifying at least one target page node in the page nodes whose node data timestamp has changed, the method further includes: Store the timestamps of the first node data of each of the page nodes into the first timestamp group; Store the timestamps of the second node data of each of the page nodes into the second timestamp group; The step of comparing the timestamps of the first node data and the second node data to identify at least one target page node whose timestamp has changed includes: By comparing the first node data timestamp with the second node data timestamp using the first timestamp group and the second timestamp group, at least one target page node whose node data timestamp has changed can be identified in the page nodes.
7. The page rendering and updating method according to claim 1, characterized in that, The updated node data of the target page node is obtained in the following way: The node data identifier of the target page node is reverse mapped to obtain the updated node data of the target page node.
8. A page rendering and updating device, characterized in that, The device includes: The first acquisition module is used to acquire the first node data identifier of each page node in the page to be updated, wherein the node data identifier is uniquely mapped to the page node data; The second acquisition module is used to acquire the second node data identifier of each page node in the page to be updated in response to the page receiving new page data; The comparison module is used to compare the first node data identifier with the second node data identifier, and identify at least one target page node in the page nodes whose node data identifier has changed; The processing module is used to obtain the updated node data of the target page node based on the target page node; The rendering module is used to render and update the page to be updated based on the update node data of the target page node.
9. An electronic device comprising a memory, a processor, and a computer program stored in the memory and executable on the processor, characterized in that, When the processor executes the computer program, it implements the page rendering update method as described in any one of claims 1 to 7.
10. A non-transitory computer-readable storage medium having a computer program stored thereon, characterized in that, When the computer program is executed by a processor, it implements the page rendering update method as described in any one of claims 1 to 7.