Graphic data rendering method and apparatus, and device, readable storage medium and product

By determining the exposure order and priority of graphic data in user interface rendering and performing frame rendering, the problem that user interface rendering in the prior art cannot reach the specified frame rate, achieving a more stable user interface display and a better user experience.

WO2025092870A1PCT designated stage expired Publication Date: 2025-05-08BEIJING ZITIAO NETWORK TECH CO LTD
View PDF 3 Cites 0 Cited by

Patent Information

Application Number
PCT/CN2024/128727
Authority / Receiving Office
WO · WO
Patent Type
Applications
Current Assignee / Owner
Priority Date
2023-11-01
Filing Date
2024-10-31
Publication Date
2025-05-08

AI Technical Summary

Technical Problem

The existing user interface rendering method cannot complete the drawing of graphic data at the specified frame rate, resulting in frame drops in the display of the graphic interface, affecting the user's browsing experience.

Method used

By obtaining multiple graphic data in the user interface to be rendered, determining their exposure order, and determining priority information according to the exposure order, and performing frame rendering operations to ensure that the browser does not overload the drawing of the graphics within a specified time.

Benefits of technology

It effectively avoids the problem of frame drops during rendering, improves the stable rendering ability of the user interface at a specified frame rate, and improves the user's browsing experience.

✦ Generated by Eureka AI based on patent content.

Smart Images

  • Figure CN2024128727_08052025_PF_FP_ABST
    Figure CN2024128727_08052025_PF_FP_ABST
Patent Text Reader

Abstract

Provided in the embodiments of the present disclosure are a graphic data rendering method and apparatus, and a device, a readable storage medium and a product. The method comprises: acquiring a plurality of pieces of graphic data in a user interface that are to be rendered, and determining an exposure sequence corresponding to the plurality of pieces of graphic data; on the basis of the exposure sequence, determining priority information corresponding to the plurality of pieces of graphic data; and performing a frame-by-frame rendering operation on the plurality of pieces of graphic data on the basis of the priority information corresponding to the plurality of pieces of graphic data. Therefore, on the basis of the priority information, a preferential rendering operation can be performed on graphic data requiring emergency rendering. In addition, the frame-by-frame rendering operation can also be performed on the plurality of pieces of graphic data, and incremental rendering is performed on the graphic data in each frame, so that a browser can complete the drawing of a graph within a specified time without overloading, thereby effectively preventing the problem of frame dropping during a rendering process from affecting the browsing experience of a user.
Need to check novelty before this filing date? Find Prior Art

Description

Graphics data rendering method, device, equipment, readable storage medium and product

[0001] This application claims priority to Chinese patent application No. 202311446579.X filed on November 1, 2023. The contents of the above-mentioned Chinese patent application disclosure are hereby incorporated by reference in their entirety as a part of this application. Technical Field

[0002] Embodiments of the present disclosure relate to a method, apparatus, device, readable storage medium, and product for rendering graphic data. Background Art

[0003] The user interface (UI) is the medium for interaction and information exchange between the system and the user. It converts information from its internal form into a form that humans can understand. A UI typically displays multiple graphical data to allow users to obtain more information.

[0004] The current user interface rendering method generally renders all the graphic data to be displayed in the user interface when the user interface is opened.

[0005] However, when using the above method to render the user interface, the browser rendering single thread may be too busy and overloaded, so it cannot complete the drawing of graphic data at the specified frame rate, resulting in frame drops in the UI display, affecting the user's browsing experience.

[0006] Summary of the Invention

[0007] The embodiments of the present disclosure provide a graphic data rendering method, apparatus, device, readable storage medium and product, which are used to solve the technical problem that the existing user interface rendering method cannot complete the drawing of graphic data at a specified frame rate, resulting in frame drops in the display of the graphic interface.

[0008] In a first aspect, an embodiment of the present disclosure provides a method for rendering graphics data, comprising:

[0009] Acquire multiple graphic data in a user interface to be rendered, and determine an exposure order corresponding to the multiple graphic data;

[0010] determining priority information corresponding to the plurality of graphic data according to the exposure order;

[0011] A frame rendering operation is performed on the plurality of graphic data based on priority information corresponding to the plurality of graphic data.

[0012] In a second aspect, an embodiment of the present disclosure provides a graphics data rendering device, comprising:

[0013] an acquisition module, configured to acquire a plurality of graphic data in a user interface to be rendered, and determine an exposure order corresponding to the plurality of graphic data;

[0014] a determination module, configured to determine priority information corresponding to the plurality of graphic data according to the exposure sequence;

[0015] The rendering module is used to perform frame rendering operations on the multiple graphic data based on priority information corresponding to the multiple graphic data.

[0016] In a third aspect, an embodiment of the present disclosure provides an electronic device, including: a processor and a memory;

[0017] The memory stores computer-executable instructions;

[0018] The processor executes the computer-executable instructions stored in the memory, so that the at least one processor performs the graphics data rendering method as described in the first aspect and various possible designs of the first aspect.

[0019] In a fourth aspect, an embodiment of the present disclosure provides a computer-readable storage medium, in which computer execution instructions are stored. When a processor executes the computer execution instructions, the graphics data rendering method described in the first aspect and various possible designs of the first aspect is implemented.

