CN114647476A

CN114647476A - Page rendering method, device, equipment, storage medium and program

Info

Publication number: CN114647476A
Application number: CN202210335756.6A
Authority: CN
Inventors: 苗雨乔; 李明路
Original assignee: Beijing Baidu Netcom Science and Technology Co Ltd
Current assignee: Beijing Baidu Netcom Science and Technology Co Ltd
Priority date: 2022-03-31
Filing date: 2022-03-31
Publication date: 2022-06-21

Abstract

The disclosure provides a page rendering method, a page rendering device, page rendering equipment, a storage medium and a page rendering program, relates to the technical field of computers, and particularly relates to the technical field of application program processing and page display. The specific implementation scheme is as follows: acquiring unit information of a plurality of User Interface (UI) units in a first page, wherein the unit information comprises a layer where the UI units are located and display positions of the UI units; determining unoccluded areas of the UI units according to unit information of the UI units; and determining primitive information of a plurality of primitives in the unoccluded areas of the UI units, and drawing the first page according to the primitive information of the primitives. The layers, UI units and primitives in the page are processed, so that the page can be rendered, a browser does not need to be embedded in an application program, and the page rendering efficiency is improved.

Description

Page rendering method, device, equipment, storage medium and program

Technical Field

The present disclosure relates to the field of computer technologies, and in particular, to an application processing technology and a page display technology, and in particular, to a page rendering method, apparatus, device, storage medium, and program.

Background

Currently, applications can be applied to a variety of platforms, such as android platforms, IOS platforms, web platforms, desktop platforms, and the like.

Because User Interfaces (UIs) in different platforms are rendered in different manners, in order to enable the same application program to be applied to different platforms, a browser is usually embedded in the application program, and a UI page is rendered by the browser in a manner of combining hypertext Markup Language (HTML), Cascading Style Sheets (CSSs), and Javascript. However, rendering efficiency of UI pages is low due to low operating efficiency of the browser.

Disclosure of Invention

The disclosure provides a page rendering method, device, equipment and storage medium for improving page rendering efficiency.

According to a first aspect of the present disclosure, there is provided a page rendering method, including:

acquiring unit information of a plurality of User Interface (UI) units in a first page, wherein the unit information comprises a layer where the UI units are located and display positions of the UI units;

determining unoccluded areas of the UI units according to unit information of the UI units;

and determining primitive information of a plurality of primitives in the unoccluded areas of the UI units, and drawing the first page according to the primitive information of the primitives.

According to a second aspect of the present disclosure, there is provided a page rendering apparatus including:

the system comprises an acquisition module, a display module and a display module, wherein the acquisition module is used for acquiring unit information of a plurality of User Interface (UI) units in a first page, and the unit information comprises a layer where the UI units are located and display positions of the UI units;

the first determining module is used for determining the unoccluded areas of the UI units according to the unit information of the UI units;

a second determining module for determining primitive information for a plurality of primitives in unoccluded regions of the plurality of UI units;

and the drawing module is used for drawing the first page according to the primitive information of the primitives.

According to a fourth aspect of the present disclosure, there is provided an electronic device comprising:

at least one processor; and

a memory communicatively coupled to the at least one processor; wherein the content of the first and second substances,

the memory stores instructions executable by the at least one processor to enable the at least one processor to perform the method of any one of the first aspects.

According to a third aspect of the present disclosure, there is provided an electronic device comprising:

at least one processor; and

the memory stores instructions executable by the at least one processor to enable the at least one processor to perform the method of the first aspect.

According to a fourth aspect of the present disclosure, there is provided a non-transitory computer readable storage medium having stored thereon computer instructions for causing the computer to perform the method according to the first aspect.

According to a fifth aspect of the present disclosure, there is provided a computer program product comprising: a computer program, stored in a readable storage medium, from which at least one processor of an electronic device can read the computer program, execution of the computer program by the at least one processor causing the electronic device to perform the method of the first aspect.

It should be understood that the statements in this section do not necessarily identify key or critical features of the embodiments of the present disclosure, nor do they limit the scope of the present disclosure. Other features of the present disclosure will become apparent from the following description.

Drawings

The drawings are included to provide a better understanding of the present solution and are not to be construed as limiting the present disclosure. Wherein:

FIG. 1 is a schematic diagram of a UI page provided by an embodiment of the disclosure;

fig. 2 is a schematic flowchart of a page rendering method according to an embodiment of the present disclosure;

FIG. 3 is an occlusion diagram of a UI element provided by an embodiment of the disclosure;

FIG. 4 is a flowchart illustrating a method for determining an unobstructed area according to an embodiment of the present disclosure;

fig. 5 is a schematic flowchart of another page rendering method according to the embodiment of the present disclosure;

