CN114996607A

CN114996607A - Screen rendering method and device, electronic equipment and storage medium

Info

Publication number: CN114996607A
Application number: CN202210641638.8A
Authority: CN
Inventors: 李红艳
Original assignee: Beijing Dajia Internet Information Technology Co Ltd
Current assignee: Beijing Dajia Internet Information Technology Co Ltd
Priority date: 2022-06-07
Filing date: 2022-06-07
Publication date: 2022-09-02

Abstract

The present disclosure relates to a screen rendering method, an apparatus, an electronic device, and a storage medium, wherein the screen rendering method includes: receiving rendering data from a server, wherein the rendering data comprises a plurality of label data and rendering content data corresponding to each label data, and the plurality of label data are in a tree structure; responding to a received instruction for rendering a current screen, and acquiring initial position information for the rendering from the position recording information; determining initial tag data of the current rendering based on the initial position information used for the current rendering; acquiring a preset number of label data from the plurality of label data based on the initial label data and the tree structure rendered this time; and rendering the current screen by using the rendering content data corresponding to each tag data in the preset number of tag data. The method and the device can achieve rendering according to needs, reduce the pressure of the browser, and keep good and smooth operation experience under the condition of processing even tens of millions of data volumes.

Description

Screen rendering method and device, electronic equipment and storage medium

Technical Field

The present disclosure relates to the field of computer technologies, and in particular, to a screen rendering method and apparatus, an electronic device, and a storage medium.

Background

In the internet era, more and more people select to perform information interaction through various platforms on electronic clients, and when a user acquires information, data transmitted by a server needs to be rendered on a home page to complete information display for the user.

Disclosure of Invention

The present disclosure provides a screen rendering method, apparatus, electronic device, and storage medium to solve at least the problems of the related art described above, and may not solve any of the problems. The technical scheme of the disclosure is as follows:

according to a first aspect of an embodiment of the present disclosure, there is provided a screen rendering method including: receiving rendering data from a server, wherein the rendering data comprises a plurality of tag data and rendering content data corresponding to each tag data, and the tag data are in a tree structure; in response to receiving an instruction of rendering a current screen, acquiring starting position information for the current rendering from position record information, wherein the position record information records starting position information for each rendering, and the starting position information for each rendering indicates information for determining the position of starting label data for starting execution of each rendering in the tree structure; determining initial tag data of the rendering at this time based on the initial position information for the rendering at this time; acquiring a preset number of label data from the plurality of label data based on the initial label data rendered this time and the tree structure; and rendering the current screen by using rendering content data corresponding to each tag data in the preset number of tag data.

Optionally, in a case that the current screen is rendered for the first time, the starting position information for the current rendering is predefined starting position information, where the predefined starting position information is used to indicate that the starting tag data for the current rendering is tag data located at a tree root of the tree structure.

Optionally, in a case where the current screen is rendered for a non-first time, the start position information for the current rendering is position information of last rendered end tag data, where the last rendering is performed until the last rendered end tag data in the plurality of tag data; wherein, the determining the initial tag data of the current rendering based on the initial position information for the current rendering includes: and in the tree structure, determining the initial tag data of the current rendering according to the finishing tag data of the previous rendering.

Optionally, the determining, in the tree structure, the starting tag data of the current rendering according to the ending tag data of the previous rendering includes: acquiring state information for indicating that the last-rendered ending tag data is expanded or hidden, wherein the last-rendered ending tag data is sub tag data of which the expanded state represents the last-rendered ending tag data and can be acquired from a preset number of tag data required by the current rendering, and the last-rendered ending tag data is sub tag data of which the hidden state represents the last-rendered ending tag data and cannot be acquired from the preset number of tag data required by the current rendering; under the condition that the last rendered ending tag data is in an expanded state, determining that the first sub-tag data of the last rendered ending tag data in the tree structure is the starting tag data of the current rendering; and under the condition that the last rendered ending tag data is in a hidden state, determining parent tag data of the last rendered ending tag data in the tree structure, and determining that the next child tag data of the last rendered ending tag data is the starting tag data of the current rendering in all child tag data of the parent tag data of the last rendered ending tag data in the tree structure.

Optionally, in a case that the current screen is rendered based on tag data adjusted in any state, the starting position information for the current rendering is position information of the tag data adjusted in any state; wherein, the determining the initial tag data of the current rendering based on the initial position information for the current rendering includes: determining the initial tag data of the current rendering in the tree structure based on the tag data after any state adjustment; rendering content data corresponding to the tag data after any state adjustment is rendered on the current screen, where the tag data after any state adjustment is any tag data after being adjusted from an expanded state to a hidden state, or any tag data after being adjusted from a hidden state to an expanded state, the tag data after any state adjustment is sub-tag data of which the expanded state represents the tag data after any state adjustment and can be acquired into a preset number of tag data required by the current rendering, and the tag data after any state adjustment is sub-tag data of which the hidden state represents the tag data after any state adjustment and cannot be acquired into the preset number of tag data required by the current rendering.

Optionally, the determining, in the tree structure, the initial tag data of the current rendering based on the tag data after any state adjustment includes: acquiring state information for indicating whether the label data after any state adjustment is unfolded or hidden; under the condition that the tag data after any state adjustment is in an expansion state, determining that the first sub-tag data of the tag data after any state adjustment in the tree structure is the initial tag data of the current rendering; and under the condition that the tag data after any state adjustment is in a hidden state, determining parent tag data of the tag data after any state adjustment in the tree structure, and determining that the next child tag data of the tag data after any state adjustment is the initial tag data of the current rendering in all child tag data of the parent tag data in the tree structure.

Optionally, the method further comprises: adding a positioning index to the tag data corresponding to each rendering content data in all rendering content data which are rendered currently, wherein the positioning index comprises identification information of all tag data on a path from the tag data at the root of the tree structure to the tag data to which the positioning index is added; wherein the position information of the tag data after any state adjustment is determined by the following steps: and determining the position information of the tag data after any state adjustment according to the positioning index of the tag data after any state adjustment.

Optionally, after receiving the rendering data from the server, the method further includes: and flattening the rendering data to obtain flattened rendering data, wherein the step of determining the initial tag data of the current rendering, and the step of obtaining a preset number of tag data from the plurality of tag data based on the initial tag data of the current rendering and the tree structure are executed based on the flattened rendering data.