[0020] In a fifth aspect, an embodiment of the present disclosure provides a computer program product, including a computer program, which, when executed by a processor, implements the graphics data rendering method described in the first aspect and various possible designs of the first aspect. BRIEF DESCRIPTION OF THE DRAWINGS

[0021] In order to more clearly illustrate the embodiments of the present disclosure or the technical solutions in the prior art, a brief introduction will be given below to the drawings required for use in the embodiments or the description of the prior art. Obviously, the drawings described below are some embodiments of the present disclosure. For ordinary technicians in this field, other drawings can be obtained based on these drawings without paying any creative labor.

[0022] FIG1 is a schematic diagram of a flow chart of a method for rendering graphic data according to an embodiment of the present disclosure;

[0023] FIG2 is a schematic diagram of a user interface provided by an embodiment of the present disclosure;

[0024] FIG3 is a schematic diagram of frame rendering provided by an embodiment of the present disclosure;

[0025] FIG4 is a schematic diagram of a flow chart of a method for rendering graphic data according to another embodiment of the present disclosure;

[0026] FIG5 is a flow chart of a method for rendering graphic data according to another embodiment of the present disclosure;

[0027] FIG6 is a schematic diagram of the structure of a graphics data rendering device provided by an embodiment of the present disclosure;

[0028] FIG7 is a schematic structural diagram of an electronic device provided by an embodiment of the present disclosure. DETAILED DESCRIPTION

[0029] To make the objectives, technical solutions, and advantages of the embodiments of the present disclosure more clear, the technical solutions in the embodiments of the present disclosure will be clearly and completely described below in conjunction with the accompanying drawings. Obviously, the described embodiments are only part of the embodiments of the present disclosure, not all of the embodiments. All other embodiments obtained by ordinary technicians in this field based on the embodiments of the present disclosure without making any creative efforts shall fall within the scope of protection of the present disclosure.

[0030] Glossary:

[0031] User Interface (UI): An interface refers to the medium through which users interact, such as apps and web pages. As the name suggests, UI focuses on the user interface's presentation, including visual aesthetics, design aesthetics, convenience, and style. Details also include fonts, font size, color, icons, buttons, and animations.

[0032] Frame rate: The frequency (rate) at which bitmap images, called frames, appear on a display. This term also applies to film and video cameras, computer graphics, and motion capture systems. Frame rate can also be called frame frequency and is expressed in Hertz (Hz).

[0033] Frame drops generally refer to a phenomenon in which the display freezes (either briefly or for a long time) due to a low frame rate caused by hardware inadequate to handle the dynamic refresh rate of the display. In gaming, frame drops are a phenomenon in which the image doesn't refresh quickly enough, resulting in a stagnant or stuck display.

[0034] Frames Per Second (FPS): In the field of graphics, this refers to the number of frames transmitted per second. More generally, it refers to the number of frames in an animation or video. This refers to the number of consecutive images displayed in one second. For example, at 30 fps, 30 consecutive images are displayed in one second. At 60 fps, 60 consecutive images are displayed in one second.

[0035] It is understandable that before using the technical solutions disclosed in the various embodiments of this disclosure, the type, scope of use, usage scenarios, etc. of the personal information involved in this disclosure should be informed to the user and the user's authorization should be obtained in an appropriate manner in accordance with relevant laws and regulations.

[0036] For example, in response to a user's active request, a prompt message is sent to the user to clearly inform the user that the operation requested will require the acquisition and use of the user's personal information. This allows the user to independently choose whether to provide personal information to the electronic device, application, server, storage medium, or other software or hardware that performs the operations of the disclosed technical solution based on the prompt message.

[0037] As an optional but non-limiting implementation, in response to receiving a user's active request, the prompt information may be sent to the user in the form of a pop-up window, in which the prompt information may be presented in text form. Furthermore, the pop-up window may also contain a selection control for the user to select "agree" or "disagree" to provide personal information to the electronic device.

[0038] It is understandable that the above notification and user authorization process are merely illustrative and do not limit the implementation of the present disclosure. Other methods that comply with relevant laws and regulations may also be applied to the implementation of the present disclosure.

[0039] In order to solve the technical problem that existing user interface rendering methods cannot complete the drawing of graphic data at a specified frame rate, resulting in frame drops in the display of the graphical interface, the present disclosure provides a graphic data rendering method, device, equipment, readable storage medium and product.

[0040] It should be noted that the graphics data rendering method, apparatus, device, readable storage medium and product provided by the present disclosure can be applied in any application scenario of graphics interface rendering.

[0041] Currently, the system displays a large number of UI elements to users. As a result, during the initial loading or use process, the browser rendering thread is too busy and overloaded, and cannot complete the drawing of graphic data at the specified frame rate (the refresh rate of the screen within a time range). As a result, the UI display may experience frame drops, affecting the user's browsing experience.

[0042] In the process of solving the above technical problems, the inventors found through research that in order to avoid frame drops during the rendering process, the graphic data can be segmented according to the exposure order of the graphic data to be rendered, and multiple graphic data can be divided into queues to be rendered with different priorities.

[0043] Furthermore, during the rendering process, the graphics data can be displayed on the screen in frames. At least one target graphics data is determined based on the rendering capabilities of the browser used to render the graphics data and the rendering time of the graphics data in each queue to be rendered. Within each frame, an incremental rendering operation is performed on the at least one target graphics data corresponding to the current frame.

[0044] FIG1 is a flow chart of a method for rendering graphic data according to an embodiment of the present disclosure. As shown in FIG1 , the method includes:

[0045] Step 101: Acquire a plurality of graphic data in a user interface to be rendered, and determine an exposure sequence corresponding to the plurality of graphic data.

[0046] The execution subject of this embodiment is a graphics data rendering device. The graphics data rendering device can be coupled to a terminal device, thereby performing graphics data rendering operations based on priority information of the graphics data in response to a user's browsing operation of a user interface on the terminal device. Alternatively, the graphics data rendering device can be coupled to a server that is communicatively connected to the terminal device. The server can thereby receive a graphics data rendering request sent by the terminal device and perform graphics data rendering operations based on the graphics data rendering request and priority information of the graphics data.

[0047] In this embodiment, a user can browse a user interface on a terminal device, and the user interface generally includes a plurality of graphic data, wherein the graphic data includes but is not limited to graphic contents such as images, controls, and icons.

[0048] When a user opens the user interface for the first time, or switches the graphic content displayed in the user interface, in order to meet the user's browsing needs for the user interface, a rendering operation may be performed on multiple graphic data in the user interface.

[0049] Optionally, multiple graphic data in the user interface to be rendered can be obtained. When the user first opens the user interface, the multiple graphic data can be all the graphic data in the user interface. When the user browses content by switching operations, the multiple graphic data can be updated graphic data corresponding to the user's switching operations.

[0050] Furthermore, to improve the accuracy and efficiency of rendering graphic data, an exposure order corresponding to multiple graphic data items can be determined. Because the user interface may require display of a large amount of graphic content, an exposure area and a pending exposure area can be configured within the user interface. The exposure area can be the currently viewable area within the user interface. Graphical data within the exposure area that has not yet been rendered takes precedence over graphical data within the pending exposure area.

[0051] Step 102: Determine priority information corresponding to the plurality of graphic data according to the exposure sequence.

[0052] In this embodiment, after the exposure sequence corresponding to the plurality of graphic data is determined, priority information corresponding to the plurality of graphic data may be determined based on the exposure sequence.

[0053] Optionally, if at least one graphic data item is already in the exposure area but has not been rendered, the highest priority can be set for that graphic data so that it can be urgently rendered to ensure the user's browsing experience. If at least one graphic data item is in the pending exposure area and can be switched to the exposure area for exposure based on a user-triggered switching operation, a lower priority can be set for that graphic data so that it can be rendered when it is switched to the exposure area. Graphic data that is in the exposure area but has not been rendered has a higher priority than graphic data in the pending exposure area and a higher priority than other graphic data.

[0054] Step 103: Perform frame rendering operations on the multiple graphic data based on priority information corresponding to the multiple graphic data.

[0055] In this embodiment, after respectively determining the priority information corresponding to the plurality of graphic data, in order to ensure the timeliness of the rendering operation, the plurality of graphic data may be subjected to frame rendering operations based on the priority information.

[0056] Optionally, the rendering operation may be performed on the graphic data with the highest priority first, and after the rendering operation on the graphic data with the highest priority is completed, the rendering operation may be performed on the graphic data with a lower priority.

[0057] Furthermore, multiple graphics data can be rendered in frames. Graphics data can be rendered incrementally within each frame so that the browser can complete the rendering of the graphics within a specified time without overloading.

[0058] Furthermore, based on any of the above embodiments, step 101 includes:

[0059] In response to a triggering operation on a user interface, a plurality of graphic data to be rendered corresponding to the user interface is acquired.

[0060] In this embodiment, a user may perform a trigger operation on a user interface, including but not limited to an opening operation, a forward loading operation, a reverse loading operation, etc. In response to the user's trigger operation on the user interface, a plurality of graphics data to be rendered corresponding to the user interface may be obtained.

[0061] When the user first opens the user interface, the plurality of graphic data may be all the graphic data in the user interface. When the user browses content through forward loading and reverse loading operations, the plurality of graphic data may be updated graphic data corresponding to the forward loading and reverse loading operations.

[0062] The graphics data rendering method provided in this embodiment determines priority information for multiple graphics data sets based on the order in which the graphics data are exposed. This allows rendering operations to be performed on the multiple graphics data sets based on this priority information, prioritizing the rendering of graphics data that require urgent rendering based on this priority information. Furthermore, multiple graphics data sets can be rendered in frames, with incremental rendering performed within each frame. This allows the browser to complete graphics rendering within a specified timeframe without overloading, effectively preventing frame drops during the rendering process that could impact the user's browsing experience.

[0063] Optionally, based on any of the above embodiments, step 102 includes:

[0064] If the graphic data is in an exposure area in the user interface and is in an unrendered state, the priority of the graphic data is determined to be the first priority.

[0065] If the graphic data is within the area to be exposed in the user interface, the priority of the graphic data is determined to be the second priority.

[0066] The graphics data other than the first priority and the second priority among the plurality of graphics data are determined as a third priority.

[0067] Among them, the first priority is higher than the second priority, which is higher than the third priority.

[0068] In this embodiment, when graphic data is already in the exposed area of ​​the user interface and is not rendered, in order to avoid page jitter, an empty placeholder can be displayed at the display location corresponding to the graphic data. In order to present the graphic data on the user interface in a timely manner, the priority of the graphic data can be set to the first priority. The first priority can be the highest priority, so that the first priority graphic data can be urgently rendered later.