FIG. 6 is a schematic diagram of a UI element provided by an embodiment of the disclosure;

fig. 7 is a schematic structural diagram of a page rendering apparatus according to an embodiment of the present disclosure;

fig. 8 is a schematic structural diagram of another page rendering apparatus according to an embodiment of the present disclosure;

FIG. 9 illustrates a schematic block diagram of an example electronic device 900 that can be used to implement embodiments of the present disclosure.

Detailed Description

Exemplary embodiments of the present disclosure are described below with reference to the accompanying drawings, in which various details of the embodiments of the disclosure are included to assist understanding, and which are to be considered as merely exemplary. Accordingly, those of ordinary skill in the art will recognize that various changes and modifications of the embodiments described herein can be made without departing from the scope and spirit of the present disclosure. Also, descriptions of well-known functions and constructions are omitted in the following description for clarity and conciseness.

The disclosure provides a page rendering method, device, equipment, storage medium and program, which are applied to an application program processing technology and a page display technology in the technical field of computers and can be applied to a page rendering scene to improve page rendering efficiency.

The disclosed embodiments relate to rendering of UI pages, where a UI page typically includes multiple layers, and each layer includes at least one UI element (which may also be referred to as UIBox). For ease of understanding, the structure of the UI page will be described below with reference to fig. 1.

Fig. 1 is a schematic diagram of a UI page provided by an embodiment of the present disclosure. Referring to fig. 1, the UI interface includes a plurality of 3 layers, where layer 1 is located at the bottommost layer, layer 2 is located on layer 1, and layer 3 is located on layer 2. Wherein, the layer 2 further includes a search box, an icon and a navigation bar, which are not shown in fig. 1, located above the layer 1.

The UI element is a two-dimensional rectangular area. Each layer comprises at least one UI unit. For example, the UI elements in layer 1 include a rectangular area occupied by layer 1. The UI unit in layer 2 comprises: the system comprises a rectangular area occupied by a search box, a rectangular area occupied by an electric appliance icon and characters, a rectangular area occupied by a clothing icon and characters, a rectangular area occupied by a payment icon and characters, a rectangular area occupied by a coupon icon and characters, a rectangular area A and a rectangular area occupied by a navigation bar at the lowest edge of a page. The UI elements in layer 3 include rectangular areas B and C.

And occlusion relations exist among UI units in different layers. For example, the UI elements in layer 2 occlude a portion of the UI elements in layer 1. The UI elements in layer 3 (rectangular area B and rectangular area C) occlude a portion of the UI elements in layer 2 (rectangular area a).

In the related art, a browser is usually embedded in an application program, and the UI page is rendered by the browser in a manner of combining HTML, CSS, and Javascript. However, rendering of UI pages is inefficient due to inefficient operation of the browser.

According to the page rendering method, when the first page needs to be rendered, the first page is subjected to layer splitting to obtain the UI units in all layers, the areas which are not shielded in all the UI units are determined, then a plurality of primitives are split in all the areas which are not shielded respectively, and the first page is drawn according to the primitive information of all the primitives. In the process, the rendering of the page can be realized only by processing the layer, the UI unit and the graphics primitive in the page, a browser does not need to be embedded into an application program, and the page rendering efficiency is improved.

The technical solution of the present disclosure is explained in detail below with specific examples. The following several specific embodiments may be combined with each other, and details of the same or similar concepts or processes may not be repeated in some embodiments.

Fig. 2 is a schematic flowchart of a page rendering method according to an embodiment of the present disclosure. Referring to fig. 2, the method may include:

s201, unit information of a plurality of UI units in the first page is acquired.

The execution subject of the embodiment of the present disclosure may be an electronic device, and may also be a page rendering device in the electronic device. The page rendering device may be implemented by software, or may be implemented by a combination of software and hardware.

The first page is a page to be rendered. For example, when a user inputs an operation in the electronic device to request to display the first page, the scheme shown in the embodiment of fig. 2 may be executed to render the first page.

The UI unit refers to a rectangular area in a page, and the rectangular area may be a right-angled rectangular area or a rounded rectangular area. For example, referring to fig. 1, the UI unit corresponding to the electrical icon and the text may be a rectangular area, and the rectangular area a in the layer 2 may be a rectangular area with rounded corners.

The unit information comprises a layer where the UI unit is located and a display position of the UI unit. The display position may be represented by coordinates of the UI unit in the page. Since the UI unit is a rectangular area, the display position of the UI unit can be represented by the upper-left and lower-right coordinates of the UI unit, or can be represented by the upper-right and lower-left coordinates of the UI unit.

The plurality of UI units refer to all UI units included in the first page. Traversal search can be performed in the source code of the first page to obtain the UI unit in each layer, so as to obtain multiple UI units in the first page.