Optionally, the flattening the rendering data to obtain flattened rendering data includes: determining tag data of a root of the tree structure; determining a pair of tag data in the plurality of tag data, each pair of tag data having a parent-child relationship; determining rendering content data corresponding to each tag data in the plurality of tag data; and obtaining the rendering data after the flattening processing based on the tag data of the tree root of the tree structure, each tag data pair with a parent-child relationship in the plurality of tag data, and the rendering content data corresponding to each tag data in the plurality of tag data.

According to a second aspect of an embodiment of the present disclosure, there is provided a screen rendering apparatus including: a data receiving unit configured to: receiving rendering data from a server, wherein the rendering data comprises a plurality of label data and rendering content data corresponding to each label data, and the plurality of label data are in a tree structure; a start position acquisition unit configured to: in response to receiving an instruction of rendering a current screen, acquiring starting position information for the current rendering from position record information, wherein the position record information records starting position information for each rendering, and the starting position information for each rendering indicates information for determining the position of starting label data for starting execution of each rendering in the tree structure; a start tag determination unit configured to: determining initial tag data of the current rendering based on the initial position information for the current rendering; a tag acquisition unit configured to: acquiring a preset number of label data from the plurality of label data based on the initial label data rendered this time and the tree structure; a screen rendering unit configured to: and rendering the current screen by using the rendering content data corresponding to each tag data in the preset number of tag data.

Optionally, in a case that the current screen is rendered for a non-first time, the start position information for the current rendering is position information of last rendered end tag data, where the last rendering is performed until the last rendered end tag data in the plurality of tag data; the start tag determination unit is configured to: and in the tree structure, determining the initial tag data of the current rendering according to the finishing tag data of the previous rendering.

Optionally, the start label determining unit is configured to: acquiring state information for indicating that the last rendered end tag data is expanded or hidden, wherein the last rendered end tag data is sub tag data of which the expanded state represents the last rendered end tag data and can be acquired into a preset number of tag data required by the current rendering, and the last rendered end tag data is sub tag data of which the hidden state represents the last rendered end tag data and cannot be acquired into the preset number of tag data required by the current rendering; under the condition that the last rendered ending tag data is in an expanded state, determining that the first sub-tag data of the last rendered ending tag data in the tree structure is the starting tag data of the current rendering; and under the condition that the last rendered ending tag data is in a hidden state, determining parent tag data of the last rendered ending tag data in the tree structure, and determining that the next child tag data of the last rendered ending tag data is the starting tag data of the current rendering in all child tag data of the parent tag data of the last rendered ending tag data in the tree structure.

Optionally, in a case that the current screen is rendered based on tag data adjusted in any state, the starting position information for the current rendering is position information of the tag data adjusted in any state; the start tag determination unit is configured to: determining the initial tag data of the current rendering in the tree structure based on the tag data after any state adjustment; rendering content data corresponding to the tag data after any state adjustment is rendered on the current screen, where the tag data after any state adjustment is any tag data after being adjusted from an expanded state to a hidden state, or any tag data after being adjusted from a hidden state to an expanded state, the tag data after any state adjustment is that sub-tag data of the tag data after any state adjustment represents that the tag data after any state adjustment can be acquired into a preset number of tag data required by this rendering, and the tag data after any state adjustment represents that the sub-tag data of the tag data after any state adjustment represents that the tag data after any state adjustment cannot be acquired into the preset number of tag data required by this rendering.

Optionally, the start tag determination unit is configured to: acquiring state information for indicating whether the label data after any state adjustment is unfolded or hidden; under the condition that the tag data after any state adjustment is in an expansion state, determining that the first sub-tag data of the tag data after any state adjustment in the tree structure is the initial tag data of the current rendering; and under the condition that the tag data after any state adjustment is in a hidden state, determining parent tag data of the tag data after any state adjustment in the tree structure, and determining that the next child tag data of the tag data after any state adjustment is the initial tag data of the current rendering in all child tag data of the parent tag data in the tree structure.

Optionally, the apparatus further includes an index adding unit configured to: adding a positioning index to the tag data corresponding to each rendering content data in all rendering content data which are rendered currently, wherein the positioning index comprises identification information of all tag data on a path from the tag data at the root of the tree structure to the tag data to which the positioning index is added; wherein the start position acquisition unit is configured to: and determining the position information of the tag data after any state adjustment according to the positioning index of the tag data after any state adjustment.

Optionally, a flattening processing unit is further included, configured to: and flattening the rendering data to obtain flattened rendering data, wherein the initial label determining unit and the label acquiring unit are executed after the flattening processing unit is executed.

Optionally, the flattening processing unit is configured to: determining tag data of a root of the tree structure; determining a pair of tag data in the plurality of tag data, each pair of tag data having a parent-child relationship; determining rendering content data corresponding to each tag data in the plurality of tag data; and obtaining the rendering data after the flattening processing based on the tag data of the tree root of the tree structure, each tag data pair with a parent-child relationship in the plurality of tag data, and the rendering content data corresponding to each tag data in the plurality of tag data.

According to a third aspect of the embodiments of the present disclosure, there is provided an electronic apparatus including: at least one processor; at least one memory storing computer-executable instructions, wherein the computer-executable instructions, when executed by the at least one processor, cause the at least one processor to perform a screen rendering method according to the present disclosure.

According to a fourth aspect of embodiments of the present disclosure, there is provided a computer-readable storage medium storing instructions that, when executed by at least one processor, cause the at least one processor to perform a screen rendering method according to the present disclosure.

According to a fifth aspect of embodiments of the present disclosure, there is provided a computer program product comprising computer instructions which, when executed by at least one processor, implement a screen rendering method according to the present disclosure.

The technical scheme provided by the embodiment of the disclosure at least brings the following beneficial effects:

according to the screen rendering method, the device, the electronic equipment and the storage medium, under the condition that the screen needs to be rendered each time, the initial position information used for the rendering is obtained based on the position record information, the initial tag data of the rendering is further determined, and only the preset number of tag data are obtained to perform the rendering, so that only the data needed in the current time are processed during the rendering each time without obtaining and processing all the tag data, the rendering speed can be improved, the problems of blocking and the like caused by processing a large amount of data at one time are avoided, the rendering according to needs is realized, the pressure of a browser is reduced, and good and smooth operation experience can be kept under the condition of processing even thousands of data volumes.

In addition, according to the screen rendering method and device, the electronic device and the storage medium disclosed by the invention, the rendering data can be subjected to flattening processing, the data structure of the rendering data transmitted by the server is optimized, the complexity of a tree-shaped nested recursive structure is reduced, and the size of the rendering data is reduced, so that the acquisition efficiency of the preset number of label data is improved, and the smoothness of operation is ensured.