[0069] Furthermore, if graphic data is within the pending exposure area of ​​the user interface, it can be displayed based on a user-triggered loading operation. Its rendering urgency is lower than that of unrendered graphic data already within the exposure area of ​​the user interface. Therefore, a second priority can be assigned to this graphic data. The second priority is lower than the first priority. After completing the rendering operation for the graphic data corresponding to the first priority, the rendering operation for the graphic data corresponding to the second priority can continue.

[0070] Furthermore, a third priority level may be set for graphics data other than the graphics data corresponding to the first and second priorities among the plurality of graphics data. The first priority level is higher than the second priority level, which is higher than the third priority level. After completing the rendering operation for the graphics data corresponding to the first and second priorities, the rendering operation for the graphics data corresponding to the third priority level may continue.

[0071] FIG2 is a schematic diagram of a user interface provided by an embodiment of the present disclosure. As shown in FIG2 , the user interface 21 includes an exposure area 22 and an area to be exposed 23. The exposure area 22 can display multiple graphic data 24. Graphic data within the exposure area 22 that has not been rendered can be used as a placeholder using a preset block diagram, with its priority set to first. Graphic data 25 within the area to be exposed 23 can be set to second priority.

[0072] The graphic data rendering method provided in this embodiment determines the priority of graphic data based on the exposure order of the graphic data. The exposure order can accurately represent the urgency of graphic data rendering, thereby providing a basis for rendering the graphic data.

[0073] Furthermore, based on any of the above embodiments, step 103 includes:

[0074] A first queue to be rendered corresponding to the first priority, a second queue to be rendered corresponding to the second priority, and a third queue to be rendered corresponding to the third priority are respectively constructed.

[0075] Frame rendering operations are performed sequentially on the plurality of graphic data corresponding to the first queue to be rendered, the second queue to be rendered, and the third queue to be rendered.

[0076] In this embodiment, after determining the priority information corresponding to each graphic data, the graphic data can be divided based on the priority information to obtain a first queue to be rendered corresponding to the first priority, a second queue to be rendered corresponding to the second priority, and a third queue to be rendered corresponding to the third priority.

[0077] Furthermore, since the first priority is higher than the second priority which is higher than the third priority, in order to be able to perform priority rendering operations on graphic data that require urgent rendering, multiple graphic data corresponding to the first queue to be rendered, the second queue to be rendered and the third queue to be rendered can be frame-rendered in turn.

[0078] FIG3 is a schematic diagram of frame rendering provided by an embodiment of the present disclosure. As shown in FIG3 , after establishing three queues to be rendered based on priority information, the graphics data 31 in the first queue to be rendered can be rendered first. After the rendering operation on the graphics data 31 in the first queue to be rendered is completed, the graphics data 32 in the second queue to be rendered can be rendered in the next frame. After the rendering operation on the graphics data 32 in the second queue to be rendered is completed, the graphics data 33 in the third queue to be rendered can be rendered in the next frame.

[0079] The graphics data rendering method provided in this embodiment performs frame rendering operations on multiple graphics data corresponding to the first queue to be rendered, the second queue to be rendered, and the third queue to be rendered in sequence, thereby ensuring that priority rendering operations are performed on graphics data that need to be rendered urgently, while other graphics data are rendered in a timely manner.

[0080] FIG4 is a flowchart of a method for rendering graphic data according to another embodiment of the present disclosure. Based on any of the above embodiments, as shown in FIG4 , step 103 includes:

[0081] Step 401: Construct a preset number of priority queues according to the priority information.

[0082] Step 402: Determine the rendering capability of the browser for graphics rendering operations in each frame.

[0083] Step 403: Perform frame rendering operations on the graphic data corresponding to the preset number of priority queues in descending order of priority according to the rendering capability.

[0084] In this embodiment, after determining the priority information corresponding to each graphic data, the graphic data can be divided based on the priority information to obtain a preset number of priority queues, wherein the number of priority queues is consistent with the number of levels of the priority information.

[0085] Furthermore, in order to enable the browser to complete the drawing of graphics within a specified time without being overloaded, the graphics data may be rendered in frames based on the priority information and the rendering capability of the browser.

[0086] Optionally, the rendering capability of the browser used for graphics rendering operations in each frame may be determined, and then frame rendering operations may be performed on the graphics data corresponding to a preset number of priority queues in descending order of priority based on the rendering capability.

[0087] The graphics data rendering method provided in this embodiment performs frame rendering operations on the graphics data based on the browser's rendering capabilities and priority information, thereby enabling the browser to complete the drawing of the graphics within a specified time without being overloaded, effectively avoiding frame drops during the rendering process.

[0088] Further, based on any of the above embodiments, step 303 includes:

[0089] According to the rendering capability corresponding to the current frame of the browser, at least one target graphic data matching the rendering capability is obtained from the preset number of priority queues in descending order of priority.

[0090] A rendering operation is performed on the at least one target graphics data.

[0091] In this embodiment, for each time frame, the rendering capability of the browser corresponding to the current frame can be determined, and the priority queue for rendering the current frame can be determined in the preset number of priority queues in descending order of priority.

[0092] Furthermore, at least one target graphics data that matches the rendering capability can be determined in the priority queue to be rendered in the current frame. A rendering operation is performed on the at least one target graphics data. The sum of the rendering times corresponding to the at least one target graphics data is less than or equal to the rendering capability of the browser for the current frame.