S202, determining the non-shielded areas of the UI units according to the unit information of the UI units.

The unobstructed area of the UI element in each layer can be determined separately. For example, the unoccluded area of the UI unit in the top-most layer may be determined first, then the unoccluded area of the UI unit in the next top-most layer may be determined, and so on until the unoccluded area of the UI unit in the bottom-most layer is determined. Or, the unoccluded area of the UI unit in the layer at the bottom may be determined first, then the unoccluded area of the UI unit in the layer at the second bottom may be determined, and so on, until the area of the UI unit in the layer at the top is determined to be unoccluded.

For the topmost layer, each UI unit in the topmost layer does not have an occluded area, that is, all areas in the topmost UI unit are unoccluded areas.

For a first layer of a non-top layer, when determining an unobstructed area of a first UI unit of the first layer, the unobstructed area of the first UI unit may be determined according to the first layer, a display position of the first UI unit, and a display position of each UI unit in at least one second layer, where the second layer is located on the first layer. For example, suppose that the first page includes 4 layers, which are layer 1, layer 2, layer 3, and layer 4 in sequence from bottom to top. When determining the non-occluded area of the UI unit 1 in the layer 2, the non-occluded area of the UI unit 1 may be determined according to the display position of the UI unit 1 in the layer 2 and the display positions of the UI units in the layers 3 and 4.

In the above process, when determining the non-occluded area of the UI unit in a certain layer, according to whether the layer is the top layer, the non-occluded area of the UI unit in the layer can be determined quickly, so that the efficiency of determining the non-occluded area is high.

Next, the unshielded area of the UI unit will be described with reference to fig. 3.

Fig. 3 is an occlusion diagram of a UI unit provided in the embodiment of the present disclosure. Referring to fig. 3, the image layer includes an image layer 1 and an image layer 2, where the image layer 2 is located above the image layer 1. The layer 1 comprises a UI unit A and a UI unit B, and the layer 2 comprises a UI unit C. The UI unit C is located above the UI unit a and the UI unit B. Referring to fig. 3, the unoccluded area in the UI unit a is an area other than the area 1 in the UI unit a. The unobstructed area in UI element B is the other area in UI element B than area 2.

S203, determining primitive information of a plurality of primitives in the unoccluded areas of the UI units, and drawing the first page according to the primitive information of the primitives.

One or more primitives are included in the UI unit. Primitives are basic elements in a page, e.g., primitives may include line segments, polygons, text, pictures, and so on.

The primitive information is used to describe the primitive, that is, the corresponding primitive can be drawn according to the primitive information. When the primitives are different, the primitive information of the primitives is also different.

For example, the primitive information of the line segment includes at least one of: a start point position, an end point position, a line segment width and a line segment color.

For example, the primitive information of a rectangle includes at least one of: starting point position, ending point position, frame colour, frame width, internal colour and fillet angle.

For example, the primitive information of the polygon includes at least one of: vertex positions of the plurality of vertices, border color, border width, interior color.

For example, the primitive information of the text includes at least one of: text content, font size, color, character position.

For example, the primitive information of the picture includes at least one of: picture, picture position.

After determining that the primitive information of the plurality of primitives is obtained, the primitive information may be sent to a Graphics Processing Unit (GPU) so that the GPU draws a first page according to the primitive information, and after the first page is drawn, the first page may be displayed.

According to the page rendering method provided by the embodiment of the disclosure, when the first page needs to be rendered, unit information of each UI unit in the first page is acquired, an unobstructed area in each UI unit is determined according to the unit information of each UI unit, a plurality of primitives are respectively split in each unobstructed area, and the first page is drawn according to the primitive information of each primitive. In the process, the rendering of the page can be realized only by processing the layer, the UI unit and the graphics primitives in the page, a browser does not need to be embedded in an application program, and the page rendering efficiency is improved.

On the basis of any of the above embodiments, in the process of rendering the first page, it is necessary to determine an unobstructed area of each UI unit in the first page, and the process of determining the unobstructed area of each UI unit is the same.

Fig. 4 is a schematic flowchart of a method for determining an unobstructed area according to an embodiment of the present disclosure. Referring to fig. 4, the method may include:

s401, determining a first layer where the first UI unit is located.

S402, judging whether the first layer is the top layer.

If yes, go to S403.

If not, go to S404.

The layer identifier and the total layer number of the first layer can be obtained, and whether the first layer is the top layer is judged according to the identifier and the total layer number of the first layer.

For example, if the layer identifier of the bottommost layer is the smallest and the layer identifier of the topmost layer is the largest, it may be determined whether the first layer identifier is the same as the total number of layers, if so, it is determined that the first layer is the top layer, and if not, it is determined that the first layer is not the top layer.