In addition, according to the screen rendering method, the screen rendering device, the electronic device and the storage medium, a positioning index can be added to the tag data corresponding to each rendered content data in all rendered content data, the initial position information of the rendering can be quickly determined, and the acquisition efficiency of the tag data with the preset number is improved.

It is to be understood that both the foregoing general description and the following detailed description are exemplary and explanatory only and are not restrictive of the disclosure.

Drawings

The accompanying drawings, which are incorporated in and constitute a part of this specification, illustrate embodiments consistent with the present disclosure and, together with the description, serve to explain the principles of the disclosure and are not to be construed as limiting the disclosure.

FIG. 1 is a flowchart illustrating a method of screen rendering according to an exemplary embodiment.

Fig. 2 is an overall architecture diagram illustrating a screen rendering method according to an exemplary embodiment.

Fig. 3 is a page presentation diagram illustrating a current screen according to an example embodiment.

Fig. 4 is a block diagram illustrating a screen rendering apparatus according to an exemplary embodiment.

Fig. 5 is a block diagram of an electronic device 500 according to an example embodiment.

Detailed Description

In order to make the technical solutions of the present disclosure better understood by those of ordinary skill in the art, the technical solutions in the embodiments of the present disclosure will be clearly and completely described below with reference to the accompanying drawings.

It should be noted that the terms "first," "second," and the like in the description and claims of the present disclosure and in the above-described drawings are used for distinguishing between similar elements and not necessarily for describing a particular sequential or chronological order. It is to be understood that the data so used is interchangeable under appropriate circumstances such that the embodiments of the disclosure described herein are capable of operation in sequences other than those illustrated or otherwise described herein. The embodiments described in the following examples do not represent all embodiments consistent with the present disclosure. Rather, they are merely examples of apparatus and methods consistent with certain aspects of the present disclosure, as detailed in the appended claims.

In this case, the expression "at least one of the items" in the present disclosure means a case where three types of parallel expressions "any one of the items", "a combination of any plural ones of the items", and "the entirety of the items" are included. For example, "including at least one of a and B" includes the following three cases in parallel: (1) comprises A; (2) comprises a component B; (3) including a and B. For another example, "at least one of the first step and the second step is performed", which means that the following three cases are juxtaposed: (1) executing the step one; (2) executing the step two; (3) and executing the step one and the step two.

In the internet era, more and more people choose to perform information interaction through various platforms on electronic clients, and when a user acquires information, data transmitted by a server needs to be rendered on a home page so as to complete information display on the user.

For the case of rendering tree-structured data, particularly tree-structured table data, one method in the related art is: the method comprises the steps that firstly, a client receives related label data of a tree root node in a tree structure, which is sent by a server, and then renders the content of the related label data, and then the related label data of other nodes are continuously requested from the server to render based on the operation of a user at the client.

Another method in the related art is: the method comprises the steps that firstly, a client receives all rendering data sent by a server, then all the rendering data are tiled, then the data volume of each rendering is controlled by virtual scrolling, and all the data need to be processed and then rendered under the conditions of first rendering, page hidden content unfolding and the like. In this approach, virtual scrolling refers to rendering the presented scrolling effect unchanged, but in practice only rendering part of the data at a time. Virtual scrolling enables on-demand loading, which is a general means for optimizing page rendering performance from a visual perspective, and the principle is to show only data currently needed by a user. No matter how large the data level is, the data volume which can be operated by the user is limited, and the data rendering pressure of the browser can be reduced by adopting the loading on demand, so that the effect of reducing the pressure of the browser can be achieved under the condition of not influencing the operation experience of the user. For example, 1000 pieces of data are required to be rendered in total, but only 100 pieces of data can be displayed in the visual range of the screen, so that only about 150 pieces of data are rendered to reduce the burden of a browser, and the flexible rendering by monitoring the scroll event through the client ensures that the effect of viewing the data at the client by a user is consistent with the effect of directly rendering 1000 pieces of data. Tiling can be a scheme for processing a data structure with deep hierarchical nesting into a tiled format that is set to solve the problem of more complex computation caused by deep hierarchical nesting of a tree structure. For example, the tree structure shown by the following code:

{

id:1

children:[{

id:2,children:[],

id:3,children:[{

id:4,children:[]

}]}]}

the parent-child relationships it exposes include (based on id description): the father node is 1 and the child node is 2, the father node is 1 and the child node is 3, and the father node is 3 and the child node is 4; the hierarchical relationship includes 3 layers (described based on id): 1 is a first layer, 2 and 3 are second layers, and 4 is a third layer.

Then the code can be tiled into:

[{id:1,level:1},{id:2,level:2,parentId:1},{id:3,level:2,parentId:1},{id:4,level:3,parentId:3}]

wherein, Level represents the Level.

However, the data transmission of this method is time-consuming, and all data may need to be processed many times based on user operation, and in the case of meeting a huge amount of data processing requirements, a page may be inoperable for a long time, which may result in poor user experience.

For the two methods, when the data volume needs to be rendered or even tens of millions of data volumes are met, the problems of slow data transmission, slow page rendering, heavy logic for processing data by the client and the like can result in slow page display or unsmooth operation, and the browsing and operation experience of the user is seriously influenced.

In order to solve the problems in the related art, the present disclosure provides a screen rendering method, an apparatus, an electronic device, and a storage medium, where in each case a screen needs to be rendered, initial position information for the rendering is obtained based on position record information, and then initial tag data for the rendering is determined, and only a preset number of tag data are obtained to perform the rendering, so that only data required in the current time is processed in each rendering without obtaining and processing all tag data, the rendering speed can be increased, the problem of stuttering and the like caused by processing a large amount of data at one time is avoided, the rendering as needed is realized, the pressure of a browser is reduced, and good and smooth operation experience can be maintained even in the case of processing even ten million-level data amount.

Hereinafter, a screen rendering method, apparatus, electronic device, and storage medium according to the present disclosure will be described in detail with reference to fig. 1 to 5.