[0093] Further, based on any of the above embodiments, the rendering operation on the at least one target graphic data includes:

[0094] An incremental rendering operation is performed on the at least one target graphics data in the user interface.

[0095] In this embodiment, during the frame rendering operation, urgent graphics data can be prioritized. At least one target graphics data is determined based on the priority information and the rendering capability. Based on the currently rendered data, an incremental rendering operation is performed on the at least one target graphics data.

[0096] The graphics data rendering method provided in this embodiment retrieves at least one target graphics data item that matches the browser's rendering capability for the current frame from a preset number of priority queues in descending order of priority based on the browser's rendering capability. The method then performs a rendering operation on the at least one target graphics data item, thereby accurately determining the at least one target graphics data item to be rendered. Furthermore, the method avoids browser overload during the rendering process, effectively preventing frame drops and improving the user experience.

[0097] FIG5 is a flow chart of a graphics data rendering method provided by another embodiment of the present disclosure. Based on any of the above embodiments, as shown in FIG5 , obtaining at least one target graphics data that matches the rendering capability of the browser in the current frame from the preset number of priority queues in descending order of priority includes:

[0098] Step 501: Determine the rendering queue to be processed by the browser in the current frame in descending order of priority.

[0099] Step 502: Determine at least one graphic data in the queue to be rendered according to the rendering capability, so that the sum of the rendering times corresponding to the at least one graphic data matches the rendering capability.

[0100] Step 503: Determine the at least one graphic data as the at least one target graphic data.

[0101] In this embodiment, in order to accurately determine at least one target graphic data to be rendered, for each time frame, the queue to be rendered for the current frame can be determined according to the historical rendering progress and the order of priority from high to low.

[0102] After determining the queue to be rendered, at least one graphic data item that matches the rendering capability can be identified in the queue to be rendered, where the sum of the rendering times corresponding to the at least one graphic data item is less than or equal to the rendering capability of the current frame of the browser. The at least one graphic data item can then be identified as the at least one target graphic data item.

[0103] For example, assuming that in the current frame, the browser's corresponding rendering capability can withstand a graphic data time of n, then three graphic data with time consumptions of a, b, and c are taken out from the priority queue, and the layout and rendering are serially arranged in sequence, where: a+b+c<=n. This ensures that the rendering of the graphic data in the current round will not exceed the browser's rendering load.

[0104] The graphic data rendering method provided in this embodiment determines at least one target graphic data based on the rendering capability of the browser, priority information, and the rendering time consumption of the graphic data, so that the total rendering time consumption of the at least one target graphic data matches the rendering capability of the browser, avoiding overloading the browser during the rendering process, ensuring stable rendering of the graphic data, and improving the user experience.

[0105] Further, based on any of the above embodiments, step 402 includes:

[0106] If it is determined that the sum of the rendering time consumptions corresponding to at least one remaining graphic data in the current rendering queue to be rendered is less than the rendering capability, determine the next rendering queue according to the priority information.

[0107] Determine at least one graphic data in the next rendering queue so that the sum of the rendering time consumptions of the at least one graphic data in the next rendering queue and the at least one remaining graphic data corresponds to the rendering capability.

[0108] Determine the at least one remaining graphic data and the at least one graphic data in the next rendering queue as the at least one target graphic data.

[0109] In this embodiment, if the sum of the rendering time consumptions corresponding to at least one remaining graphic data in the rendering queue to be rendered in the current time frame is less than the rendering capability, the at least one remaining graphic data can be directly rendered in the current frame.

[0110] As an implementable way, in order to make full use of the rendering capability of the browser, determine at least one graphic data in the next rendering queue so that the sum of the rendering time consumptions of the at least one graphic data in the next rendering queue and the at least one remaining graphic data corresponds to the rendering capability. Determine the at least one remaining graphic data and the at least one graphic data in the next rendering queue as the at least one target graphic data. Thus, the graphic data in two priority queues can be rendered in one frame.

[0111] For example, assume that in the current frame, the rendering capability corresponding to the browser can be that the tolerable graphic data time consumption is n, and the time consumptions corresponding to the two remaining graphic data in the current rendering queue to be rendered are a and b respectively, where: a + b < n. At this time, in order to make full use of the rendering capability of the browser, a graphic data can be determined from the next rendering queue, and the time consumption corresponding to this graphic data can be c, where: a + b + c <= n. Thus, the three graphic data can be serially typeset and layout-rendered in sequence, and it can be ensured that the rendering of the graphic data in the current round will not exceed the rendering load of the browser.

[0112] The graphics data rendering method provided in this embodiment obtains at least one graphics data in the next rendering queue after the data in the current rendering queue is rendered, and renders the graphics data in the two rendering queues within one frame, thereby making full use of the browser's rendering capabilities and improving the efficiency of graphics data rendering.

[0113] Figure 6 is a schematic diagram of the structure of a graphics data rendering device provided in an embodiment of the present disclosure. As shown in Figure 6, the device includes an acquisition module 61, a determination module 62, and a rendering module 63. Acquisition module 61 is configured to acquire multiple graphics data in a user interface to be rendered and determine an exposure order corresponding to the multiple graphics data. Determination module 62 is configured to determine priority information corresponding to the multiple graphics data based on the exposure order. Rendering module 63 is configured to perform frame-by-frame rendering operations on the multiple graphics data based on the priority information corresponding to the multiple graphics data.