And S403, determining all areas of the first UI unit as the non-shielded areas of the first UI unit.

If the first layer is the topmost layer, no UI unit is located on the first layer, that is, no UI unit is located on the first UI unit, and then the entire area of the first UI unit may be determined as the non-occluded area of the first UI unit.

S404, judging whether the display position of the UI unit in the second layer and the display position of the first UI unit have an overlapping area or not according to the display position of the first UI unit and the display position of each UI unit in at least one second layer.

Wherein the second layer is located above the first layer.

If yes, go to S405.

If not, go to step S403.

If the first layer is a non-top layer, there may be a UI unit located on the first UI unit, or there may be no UI unit located on the first UI unit, so that an unobstructed area of the first UI unit needs to be determined according to a display position of the first UI unit and a display position of each UI unit in the second layer.

The display positions of the UI units in the second layer may be obtained, and if there is an overlapping area between the display position where no UI unit exists in the second layer and the display position of the first UI unit, the entire area of the first UI unit may be determined as an unobstructed area of the first UI unit. If there is an overlapping area between the display position of the UI unit and the display position of the first UI unit in the second layer, it is necessary to further determine an unobstructed area of the first UI unit according to S405-S406.

In the above process, when it is determined that there is an overlapping area between the display position where the UI unit does not exist in the second layer and the display position of the first UI unit, the whole area of the first UI unit in the non-occluded area of the first UI unit may be directly determined, so that the efficiency of determining the non-occluded area of the first UI unit is higher.

S405, determining at least one second UI unit in at least one second layer.

And the display position of the second UI unit and the display position of the first UI unit have an overlapped area.

And S406, determining an unobstructed area of the first UI unit according to the display position of the first UI unit and the display position of the at least one second UI unit.

Determining at least one occlusion region in the first UI unit that is occluded by the at least one second UI unit according to the display position of the first UI unit and the display position of the at least one second UI unit; and determining other areas except the at least one occlusion area in the first UI unit as the non-occluded areas of the first UI unit.

In the embodiment shown in fig. 4, when determining an unobstructed area of a first UI unit in a first layer, it may be determined whether the first layer is a top layer, and when the first layer is the top layer, it may be directly determined that the unobstructed area of the first UI unit is all areas of the first UI unit, so that the efficiency of determining the unobstructed area of the first UI unit is higher. When the first layer is a non-top layer, whether a UI unit and a first UI unit overlap in a second layer located above the first layer may be determined again, if not, the non-occluded area of the first UI unit may be directly determined to be all the area of the first UI unit, and if yes, the non-occluded area of the first UI unit may be further determined. In the above process, the unobstructed area of the first UI unit is determined through multiple stages, so that the efficiency of determining the unobstructed area of the first UI unit is high.

On the basis of any one of the above embodiments, the page rendering method shown in the embodiment of the present disclosure is further described in detail below with reference to fig. 5.

Fig. 5 is a schematic flowchart of another page rendering method according to the embodiment of the present disclosure. Referring to fig. 5, the method may include:

s501, unit information of a plurality of user interface UI units in the first page is obtained.

The unit information comprises a layer where the UI unit is located and the display position of the UI unit.

It should be noted that the execution process of S501 may refer to the execution process of S201, and is not described herein again.

S502, determining the non-shielded areas of the UI units according to the unit information of the UI units.

It should be noted that the execution process of S502 may refer to the execution process of S202, or refer to the execution process shown in the embodiment of fig. 4, and details are not described here again.

And S503, respectively carrying out primitive splitting processing on the unoccluded areas of the UI units to obtain a plurality of primitives.

Next, the process of splitting the primitive will be described with reference to fig. 6.

Fig. 6 is a schematic diagram of a UI unit provided in an embodiment of the present disclosure. Referring to fig. 6, the UI unit 1 includes 5 primitives, i.e., primitive 1, primitive 2, primitive 3, primitive 4, and primitive 5. The graphic element 1 is a text 'special price second killing 9.9', the graphic element 2 is a five-pointed star, the graphic element 3 is a horizontal line, the graphic element 4 is a bear picture, and the graphic element 5 is a rectangular box.

Assuming that the lower right corner of the UI element 1 is occluded by the UI elements 2 of the other layers in the actual UI page, the unoccluded area of the UI element 1 is an area other than the occluded area of the lower right corner. Included in UI element 1 is an occluded area is primitive 1, primitive 2, primitive 3, and primitive 4.

S504, aiming at any one primitive, generating primitive information of the primitive according to the type of the primitive.

If the type of the primitive is a line segment type, determining that the primitive information of the primitive comprises at least one of the following types: a start point position, an end point position, a line segment width and a line segment color.