FIG. 1 is a flow chart illustrating a method of screen rendering according to an exemplary embodiment. The process shown in fig. 1 is applicable to a client. Referring to fig. 1, in step 101, rendering data may be received from a server, where the rendering data includes a plurality of tag data and rendering content data corresponding to each tag data, and the plurality of tag data is in a tree structure. In particular, the rendering data may be used to render one page of the current (client) screen, it being understood that the rendering of the current screen described in the exemplary embodiments of the present disclosure may be the rendering of the page in the current screen, and the visual range of the page may be set to, but is not limited to, the visual range of the current screen. The rendering data may be, but is not limited to, HTML data, XML data, etc., and for the case where the rendering data is HTML data, the tag data may be a tag corresponding to the HTML data, including, but not limited to, a table tag, etc.

In step 102, in response to receiving an instruction to render the current screen, starting position information for the current rendering may be obtained from position record information, where the position record information records starting position information for each rendering, and the starting position information for each rendering indicates information for determining a position of starting tag data in a tree structure at which each rendering starts to be executed. It should be noted that the form of the location record information may include, but is not limited to, a data type form.

According to an exemplary embodiment of the present disclosure, the position record information may be sequentially recorded with start position information for each rendering in chronological order, wherein the start position information for each rendering may be recorded into the position record information before each rendering, and based on this, in response to receiving an instruction to render the current screen, the last recorded start position information may be acquired from the position record information as the start position information for the current rendering.

In step 103, the start tag data of the current rendering may be determined based on the start position information for the current rendering.

According to an exemplary embodiment of the present disclosure, the instruction to render the current screen in step 102 may be received in the following three cases: it should be noted that the three cases are only illustrative, and the exemplary embodiment of the present disclosure also protects other cases that can receive an instruction to render the current screen.

Under the condition that the current screen is rendered for the first time, the initial position information used for the rendering at this time is predefined initial position information, wherein the predefined initial position information is used for indicating that the initial label data used for the rendering at this time is the label data located at the tree root of the tree structure. In particular, this may occur when the user clicks on the display of a rendered page, which may be the page for which the rendering data received in step 101 was used for rendering. In the case where the form of the location record information is that of a data class, recording predefined start location information into the location record information may be understood as an operation of initializing a class. When there are a plurality of tag data located at the tree root of the tree structure, the initial tag data of the current rendering is the first tag data located at the tree root of the tree structure.

In a case where the current screen is rendered non-first time, the start position information for the current rendering is position information of last rendered end tag data, where the last rendering is performed until the last rendered end tag data among the plurality of tag data. Specifically, this may occur when the user clicks on the rendered content data corresponding to the tag data after displaying the last rendered end tag data, for example, when the user pulls down the scroll bar of the rendered page described in the above embodiment to the bottommost portion of the draggable range.

For example, the start position information may include, but is not limited to, information indicating that the last rendered end tag data is the next child tag data of its parent tag data, information indicating the next child tag data of the last rendered end tag data among the child tag data of the parent tag data of the last rendered end tag data, information indicating the parent tag data of the last rendered end tag data, information for determining whether or not to constitute a ring check until rendering to the rendered content data corresponding to the last rendered end tag data (which may be implemented by recording identification information of tag data corresponding to each rendered content data among all rendered content data, wherein, in the case where there is any pair of the recorded identification information being the same, it is determined to constitute a ring check), exemplary embodiments of the present disclosure may, in the case of constituting a ring check, and stopping executing the rendering operation, and reducing the occurrence of rendering errors.

For example, the starting position information may be expressed as:

where the CataLog characterizes the location record information, the above code representation is merely illustrative, and the present disclosure also protects other forms of starting location information.

In this case, the start tag data of the current rendering may be determined according to the end tag data of the previous rendering in the tree structure. Specifically, first, state information indicating that the last rendered end tag data is expanded or hidden may be obtained, where sub tag data of which the last rendered end tag data is an expanded state representing the last rendered end tag data can be obtained from the preset number of tag data required for the current rendering, and sub tag data of which the last rendered end tag data is a hidden state representing the last rendered end tag data cannot be obtained from the preset number of tag data required for the current rendering. Then, under the condition that the last rendered ending tag data is in an expanded state, determining that the first sub-tag data of the last rendered ending tag data in the tree structure is the starting tag data of the current rendering; the parent tag data of the last rendered end tag data in the tree structure may be determined under the condition that the last rendered end tag data is in a hidden state, and the next child tag data of the last rendered end tag data is determined to be the starting tag data of the current rendering from all child tag data of the parent tag data of the last rendered end tag data in the tree structure.

And under the condition that the current screen is rendered based on the tag data after any state adjustment, the initial position information for the current rendering is the position information of the tag data after any state adjustment. Here, rendering content data corresponding to any state-adjusted tag data is rendered on a current screen, where any state-adjusted tag data is any tag data adjusted from an expanded state to a hidden state, or any tag data adjusted from a hidden state to an expanded state, sub-tag data of any state-adjusted tag data representing any state-adjusted tag data in an expanded state can be acquired into a preset number of tag data required for the current rendering, and sub-tag data of any state-adjusted tag data representing any state-adjusted tag data in a hidden state cannot be acquired into the preset number of tag data required for the current rendering. It should be noted that this situation may occur after the user clicks on rendering content data corresponding to any adjustable tag data in the screen, and the adjustable tag data may be, but is not limited to, tag data including sub-tag data, and specifically, after the user clicks on rendering content data corresponding to any adjustable tag data in the screen, the adjustable tag data may perform state adjustment to obtain state-adjusted tag data.

For example, the start position information may include, but is not limited to, information indicating that any state-adjusted tag data is the next child tag data of its parent tag data, information indicating the next child tag data of any state-adjusted tag data among the child tag data of the parent tag data of any state-adjusted tag data, information indicating the parent tag data of any state-adjusted tag data, information for determining whether or not to constitute a ring check until rendering to rendering content data corresponding to any state-adjusted tag data (which may be implemented by recording identification information of tag data corresponding to each rendering content data among all rendering content data that have been rendered, wherein it is determined to constitute a ring check in the case where there is any pair of recorded identification information that is the same), and stopping executing the rendering operation, and reducing the occurrence of rendering errors.

In this case, since an acquisition path of tag data corresponding to rendering content data that has been rendered onto the current screen in the tree structure is determined, an exemplary embodiment of the present disclosure may add a positioning index (customId) to the tag data corresponding to each rendering content data of all rendering content data that have been rendered currently, where the positioning index includes identification information of all tag data on a path from the tag data located at the root of the tree structure to the tag data to which the positioning index is added. For example, a positioning index may be added to the tag data corresponding to each of all rendering content data that have been currently rendered while each rendering content data is being rendered. For example, the positioning index may be expressed as, but is not limited to: (identification information of tag data located at the root of the tree- … -identification information of parent tag data of tag data to which a positioning index is added-identification information of tag data to which a positioning index is added), the location information of any state-adjusted tag data may be determined according to the positioning index of any state-adjusted tag data, for example, the location information may be determined by performing symbol division on the positioning index by a split method.