[0114] Furthermore, based on any of the above embodiments, the determination module is configured to: if the graphic data is in an exposure area of ​​the user interface and is not rendered, determine the priority of the graphic data to be a first priority; if the graphic data is in a to-be-exposed area of ​​the user interface, determine the priority of the graphic data to be a second priority; and determine the graphic data other than the first and second priority data among the plurality of graphic data to be a third priority. The first priority is higher than the second priority, which is higher than the third priority.

[0115] Furthermore, based on any of the above embodiments, the rendering module is configured to respectively establish a first queue to be rendered corresponding to a first priority, a second queue to be rendered corresponding to a second priority, and a third queue to be rendered corresponding to a third priority, and sequentially perform frame rendering operations on multiple graphics data corresponding to the first queue to be rendered, the second queue to be rendered, and the third queue to be rendered.

[0116] Furthermore, based on any of the above embodiments, the rendering module is configured to: construct a preset number of priority queues based on the priority information; determine the rendering capability of the browser for graphics rendering operations for each frame; and perform frame-by-frame rendering operations on the graphics data corresponding to the preset number of priority queues in descending order of priority based on the rendering capability.

[0117] Furthermore, based on any of the above embodiments, the rendering module is configured to, based on the rendering capability of the browser corresponding to the current frame, retrieve at least one target graphic data that matches the rendering capability from the preset number of priority queues in descending order of priority, and perform a rendering operation on the at least one target graphic data.

[0118] Furthermore, based on any of the above embodiments, the rendering module is configured to: determine a queue of graphics data to be processed by the browser in the current frame in descending order of priority; determine at least one graphic data in the queue of graphics data to be rendered based on the rendering capability, such that a sum of rendering times corresponding to the at least one graphic data matches the rendering capability; and determine the at least one graphic data as the at least one target graphic data.

[0119] Further, based on any of the above embodiments, the rendering module is configured to: if it is determined that the sum of the rendering times corresponding to at least one remaining graphic data item in the current queue to be rendered is less than the rendering capability, determine the next queue to be rendered based on the priority information; determine at least one graphic data item in the next rendering queue so that the sum of the rendering times corresponding to the at least one graphic data item in the next rendering queue and the at least one remaining graphic data item matches the rendering capability; and determine the at least one remaining graphic data item and the at least one graphic data item in the next rendering queue as the at least one target graphic data item.

[0120] Furthermore, based on any of the above embodiments, the rendering module is used to: perform an incremental rendering operation on the at least one target graphic data in the user interface.

[0121] Furthermore, based on any of the above embodiments, the acquisition module is used to: in response to a triggering operation on a user interface, acquire a plurality of graphic data to be rendered corresponding to the user interface.

[0122] The device provided in this embodiment can be used to execute the technical solution of the above method embodiment. Its implementation principle and technical effects are similar and will not be described in detail in this embodiment.

[0123] In order to implement the above embodiments, the embodiments of the present disclosure further provide a computer-readable storage medium, in which computer-executable instructions are stored. When a processor executes the computer-executable instructions, the graphics data rendering method as described in any of the above embodiments is implemented.

[0124] In order to implement the above embodiments, the embodiments of the present disclosure further provide a computer program product, including a computer program, which implements the method for rendering graphics data as described in any of the above embodiments when executed by a processor.

[0125] In order to implement the above embodiment, the present disclosure further provides an electronic device, including: a processor and a memory;

[0126] The memory stores computer-executable instructions;

[0127] The processor executes the computer-executable instructions stored in the memory, so that the processor performs the graphics data rendering method as described in any of the above embodiments.

[0128] FIG7 is a schematic diagram of the structure of an electronic device provided in an embodiment of the present disclosure. The electronic device 700 may be a terminal device or a server. The terminal device may include, but is not limited to, mobile terminals such as mobile phones, laptop computers, digital broadcast receivers, personal digital assistants (PDAs), tablet computers (Portable Android Devices, PADs), portable multimedia players (PMPs), vehicle-mounted terminals (e.g., vehicle-mounted navigation terminals), and fixed terminals such as digital TVs and desktop computers. The electronic device shown in FIG7 is merely an example and should not limit the functionality and scope of use of the embodiments of the present disclosure.

[0129] As shown in FIG7 , the electronic device 700 may include a processing device (e.g., a central processing unit, a graphics processing unit, etc.) 701, which can perform various appropriate actions and processes according to a program stored in a read-only memory (ROM) 702 or a program loaded from a storage device 708 into a random access memory (RAM) 703. Various programs and data required for the operation of the electronic device 700 are also stored in the RAM 703. The processing device 701, the ROM 702, and the RAM 703 are connected to each other via a bus 704. An input / output (I / O) interface 705 is also connected to the bus 704.

[0130] Typically, the following devices may be connected to the I / O interface 705: an input device 706 including, for example, a touch screen, a touchpad, a keyboard, a mouse, a camera, a microphone, an accelerometer, a gyroscope, etc.; an output device 707 including, for example, a liquid crystal display (LCD), a speaker, a vibrator, etc.; a storage device 708 including, for example, a magnetic tape, a hard disk, etc.; and a communication device 709. The communication device 709 may allow the electronic device 700 to communicate with other devices wirelessly or by wire to exchange data. Although FIG. 7 shows an electronic device 700 having various devices, it should be understood that it is not required to implement or have all of the devices shown. More or fewer devices may be implemented or have alternatively.