If the type of the primitive is a rectangular type, determining that the primitive information of the primitive comprises at least one of the following types: starting point position, ending point position, frame colour, frame width, internal colour and fillet angle. The starting point position can be the position of the upper left corner of the rectangle, and the ending point position can be the position of the lower right corner of the rectangle; alternatively, the starting point position may be the upper right corner position of the rectangle, and the ending point position may be the lower left corner position of the rectangle.

If the type of the primitive is a polygon type, determining that the primitive information of the primitive comprises at least one of the following types: vertex positions of the plurality of vertices, border color, border width, interior color.

If the type of the primitive is a text type, determining that the primitive information of the primitive comprises at least one of the following types: text content, font size, color, character position.

If the type of the primitive is a picture type, determining that the primitive information of the primitive comprises at least one of the following types: picture, picture position.

And S505, generating drawing instructions corresponding to the primitives according to the primitive information of the primitives.

Drawing instructions corresponding to the primitives can be generated according to the sequence of the layers where the primitives are located from bottom to top.

For example, if the UI interface includes 3 layers, which are layer 1, layer 2, and layer 3, and the layer 1 is located at the bottom layer and the layer 3 is located at the top layer, a drawing instruction corresponding to a primitive in the layer 1 may be generated first, a drawing instruction corresponding to a primitive in the layer 2 may be generated, and a drawing instruction corresponding to a primitive in the layer 3 may be generated.

S506, sending drawing instructions corresponding to the multiple graphics primitives to the GPU, so that the GPU draws the first page according to the drawing instructions.

Drawing instructions corresponding to the multiple primitives can be sent to the GPU respectively according to the sequence of the layers where the multiple primitives are located from bottom to top.

For example, if the UI interface includes 3 layers, which are layer 1, layer 2, and layer 3, and the layer 1 is located at the bottom layer and the layer 3 is located at the top layer, a drawing instruction corresponding to a primitive in the layer 1 may be sent to the GPU, a drawing instruction corresponding to a primitive in the layer 2 may be sent to the GPU, and then a drawing instruction corresponding to a primitive in the layer 3 may be sent to the GPU.

And S507, displaying the first page.

In the embodiment shown in fig. 5, when the first page needs to be rendered, unit information of each UI unit in the first page is acquired, an unobstructed area in each UI unit is determined according to the unit information of each UI unit, a plurality of primitives are split in each unobstructed area respectively, the first page is drawn according to the primitive information of each primitive, and the first page is displayed. In the process, the rendering of the page can be realized only by processing the layer, the UI unit and the graphics primitives in the page, a browser does not need to be embedded in an application program, and the page rendering efficiency is improved.

Fig. 7 is a schematic structural diagram of a page rendering apparatus according to an embodiment of the present disclosure. Referring to fig. 7, the page rendering apparatus 700 may include:

an obtaining module 701, configured to obtain unit information of multiple UI units in a first page, where the unit information includes a layer where the UI unit is located and a display position of the UI unit;

a first determining module 702, configured to determine, according to unit information of multiple UI units, an unobstructed area of the multiple UI units;

a second determining module 703, configured to determine primitive information of multiple primitives in an unobstructed area of the multiple UI units;

and a drawing module 704, configured to draw the first page according to the primitive information of the multiple primitives.

The page rendering apparatus 700 provided in the embodiment of the present disclosure may execute the technical solutions shown in the above method embodiments, and the implementation principles and beneficial effects thereof are similar and will not be described herein again.

In some possible implementations, the first determining module 702 includes:

the first determining unit is used for determining a first layer where an arbitrary first UI unit is located;

a second determining module, configured to determine, when the first layer is a top layer, all areas of the first UI unit as an unobstructed area of the first UI unit;

and a third determining unit, configured to determine, when the first layer is a non-top layer, an unobstructed area of the first UI unit according to the first layer, the display position of the first UI unit, and the display position of each UI unit in at least one second layer, where the second layer is located on the first layer.

In some possible implementations, the third determining unit includes:

the judging subunit is configured to judge, according to the display position of the first UI unit and the display positions of the UI units in the at least one second layer, whether there is an overlapping area between the display position of the UI unit and the display position of the first UI unit in the second layer;

the first determining subunit is configured to determine, when the determining subunit determines that an overlapping area exists between the display position of the UI unit and the display position of the first UI unit in the second layer, at least one second UI unit in the at least one second layer, and determine, according to the display position of the first UI unit and the display position of the at least one second UI unit, an unobstructed area of the first UI unit, where an overlapping area exists between the display position of the second UI unit and the display position of the first UI unit;

and the second determining subunit is configured to determine, when the determining subunit determines that there is an overlapping area between the display position where the UI unit does not exist in the second layer and the display position of the first UI unit, all areas of the first UI unit as the non-occluded area of the first UI unit.