In this case, the initial tag data of the current rendering may be determined in the tree structure based on the tag data adjusted in any state. Specifically, first, state information indicating whether any of the state-adjusted tag data is expanded or hidden may be acquired. Then, under the condition that the tag data after any state adjustment is in the expansion state, determining that the first sub-tag data of the tag data after any state adjustment in the tree structure is the initial tag data of the current rendering; the parent tag data of the tag data after any state adjustment in the tree structure can be determined under the condition that the tag data after any state adjustment is in the hidden state, and the next child tag data of the tag data after any state adjustment in all child tag data of the parent tag data in the tree structure is determined to be the initial tag data of the current rendering.

Referring back to fig. 1, in step 104, a preset number of tag data may be obtained from the plurality of tag data based on the initial tag data and the tree structure of the current rendering. Here, a preset number of tag data may be acquired one by one backward from among a plurality of tag data in a tree structure based on the starting tag data of the present rendering, and during the acquisition one by one, it may be determined that each sub-tag data thereof cannot be acquired in consideration of state information of each acquired tag data and hierarchical information thereof in the tree structure. The preset number may be determined according to the height of the current screen before the current screen is rendered for the first time.

According to the exemplary embodiment of the present disclosure, after step 101, the rendering data may be subjected to a flattening process to obtain flattened rendering data, where step 103 and step 104 are performed based on the flattened rendering data. It should be noted that, in the rendering data in the exemplary embodiment of the present disclosure, the plurality of tag data are in a tree structure, so that the rendering data is nested in multiple layers, and the flattening process may refer to converting and tiling the nested multiple layers of rendering data into rendering data of only one layer.

Here, first, tag data located at a tree root of the tree structure may be determined; then, each label data pair with a parent-child relationship in the plurality of label data can be determined; next, rendering content data corresponding to each of the plurality of tag data may be determined; and finally, based on the tag data of the tree root of the tree structure, each tag data pair with a parent-child relationship in the plurality of tag data, and rendering content data corresponding to each tag data in the plurality of tag data, obtaining the rendering data after the flattening processing. It should be noted that, the description sequence of the steps of determining the tag data located at the root of the tree structure, determining each pair of tag data having a parent-child relationship in the plurality of tag data, and determining the rendering content data corresponding to each tag data in the plurality of tag data is only illustrative, and the sequence of the three determining steps may be adjusted adaptively.

For example, but not limited to, the tag data located at the root of the tree structure, the pair of tag data each having a parent-child relationship in the plurality of tag data, and the rendering content data corresponding to each of the plurality of tag data are used as the rendering data after the flattening processing.

For example, but not limiting of, the flattened rendered data may be represented as:

in step 105, the current screen may be rendered by using the rendering content data corresponding to each of the tag data in the preset number of tag data. The exemplary embodiments of the present disclosure may implement on-demand loading by rendering a current screen using rendering content data corresponding to each of a preset number of tag data.

According to an exemplary embodiment of the present disclosure, all rendered content data may be recorded into a content information set (dataList), and in a case where a user pulls up a scroll bar of a rendered page as described in the above embodiments, corresponding rendered content data may be acquired from the content information set according to a pull position and rendered on a current screen.

Fig. 2 is an overall architecture diagram illustrating a screen rendering method according to an exemplary embodiment. Fig. 3 is a page presentation diagram illustrating a current screen according to an example embodiment. Further explanation is made below with reference to fig. 2 and 3 on the screen rendering method in the exemplary embodiment of the present disclosure.

First, rendering data may be received from the server, where the rendering data includes a plurality of tag data and rendering content data corresponding to each tag data, the plurality of tag data are in a tree structure, and the rendering data may be used to render one rendering page of the current screen, and the rendering of the current screen described in the following step may be understood as rendering the rendering page in the current screen, and the visual range of the rendering page may be set to, but is not limited to, the visual range of the current screen.

Then, referring to fig. 2, before the first rendering is performed, the number of tag data required for each rendering may be determined according to the height of the current screen (i.e., the height of the visible range of the current screen), and the number of tag data required for each rendering may be preset according to the determined number, for example, in a case that rendering content data corresponding to 20 tag data may be displayed within the height of the current screen, the preset number may be 50.

Next, the current screen may be rendered for the first time, and in the case of rendering the current screen for the first time, predefined start position information may be recorded into the position record information (the predefined start position information is used to indicate that the rendered start tag data is tag data located at a tree root of a tree structure), then the predefined start position information is obtained from the position record information as the start position information for the current rendering, then the start tag data for the first rendering (tag data located at the tree root of the tree structure) is determined according to the start position information for the current rendering, then the tag data is obtained according to the number preset in the previous step, and the rendering content data corresponding to the obtained tag data is used for the first rendering.

Next, referring to fig. 2, when the user pulls down the scroll bar of the rendered page to the bottom of the draggable range, the current screen may be rendered continuously, and the start position information for the rendering may be determined. For the method of determining the starting position information for the current rendering, the position information of the last rendered ending tag data may be recorded into the position record information, then the position information is obtained from the position record information as the starting position information for the current rendering, then the starting tag data for the current rendering (the next tag data of the last rendered ending tag data) is determined according to the starting position information for the current rendering, then the tag data is obtained according to the number preset in the preamble step, and the rendering content data corresponding to the obtained tag data is used for the current rendering.

Referring to fig. 2, both arrows on the left side indicate rendering content data corresponding to the adjustable tag data, for example, referring to fig. 3, both a line corresponding to "root" and a line corresponding to "1" are rendering content data corresponding to the adjustable tag data. After the user clicks the rendering content data corresponding to any one of the adjustable tag data, the adjustable tag data can be subjected to state adjustment to obtain state-adjusted tag data, determining initial position information for the current rendering in a case where the current screen is rendered based on the state-adjusted tag data, for the manner of determining the starting position information for the current rendering, the position information of the state-adjusted tag data may be recorded into the position recording information, and then, obtaining the position information from the position record information as initial position information for the current rendering, determining initial label data (next label data of the label data after the state adjustment) of the current rendering according to the initial position information for the current rendering, then obtaining the label data according to the preset number in the preorder step, and performing the current rendering by using rendering content data corresponding to the obtained label data.