[0131] In particular, according to an embodiment of the present disclosure, the process described above with reference to the flowchart can be implemented as a computer software program. For example, an embodiment of the present disclosure includes a computer program product, which includes a computer program carried on a computer-readable medium, and the computer program includes program code for executing the method shown in the flowchart. In such an embodiment, the computer program can be downloaded and installed from the network via the communication device 709, or installed from the storage device 708, or installed from the ROM 702. When the computer program is executed by the processing device 701, the above-mentioned functions defined in the method of the embodiment of the present disclosure are performed.

[0132] It should be noted that the computer-readable medium mentioned above in the present disclosure may be a computer-readable signal medium or a computer-readable storage medium, or any combination of the two. A computer-readable storage medium may be, for example, but not limited to, an electrical, magnetic, optical, electromagnetic, infrared, or semiconductor system, device, or component, or any combination of the above. More specific examples of computer-readable storage media may include, but are not limited to: an electrical connection with one or more wires, a portable computer disk, 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 disk read-only memory (CD-ROM), an optical storage device, a magnetic storage device, or any suitable combination of the above. In the present disclosure, a computer-readable storage medium may be any tangible medium that contains or stores a program that can be used by or in conjunction with an instruction execution system, device, or component. In the present disclosure, a computer-readable signal medium may include a data signal propagated in baseband or as part of a carrier wave, which carries computer-readable program code. Such a propagated data signal may take a variety of forms, including but not limited to electromagnetic signals, optical signals, or any suitable combination of the above. A computer-readable signal medium may also be any computer-readable medium other than a computer-readable storage medium that can transmit, propagate, or transport a program for use by or in conjunction with an instruction execution system, apparatus, or device. The program code contained on the computer-readable medium may be transmitted using any suitable medium, including but not limited to wires, optical cables, RF (radio frequency), etc., or any suitable combination thereof.

[0133] The computer-readable medium may be included in the electronic device, or may exist independently without being incorporated into the electronic device.

[0134] The computer-readable medium carries one or more programs. When the one or more programs are executed by the electronic device, the electronic device executes the method shown in the above embodiment.

[0135] Computer program code for performing the operations of the present disclosure may be written in one or more programming languages, or a combination thereof, including object-oriented programming languages ​​such as Java, Smalltalk, C++, and conventional procedural programming languages ​​such as "C" or similar programming languages. The program code may be executed entirely on the user's computer, partially on the user's computer, as a stand-alone software package, partially on the user's computer and partially on a remote computer, or entirely on a remote computer or server. In cases involving a remote computer, the remote computer may be connected to the user's computer through any type of network, including a Local Area Network (LAN) or a Wide Area Network (WAN), or may be connected to an external computer (e.g., via the Internet using an Internet Service Provider).

[0136] The flowcharts and block diagrams in the accompanying drawings illustrate the possible implementation architecture, functions and operations of the systems, methods and computer program products according to various embodiments of the present disclosure. In this regard, each box in the flowchart or block diagram can represent a module, program segment, or a part of code, and the module, program segment, or a part of code contains one or more executable instructions for realizing the specified logical function. It should also be noted that in some alternative implementations, the functions marked in the box can also occur in a different order than that marked in the accompanying drawings. For example, two boxes represented in succession can actually be executed substantially in parallel, and they can sometimes be executed in the opposite order, depending on the functions involved. It should also be noted that each box in the block diagram and / or flowchart, and the combination of the boxes in the block diagram and / or flowchart, can be implemented with a dedicated hardware-based system that performs the specified function or operation, or can be implemented with a combination of dedicated hardware and computer instructions.

[0137] The units involved in the embodiments described in this disclosure may be implemented in software or hardware. In some cases, the name of a unit does not limit the unit itself. For example, the first acquisition unit may also be described as a "unit for acquiring at least two Internet Protocol addresses."

[0138] The functions described above herein may be performed, at least in part, by one or more hardware logic components. For example, and without limitation, exemplary types of hardware logic components that may be used include: field programmable gate arrays (FPGAs), application specific integrated circuits (ASICs), application specific standard products (ASSPs), systems on chip (SOCs), complex programmable logic devices (CPLDs), and the like.

[0139] In the context of the present disclosure, a machine-readable medium can be a tangible medium that can contain or store a program for use by or in conjunction with an instruction execution system, device or equipment. A machine-readable medium can be a machine-readable signal medium or a machine-readable storage medium. A machine-readable medium can include, but is not limited to, an electronic, magnetic, optical, electromagnetic, infrared, or semiconductor system, device or equipment, or any suitable combination of the foregoing. A more specific example of a machine-readable storage medium can include an electrical connection based on one or more lines, a portable computer disk, 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 disk read-only memory (CD-ROM), an optical storage device, a magnetic storage device, or any suitable combination of the foregoing.

[0140] The above description is merely a preferred embodiment of the present disclosure and an illustration of the technical principles employed. Those skilled in the art should understand that the scope of disclosure involved in the present disclosure is not limited to the technical solutions formed by the specific combination of the above-mentioned technical features, but also includes other technical solutions formed by any combination of the above-mentioned technical features or their equivalents without departing from the above-mentioned disclosed concepts. For example, a technical solution formed by replacing the above-mentioned features with (but not limited to) technical features with similar functions disclosed in this disclosure.