In some possible implementations, the first determining subunit is specifically configured to:

determining at least one occlusion region occluded by the at least one second UI unit in the first UI unit according to the display position of the first UI unit and the display position of the at least one second UI unit;

and determining other areas except the at least one occlusion area in the first UI unit as the non-occluded areas of the first UI unit.

In some possible implementations, the second determining module 703 includes:

the splitting unit is used for respectively carrying out primitive splitting processing on the uncovered areas of the UI units to obtain a plurality of primitives;

and the first generation unit is used for generating the primitive information of the primitive according to the type of the primitive aiming at any one primitive.

In some possible implementations, the first generating unit is specifically configured to:

if the type of the primitive is a line segment type, determining that the primitive information of the primitive comprises at least one of the following types: the starting point position, the end point position, the line segment width and the line segment color;

if the type of the primitive is a rectangular type, determining that the primitive information of the primitive comprises at least one of the following types: the starting point position, the ending point position, the frame color, the frame width, the internal color and the fillet angle;

if the type of the primitive is a polygon type, determining that the primitive information of the primitive comprises at least one of the following types: vertex positions of the plurality of vertices, border color, border width, interior color;

if the type of the primitive is a text type, determining that the primitive information of the primitive comprises at least one of the following types: text content, font size, color, character position;

In some possible implementations, the drawing module 704 includes:

the second generating unit is used for generating drawing instructions corresponding to the primitives according to the primitive information of the primitives;

and the sending unit is used for sending the drawing instructions corresponding to the plurality of primitives to the GPU so as to enable the GPU to draw the first page according to the drawing instructions.

In some possible implementation manners, the second generating unit is specifically configured to generate the drawing instructions corresponding to the multiple primitives, respectively, according to an order from bottom to top of a layer in which the multiple primitives are located;

the sending unit is specifically configured to send, to the GPU, the drawing instructions corresponding to the multiple primitives, respectively, according to an order from bottom to top of a layer in which the multiple primitives are located.

Fig. 8 is a schematic structural diagram of another page rendering apparatus according to an embodiment of the present disclosure. On the basis of the embodiment shown in fig. 7, referring to fig. 8, the page rendering apparatus 700 further includes a display module 705, where the display module 705 is configured to:

displaying the first page after the rendering module 704 renders the first page according to the primitive information of the plurality of primitives.

The present disclosure also provides an electronic device, a readable storage medium, and a computer program product according to embodiments of the present disclosure.

According to an embodiment of the present disclosure, the present disclosure also provides a computer program product comprising: a computer program, stored in a readable storage medium, from which at least one processor of the electronic device can read the computer program, the at least one processor executing the computer program causing the electronic device to perform the solution provided by any of the embodiments described above.

FIG. 9 illustrates a schematic block diagram of an example electronic device 900 that can be used to implement embodiments of the present disclosure. Electronic devices are intended to represent various forms of digital computers, such as laptops, desktops, workstations, personal digital assistants, servers, blade servers, mainframes, and other appropriate computers. The electronic device may also represent various forms of mobile devices, such as personal digital processing, cellular phones, smart phones, wearable devices, and other similar computing devices. The components shown herein, their connections and relationships, and their functions, are meant to be examples only, and are not intended to limit implementations of the disclosure described and/or claimed herein.

As shown in fig. 9, the apparatus 900 includes a computing unit 901, which can perform various appropriate actions and processes in accordance with a computer program stored in a Read Only Memory (ROM)902 or a computer program loaded from a storage unit 908 into a Random Access Memory (RAM) 903. In the RAM 903, various programs and data required for the operation of the device 900 can also be stored. The calculation unit 901, ROM 902, and RAM 903 are connected to each other via a bus 904. An input/output (I/O) interface 905 is also connected to bus 904.

A number of components in the device 900 are connected to the I/O interface 905, including: an input unit 906 such as a keyboard, a mouse, and the like; an output unit 907 such as various types of displays, speakers, and the like; a storage unit 908 such as a magnetic disk, optical disk, or the like; and a communication unit 909 such as a network card, a modem, a wireless communication transceiver, and the like. The communication unit 909 allows the device 900 to exchange information/data with other devices through a computer network such as the internet and/or various telecommunication networks.