After each rendering, all rendered content data can be recorded into the content information set, and under the condition that a scroll bar of a rendered page is pulled upwards by a user, corresponding rendered content data can be acquired from the content information set according to the pulling position and rendered on a current screen.

Fig. 4 is a block diagram illustrating a screen rendering apparatus according to an exemplary embodiment. Referring to fig. 4, the screen rendering apparatus 400 includes a data receiving unit 401, a start position acquiring unit 402, a start tag determining unit 403, a tag acquiring unit 404, and a screen rendering unit 405.

The data receiving unit 401 may receive rendering data from a server, where the rendering data includes a plurality of tag data and rendering content data corresponding to each tag data, and the plurality of tag data are in a tree structure. In particular, the rendering data may be used to render one page of the current (client) screen, it being understood that the rendering of the current screen described in the exemplary embodiments of the present disclosure may be the rendering of the page in the current screen, and the visual range of the page may be set to, but is not limited to, the visual range of the current screen. The rendering data may be, but is not limited to, HTML data, XML data, etc., and for the case where the rendering data is HTML data, the tag data may be a tag corresponding to the HTML data, including, but not limited to, a table tag, etc.

The start position obtaining unit 402 may obtain start position information for the current rendering from position record information in response to receiving an instruction to render the current screen, where the position record information is recorded with start position information for each rendering, and the start position information for each rendering indicates information for determining a position of start tag data in the tree structure at which each rendering starts to be performed. It should be noted that the form of the location record information may include, but is not limited to, a data type form.

According to an example embodiment of the present disclosure, the position record information may be sequentially recorded with start position information for each rendering in chronological order, wherein the start position information for each rendering may be recorded into the position record information before each rendering, based on which the start position obtaining unit 402 may obtain, in response to receiving an instruction to render the current screen, the last recorded start position information from the position record information as the start position information for this rendering.

The start tag determination unit 403 may determine start tag data of the current rendering based on the start position information for the current rendering.

According to an exemplary embodiment of the present disclosure, the instruction to render the current screen in the home position acquisition unit 402 may be received in the following three cases: it should be noted that the three cases are only illustrative, and the exemplary embodiment of the present disclosure also protects other cases that can receive an instruction to render the current screen.

Under the condition that the current screen is rendered for the first time, the initial position information used for the rendering at this time is predefined initial position information, wherein the predefined initial position information is used for indicating that the initial label data used for the rendering at this time is the label data located at the tree root of the tree structure. Specifically, this may occur when the user clicks on displaying a rendered page, which may be the page for which the rendering data received in the data receiving unit 401 is used for rendering. In the case where the form of the location record information is that of a data class, recording predefined start location information into the location record information may be understood as an operation of initializing a class. When there are a plurality of tag data located at the tree root of the tree structure, the initial tag data of the current rendering is the first tag data located at the tree root of the tree structure.

In this case, the start tag determination unit 403 may determine the start tag data of the current rendering according to the end tag data of the previous rendering in the tree structure. Specifically, first, the start tag determining unit 403 may obtain state information indicating that the last rendered end tag data is expanded or hidden, where the last rendered end tag data is sub tag data of which the expanded state represents the last rendered end tag data and which can be obtained from a preset number of tag data required for the current rendering, and the last rendered end tag data of which the hidden state represents the last rendered end tag data and which cannot be obtained from the preset number of tag data required for the current rendering. Then, the start tag determining unit 403 may determine that the first sub-tag data of the last rendered end tag data in the tree structure is the start tag data of the current rendering when the last rendered end tag data is in the expanded state; the start tag determining unit 403 may determine, when the last rendered end tag data is in a hidden state, parent tag data of the last rendered end tag data in the tree structure, and determine, from all child tag data of the parent tag data in the tree structure of the last rendered end tag data, that the next child tag data of the last rendered end tag data is the start tag data of the current rendering.

For example, the start position information may include, but is not limited to, information indicating that any state-adjusted tag data is the several-th child tag data of its parent tag data, information indicating that any state-adjusted tag data is the next child tag data of any state-adjusted tag data among child tag data of parent tag data of any state-adjusted tag data, information indicating parent tag data of any state-adjusted tag data, information for determining whether or not to constitute a ring check until rendering to rendered content data corresponding to any state-adjusted tag data (which may be implemented by recording identification information of tag data corresponding to each rendered content data among all rendered content data, wherein it is determined to constitute a ring check in the case where there is any pair of recorded identification information that are the same), exemplary embodiments of the present disclosure may, in the case of constituting a ring check, and stopping executing the rendering operation, and reducing the occurrence of rendering errors.

In this case, since the obtaining path of the tag data corresponding to the rendering content data rendered onto the current screen in the tree structure is determined, the screen rendering apparatus 400 may further include an index adding unit that may add a positioning index (customId) to the tag data corresponding to each of all rendering content data that have been rendered currently, where the positioning index includes identification information of all tag data on a path from the tag data located at the root of the tree structure to the tag data to which the positioning index is added. For example, the index adding unit may add the positioning index to the tag data corresponding thereto while each of all rendering content data that have been currently rendered is rendered. For example, the positioning index may be expressed as, but is not limited to: (identification information of tag data located at the root of the tree- … -identification information of parent tag data of tag data to which a positioning index is added-identification information of tag data to which a positioning index is added), the start position obtaining unit 402 may determine the position information of any state-adjusted tag data according to the positioning index of any state-adjusted tag data, for example, the start position obtaining unit 402 may determine the position information by performing symbol division on the positioning index by a split method.

In this case, the start tag determination unit 403 may determine the start tag data of the current rendering in the tree structure based on any state-adjusted tag data. Specifically, first, the start tag determination unit 403 may acquire state information indicating whether any of the state-adjusted tag data is expanded or hidden. Then, the starting tag determining unit 403 may determine that the first sub-tag data of the tag data after any state adjustment in the tree structure is the starting tag data of the current rendering under the condition that the tag data after any state adjustment is in the expanded state; the start tag determining unit 403 may determine, when the tag data after any state adjustment is in a hidden state, parent tag data of the tag data after any state adjustment in the tree structure, and determine, in all child tag data of the parent tag data in the tree structure, that the next child tag data of the tag data after any state adjustment is the start tag data of the current rendering.