[0141] In addition, although each operation is described in a specific order, this should not be understood as requiring these operations to be performed in the specific order shown or in a sequential order. Under certain circumstances, multitasking and parallel processing may be advantageous. Similarly, although some specific implementation details have been included in the above discussion, these should not be interpreted as limiting the scope of the present disclosure. Some features described in the context of a separate embodiment can also be implemented in a single embodiment in combination. On the contrary, the various features described in the context of a single embodiment can also be implemented in multiple embodiments individually or in any suitable sub-combination mode.

[0142] Although the subject matter has been described in language specific to structural features and / or methodological logical acts, it should be understood that the subject matter defined in the appended claims is not necessarily limited to the specific features or acts described above. Rather, the specific features and acts described above are merely example forms of implementing the claims.

Claims

1. A method for rendering graphic data, comprising: Acquire multiple graphic data in the user interface to be rendered, and determine an exposure order corresponding to the multiple graphic data; Determining priority information corresponding to the plurality of graphic data according to the exposure sequence; A frame rendering operation is performed on the multiple graphic data based on priority information corresponding to the multiple graphic data.

2. The method according to claim 1, wherein: The determining, according to the exposure sequence, priority information corresponding to the plurality of graphic data includes: If the graphic data is in an exposure area in the user interface and is in an unrendered state, determining that the priority of the graphic data is a first priority; If the graphic data is within the area to be exposed in the user interface, determining the priority of the graphic data to be the second priority; Determining the graphic data other than the first priority and the second priority among the plurality of graphic data as a third priority; Among them, the first priority is higher than the second priority and higher than the third priority.

3. The method according to claim 2, wherein: The performing frame rendering operations on the plurality of graphic data based on priority information corresponding to the plurality of graphic data includes: Constructing a first queue to be rendered corresponding to the first priority, a second queue to be rendered corresponding to the second priority, and a third queue to be rendered corresponding to the third priority respectively; Frame rendering operations are performed sequentially on multiple graphics data corresponding to the first queue to be rendered, the second queue to be rendered, and the third queue to be rendered.

4. The method according to claim 1, wherein: The performing frame rendering operations on the plurality of graphic data based on priority information corresponding to the plurality of graphic data includes: Constructing a preset number of priority queues according to the priority information; Determine the browser's rendering capabilities for each frame for graphics rendering operations; According to the rendering capability, frame rendering operations are performed on the graphics data corresponding to the preset number of priority queues in order from high to low priority.

5. The method according to claim 4, wherein: The step of performing frame rendering operations on the graphics data corresponding to the preset number of priority queues in descending order of priority according to the rendering capability includes: According to the rendering capability of the browser corresponding to the current frame, acquiring at least one target graphic data matching the rendering capability from the preset number of priority queues in descending order of priority; A rendering operation is performed on the at least one target graphics data.

6. The method according to claim 5, wherein: The step of acquiring at least one target graphic data matching the rendering capability from the preset number of priority queues in a descending order of priority according to the rendering capability corresponding to the current frame of the browser includes: Determine the rendering queue to be processed by the browser in the current frame in order of priority from high to low; Determine at least one graphic data in the queue to be rendered according to the rendering capability, so that the sum of the rendering time corresponding to the at least one graphic data matches the rendering capability; The at least one graphic data is determined as the at least one target graphic data.

7. The method according to claim 6, wherein: The determining at least one graphic data in the queue to be rendered according to the rendering capability comprises: If it is determined that the sum of the rendering times corresponding to at least one remaining graphic data in the current queue to be rendered is less than the rendering capability, determining the next queue to be rendered according to the priority information; Determining at least one graphic data in the next rendering queue so that a sum of rendering times corresponding to the at least one graphic data in the next rendering queue and the at least one remaining graphic data matches the rendering capability; The at least one remaining graphics data and at least one graphics data in a next rendering queue are determined as the at least one target graphics data.

8. The method according to claim 5, wherein: The rendering operation on the at least one target graphic data comprises: An incremental rendering operation is performed on the at least one target graphics data in the user interface.

9. The method according to any one of claims 1 to 8, wherein: The obtaining of a plurality of graphic data in the user interface to be rendered includes: In response to a triggering operation on a user interface, a plurality of graphic data to be rendered corresponding to the user interface is acquired.

10. A graphics data rendering device, comprising: An acquisition module is configured to acquire a plurality of graphic data in a user interface to be rendered, and determine an exposure order corresponding to the plurality of graphic data; a determination module, configured to determine priority information corresponding to the plurality of graphic data according to the exposure sequence; as well as The rendering module is configured to perform frame rendering operations on the multiple graphic data based on priority information corresponding to the multiple graphic data.

11. An electronic device, comprising: Processor and memory; The memory stores computer-executable instructions; The processor executes the computer-executable instructions stored in the memory, so that the processor executes the graphics data rendering method according to any one of claims 1 to 9.

12. A computer-readable storage medium, wherein: The computer-readable storage medium stores computer-executable instructions, and when the processor executes the computer-executable instructions, the graphics data rendering method according to any one of claims 1 to 9 is implemented.

Citation Information

Patent Citations

  • Page data processing method and device, equipment, medium and computer program product

    CN112784200A

  • Page component rendering method and device, equipment and medium

    CN116089756A

  • Rendering on a mobile device

    US20200110528A1