The computing unit 901 may be a variety of general and/or special purpose processing components having processing and computing capabilities. Some examples of the computing unit 901 include, but are not limited to, a Central Processing Unit (CPU), a Graphics Processing Unit (GPU), various dedicated Artificial Intelligence (AI) computing chips, various computing units running machine learning model algorithms, a Digital Signal Processor (DSP), and any suitable processor, controller, microcontroller, and so forth. The computing unit 901 performs the respective methods and processes described above, such as a page rendering method. For example, in some embodiments, the page rendering method may be implemented as a computer software program tangibly embodied in a machine-readable medium, such as storage unit 908. In some embodiments, part or all of the computer program may be loaded and/or installed onto device 900 via ROM 902 and/or communications unit 909. When the computer program is loaded into RAM 903 and executed by computing unit 901, one or more steps of the page rendering method described above may be performed. Alternatively, in other embodiments, the computing unit 901 may be configured to perform the page rendering method by any other suitable means (e.g., by means of firmware).

Various implementations of the systems and techniques described here above may be implemented in digital electronic circuitry, integrated circuitry, Field Programmable Gate Arrays (FPGAs), Application Specific Integrated Circuits (ASICs), Application Specific Standard Products (ASSPs), system on a chip (SOCs), Complex Programmable Logic Devices (CPLDs), computer hardware, firmware, software, and/or combinations thereof. These various embodiments may include: implemented in one or more computer programs that are executable and/or interpretable on a programmable system including at least one programmable processor, which may be special or general purpose, receiving data and instructions from, and transmitting data and instructions to, a storage system, at least one input device, and at least one output device.

Program code for implementing the methods of the present disclosure may be written in any combination of one or more programming languages. These program codes may be provided to a processor or controller of a general purpose computer, special purpose computer, or other programmable data processing apparatus, such that the program codes, when executed by the processor or controller, cause the functions/operations specified in the flowchart and/or block diagram to be performed. The program code may execute entirely on the machine, partly on the machine, as a stand-alone software package partly on the machine and partly on a remote machine or entirely on the remote machine or server.

In the context of this disclosure, a machine-readable medium may be a tangible medium that can contain, or store a program for use by or in connection with an instruction execution system, apparatus, or device. The machine-readable medium may be a machine-readable signal medium or a machine-readable storage medium. A machine-readable medium may include, but is not limited to, an electronic, magnetic, optical, electromagnetic, infrared, or semiconductor system, apparatus, or device, or any suitable combination of the foregoing. More specific examples of a machine-readable storage medium would include an electrical connection based on one or more wires, a portable computer diskette, a hard disk, a Random Access Memory (RAM), a read-only memory (ROM), an erasable programmable read-only memory (EPROM or flash memory), an optical fiber, a portable compact disc read-only memory (CD-ROM), an optical storage device, a magnetic storage device, or any suitable combination of the foregoing.

To provide for interaction with a user, the systems and techniques described here can be implemented on a computer having: a display device (e.g., a CRT (cathode ray tube) or LCD (liquid crystal display) monitor) for displaying information to a user; and a keyboard and a pointing device (e.g., a mouse or a trackball) by which a user can provide input to the computer. Other kinds of devices may also be used to provide for interaction with a user; for example, feedback provided to the user can be any form of sensory feedback (e.g., visual feedback, auditory feedback, or tactile feedback); and input from the user can be received in any form, including acoustic, speech, or tactile input.

The systems and techniques described here can be implemented in a computing system that includes a back-end component (e.g., as a data server), or that includes a middleware component (e.g., an application server), or that includes a front-end component (e.g., a user computer having a graphical user interface or a web browser through which a user can interact with an implementation of the systems and techniques described here), or any combination of such back-end, middleware, or front-end components. The components of the system can be interconnected by any form or medium of digital data communication (e.g., a communication network). Examples of communication networks include: local Area Networks (LANs), Wide Area Networks (WANs), and the Internet.

The computer system may include clients and servers. A client and server are generally remote from each other and typically interact through a communication network. The relationship of client and server arises by virtue of computer programs running on the respective computers and having a client-server relationship to each other.

It should be understood that various forms of the flows shown above may be used, with steps reordered, added, or deleted. For example, the steps described in the present disclosure may be executed in parallel, sequentially, or in different orders, as long as the desired results of the technical solutions disclosed in the present disclosure can be achieved, and the present disclosure is not limited herein.

The above detailed description should not be construed as limiting the scope of the disclosure. It should be understood by those skilled in the art that various modifications, combinations, sub-combinations and substitutions may be made in accordance with design requirements and other factors. Any modification, equivalent replacement, and improvement made within the spirit and principle of the present disclosure should be included in the scope of protection of the present disclosure.

Claims

1. A page rendering method, comprising:

2. The method of claim 1, wherein for any first UI element; determining an unobstructed area of the first UI element according to element information of a plurality of UI elements, including:

determining a first layer where the first UI unit is located;

if the first layer is the top layer, determining all areas of the first UI unit as the areas which are not shielded of the first UI unit;