Referring back to fig. 4, the tag obtaining unit 404 may obtain a preset number of tag data from the plurality of tag data based on the initial tag data and the tree structure of the current rendering. Here, the tag obtaining unit 404 may obtain a preset number of tag data one by one backward in the plurality of tag data in the tree structure based on the starting tag data rendered this time, and in the process of obtaining one by one, it may determine that each sub-tag data thereof cannot be obtained in consideration of the state information of each obtained tag data and the hierarchical information thereof in the tree structure. The preset number may be determined according to the height of the current screen before the current screen is rendered for the first time.

According to an exemplary embodiment of the disclosure, the screen rendering apparatus 400 further includes a flattening processing unit, and the flattening processing unit may perform flattening processing on the rendering data to obtain the flattened rendering data, where the start tag determining unit 403 and the tag obtaining unit 404 are executed after the flattening processing unit is executed. It should be noted that, in the rendering data in the exemplary embodiment of the present disclosure, the plurality of tag data are in a tree structure, so that the rendering data is nested in multiple layers, and the flattening process may refer to converting and tiling the nested multiple layers of rendering data into rendering data of only one layer. Here, first, the flattening processing unit may determine tag data located at a tree root of the tree structure; then, the flattening processing unit can determine each label data pair with a parent-child relationship in the plurality of label data; next, the flattening processing unit may determine rendering content data corresponding to each of the plurality of tag data; finally, the flattening processing unit may obtain the flattened rendering data based on the tag data located at the tree root of the tree structure, each tag data pair having a parent-child relationship in the plurality of tag data, and the rendering content data corresponding to each tag data in the plurality of tag data. It should be noted here that the description sequence of the execution steps of the above-mentioned flattening processing unit for determining the tag data at the root of the tree structure, determining each pair of tag data having a parent-child relationship in the plurality of tag data, and determining the rendering content data corresponding to each tag data in the plurality of tag data is merely illustrative, and the sequence of the three determination steps executed by the flattening processing unit may be adaptively adjusted. For example, but not limited to, the flattening processing unit may use, as the flattened rendering data, the tag data located at the root of the tree structure, the pair of tag data in the plurality of tag data each having a parent-child relationship, and the rendering content data corresponding to each of the plurality of tag data.

For example, but not limiting of, the flattened processed rendering data may be represented as:

the screen rendering unit 405 may render the current screen by using rendering content data corresponding to each of the preset number of tag data. Exemplary embodiments of the present disclosure may implement on-demand loading by rendering a current screen using rendering content data corresponding to each of a preset number of tag data.

According to an exemplary embodiment of the present disclosure, the screen rendering apparatus 400 further includes a saving unit that may record all rendered content data that have been rendered into a content information set (dataList), and in a case where a user pulls up a scroll bar of a rendered page as described in the above embodiments, may acquire corresponding rendered content data from the content information set according to a pulling position to render on a current screen.

Referring to fig. 5, the electronic device 500 includes at least one memory 501 and at least one processor 502, the at least one memory 501 having stored therein a set of computer-executable instructions that, when executed by the at least one processor 502, perform a screen rendering method according to the present disclosure.

By way of example, the electronic device 500 may be a PC computer, tablet device, personal digital assistant, smartphone, or other device capable of executing the set of instructions described above. Here, the electronic device 500 need not be a single electronic device, but can be any collection of devices or circuits that can execute the above instructions (or sets of instructions) individually or in combination. The electronic device 500 may also be part of an integrated control system or system manager, or may be configured as a portable electronic device that interfaces with local or remote (e.g., via wireless transmission).

In the electronic device 500, the processor 502 may include a Central Processing Unit (CPU), a Graphics Processing Unit (GPU), a programmable logic device, a special-purpose processor system, a microcontroller, or a microprocessor. By way of example, and not limitation, processors may also include analog processors, digital processors, microprocessors, multi-core processors, processor arrays, network processors, and the like.

The processor 502 may execute instructions or code stored in the memory 501, wherein the memory 501 may also store data. The instructions and data may also be transmitted or received over a network via the network interface device, which may employ any known transmission protocol.

The memory 501 may be integrated with the processor 502, for example, by having RAM or flash memory disposed within an integrated circuit microprocessor or the like. Further, memory 501 may comprise a stand-alone device, such as an external disk drive, storage array, or any other storage device usable by a database system. The memory 501 and the processor 502 may be operatively coupled or may communicate with each other, e.g., through I/O ports, network connections, etc., such that the processor 502 is able to read files stored in the memory.

In addition, the electronic device 500 may also include a video display (such as a liquid crystal display) and a user interaction interface (such as a keyboard, mouse, touch input device, etc.). All components of the electronic device 500 may be connected to each other via a bus and/or a network.

According to an exemplary embodiment of the present disclosure, there may also be provided a computer-readable storage medium storing instructions, which when executed by at least one processor, cause the at least one processor to perform a screen rendering method according to the present disclosure. Examples of the computer-readable storage medium herein include: read-only memory (ROM), random-access programmable read-only memory (PROM), electrically erasable programmable read-only memory (EEPROM), random-access memory (RAM), dynamic random-access memory (DRAM), static random-access memory (SRAM), flash memory, non-volatile memory, CD-ROM, CD-R, CD + R, CD-RW, CD + RW, DVD-ROM, DVD-R, DVD + R, DVD-RW, DVD + RW, DVD-RAM, BD-ROM, BD-R, BD-R LTH, BD-RE, Blu-ray or compact disc memory, Hard Disk Drive (HDD), solid-state drive (SSD), card-type memory (such as a multimedia card, a Secure Digital (SD) card or a extreme digital (XD) card), magnetic tape, a floppy disk, a magneto-optical data storage device, an optical data storage device, a hard disk, a magnetic tape, a magneto-optical data storage device, a hard disk, a magnetic tape, a magnetic data storage device, a magnetic tape, a magnetic data storage device, a magnetic tape, a magnetic data storage device, a magnetic tape, a magnetic data storage device, a magnetic tape, a magnetic data storage device, A solid state disk, and any other device configured to store and provide a computer program and any associated data, data files, and data structures to a processor or computer in a non-transitory manner such that the processor or computer can execute the computer program. The computer program in the computer-readable storage medium described above can be run in an environment deployed in a computer device, such as a client, a host, a proxy appliance, a server, or the like, and further, in one example, the computer program and any associated data, data files, and data structures are distributed across networked computer systems such that the computer program and any associated data, data files, and data structures are stored, accessed, and executed in a distributed fashion by one or more processors or computers.

According to an exemplary embodiment of the present disclosure, there may also be provided a computer program product in which instructions are executable by a processor of a computer device to perform a screen rendering method according to the present disclosure.

In addition, according to the screen rendering method, the screen rendering device, the electronic equipment and the storage medium, the rendering data can be subjected to flattening processing, the data structure of the rendering data transmitted by the server is optimized, the complexity of a tree-shaped nested recursive structure is reduced, the size of the rendering data is reduced, the acquisition efficiency of the preset number of label data is improved, and the smoothness of operation is ensured.

In addition, according to the screen rendering method, the screen rendering device, the electronic device and the storage medium, a positioning index can be added to the tag data corresponding to each rendered content data in all rendered content data currently, the initial position information of the rendering can be determined quickly, and the acquisition efficiency of the tag data with the preset number is improved.

Other embodiments of the disclosure will be apparent to those skilled in the art from consideration of the specification and practice of the invention disclosed herein. This application is intended to cover any variations, uses, or adaptations of the disclosure following, in general, the principles of the disclosure and including such departures from the present disclosure as come within known or customary practice within the art to which the disclosure pertains. It is intended that the specification and examples be considered as exemplary only, with a true scope and spirit of the disclosure being indicated by the following claims.

It will be understood that the present disclosure is not limited to the precise arrangements described above and shown in the drawings and that various modifications and changes may be made without departing from the scope thereof. The scope of the present disclosure is limited only by the appended claims.

Claims

1. A screen rendering method, comprising:

receiving rendering data from a server, wherein the rendering data comprises a plurality of tag data and rendering content data corresponding to each tag data, and the tag data are in a tree structure;

in response to receiving an instruction of rendering a current screen, acquiring initial position information for the current rendering from position record information, wherein the position record information records initial position information for each rendering, and the initial position information for each rendering indicates information for determining the position of initial tag data for starting execution of each rendering in the tree structure;

determining initial tag data of the current rendering based on the initial position information for the current rendering;

acquiring a preset number of label data from the plurality of label data based on the initial label data rendered this time and the tree structure;

and rendering the current screen by using rendering content data corresponding to each tag data in the preset number of tag data.

2. The screen rendering method of claim 1, wherein in case of rendering the current screen for the first time, the start position information for the current rendering is predefined start position information,

the predefined initial position information is used to indicate that the initial tag data of the current rendering is the tag data located at the root of the tree structure.

3. The screen rendering method of claim 1, wherein in a case where the current screen is rendered for a non-first time, the start position information for the current rendering is position information of last rendered end tag data, wherein the last rendering is performed until the last rendered end tag data among the plurality of tag data;

wherein, the determining the initial tag data of the current rendering based on the initial position information for the current rendering includes:

and in the tree structure, determining the initial tag data of the current rendering according to the finishing tag data of the previous rendering.

4. The screen rendering method of claim 3, wherein the determining the start tag data of the current rendering according to the end tag data of the previous rendering in the tree structure comprises:

acquiring state information for indicating that the last rendered end tag data is expanded or hidden, wherein the last rendered end tag data is sub tag data of which the expanded state represents the last rendered end tag data and can be acquired into a preset number of tag data required by the current rendering, and the last rendered end tag data is sub tag data of which the hidden state represents the last rendered end tag data and cannot be acquired into the preset number of tag data required by the current rendering;

under the condition that the last rendered ending tag data is in an expanded state, determining that the first sub-tag data of the last rendered ending tag data in the tree structure is the starting tag data of the current rendering;

and under the condition that the last rendered ending tag data is in a hidden state, determining parent tag data of the last rendered ending tag data in the tree structure, and determining that the next child tag data of the last rendered ending tag data is the starting tag data of the current rendering in all child tag data of the parent tag data of the last rendered ending tag data in the tree structure.

5. The screen rendering method of claim 1, wherein in a case where the current screen is rendered based on any state-adjusted tag data, the start position information for the current rendering is position information of the any state-adjusted tag data;

determining the initial tag data of the current rendering in the tree structure based on the tag data after any state adjustment;

rendering content data corresponding to the tag data after any state adjustment is rendered on the current screen, where the tag data after any state adjustment is any tag data after being adjusted from an expanded state to a hidden state, or any tag data after being adjusted from a hidden state to an expanded state, the tag data after any state adjustment is that sub-tag data of the tag data after any state adjustment represents that the tag data after any state adjustment can be acquired into a preset number of tag data required by this rendering, and the tag data after any state adjustment represents that the sub-tag data of the tag data after any state adjustment represents that the tag data after any state adjustment cannot be acquired into the preset number of tag data required by this rendering.

6. The screen rendering method of claim 5, wherein the determining the initial tag data of the current rendering in the tree structure based on the tag data adjusted by any one of the states comprises:

acquiring state information for indicating whether the label data after any state adjustment is unfolded or hidden;

under the condition that the tag data after any state adjustment is in an expansion state, determining that the first sub-tag data of the tag data after any state adjustment in the tree structure is the initial tag data of the current rendering;

and under the condition that the tag data after any state adjustment is in a hidden state, determining parent tag data of the tag data after any state adjustment in the tree structure, and determining that the next child tag data of the tag data after any state adjustment is the initial tag data of the current rendering in all child tag data of the parent tag data in the tree structure.

7. A screen rendering apparatus, comprising:

a data receiving unit configured to: receiving rendering data from a server, wherein the rendering data comprises a plurality of tag data and rendering content data corresponding to each tag data, and the tag data are in a tree structure;

a start position acquisition unit configured to: in response to receiving an instruction of rendering a current screen, acquiring initial position information for the current rendering from position record information, wherein the position record information records initial position information for each rendering, and the initial position information for each rendering indicates information for determining the position of initial tag data for starting execution of each rendering in the tree structure;

a start tag determination unit configured to: determining initial tag data of the current rendering based on the initial position information for the current rendering;

a tag acquisition unit configured to: acquiring a preset number of label data from the plurality of label data based on the initial label data rendered this time and the tree structure;

a screen rendering unit configured to: and rendering the current screen by using the rendering content data corresponding to each tag data in the preset number of tag data.

8. An electronic device, comprising:

at least one processor;

at least one memory storing computer-executable instructions,

wherein the computer-executable instructions, when executed by the at least one processor, cause the at least one processor to perform the screen rendering method of any of claims 1 to 6.

9. A computer-readable storage medium storing instructions that, when executed by at least one processor, cause the at least one processor to perform the screen rendering method of any of claims 1 to 6.

10. A computer program product comprising computer instructions, wherein the computer instructions, when executed by at least one processor, implement the screen rendering method of any of claims 1 to 6.