if the first layer is a non-top layer, determining an unobstructed area of the first UI unit according to the first layer, the display position of the first UI unit and the display position of each UI unit in at least one second layer, wherein the second layer is located on the first layer.

3. The method according to claim 2, wherein the determining, according to the first layer, the display position of the first UI element, and the display position of each UI element in at least one second layer, an unobstructed area of the first UI element comprises:

judging whether the display position of the UI unit in the second layer and the display position of the first UI unit have an overlapping area or not according to the display position of the first UI unit and the display positions of all UI units in the at least one second layer;

if yes, determining at least one second UI unit in the at least one second layer, and determining an unobstructed area of the first UI unit according to the display position of the first UI unit and the display position of the at least one second UI unit, wherein the display position of the second UI unit and the display position of the first UI unit have an overlapping area;

if not, determining all areas of the first UI unit as the non-shielded areas of the first UI unit.

4. The method of claim 3, wherein the determining an unobstructed area of the first UI element as a function of the display position of the first UI element and the display position of the at least one second UI element comprises:

determining at least one shielding area shielded by the at least one second UI unit in the first UI unit according to the display position of the first UI unit and the display position of the at least one second UI unit;

5. The method of any of claims 1-4, wherein said determining primitive information for a plurality of primitives in non-occluded regions of the plurality of UI units comprises:

respectively carrying out primitive splitting processing on the unoccluded areas of the UI units to obtain a plurality of primitives;

and aiming at any one primitive, generating primitive information of the primitive according to the type of the primitive.

6. The method of claim 5, wherein generating primitive information for the primitives in accordance with types of the primitives comprises:

if the type of the primitive is a line segment type, determining that the primitive information of the primitive comprises at least one of the following types: the starting point position, the ending point position, the line segment width and the line segment color;

if the type of the primitive is a polygon type, determining that the primitive information of the primitive comprises at least one of the following types: vertex positions, border colors, border widths, and interior colors of the plurality of vertices;

7. The method of any of claims 1-6, wherein said drawing the first page according to primitive information for the plurality of primitives comprises:

generating drawing instructions corresponding to the plurality of primitives according to the primitive information of the plurality of primitives;

and sending drawing instructions corresponding to the plurality of primitives to a GPU (graphics processing Unit), so that the GPU draws the first page according to the drawing instructions.

8. The method according to claim 7, wherein the generating drawing instructions corresponding to the plurality of primitives according to primitive information of the plurality of primitives includes:

generating drawing instructions corresponding to the plurality of primitives respectively according to the sequence of the layers in which the plurality of primitives are located from bottom to top;

the sending of the drawing instructions corresponding to the plurality of primitives to the GPU includes:

and sending drawing instructions corresponding to the plurality of primitives to the GPU respectively according to the sequence of the layers where the plurality of primitives are located from bottom to top.

9. The method according to any one of claims 1-8, wherein said rendering said first page according to primitive information for said plurality of primitives further comprises:

and displaying the first page.

10. A page rendering apparatus, comprising:

11. The apparatus of claim 10, wherein the first determining means comprises:

12. The apparatus of claim 11, wherein the third determining unit comprises:

the judging subunit is configured to judge whether an overlapping area exists between the display position of the UI unit in the second layer and the display position of the first UI unit according to the display position of the first UI unit and the display positions of the UI units in the at least one second layer;

13. The apparatus according to claim 12, wherein the first determining subunit is specifically configured to:

14. The apparatus of any of claims 10-13, wherein the second determining means comprises:

the splitting unit is used for respectively carrying out primitive splitting processing on the unoccluded areas of the UI units to obtain a plurality of primitives;

15. The apparatus of claim 14, wherein the first generating unit is specifically configured to:

16. The apparatus of any of claims 10-15, wherein the rendering module comprises:

and the sending unit is used for sending the drawing instructions corresponding to the plurality of primitives to the GPU so that the GPU draws the first page according to the drawing instructions.

17. The apparatus of claim 16, wherein,

the second generating unit is specifically configured to generate, according to an order from bottom to top of a layer where the plurality of primitives are located, drawing instructions corresponding to the plurality of primitives respectively;

18. The apparatus of any one of claims 10-17, wherein the apparatus further comprises a display module to:

and displaying the first page after the drawing module draws the first page according to the primitive information of the primitives.

19. An electronic device, comprising:

at least one processor; and

a memory communicatively coupled to the at least one processor; wherein, the first and the second end of the pipe are connected with each other,

the memory stores instructions executable by the at least one processor to enable the at least one processor to perform the method of any one of claims 1 to 9.

20. A non-transitory computer readable storage medium having stored thereon computer instructions for causing the computer to perform the method of any one of claims 1 to 9.

21. A computer program product comprising a computer program which, when executed by a processor, implements the method of any one of claims 1 to 9.