Method, apparatus, device and medium for rendering page components
View Patent ↗The present application discloses a method, apparatus, device and medium for rendering page components. When a target page needs to be loaded, rendering data corresponding to at least one pending component in the target page is obtained, and a rendering request corresponding to the at least one pending component is added to a scheduling queue. A rendering request of a target pending component is read from the scheduling queue according to the position of the at least one pending component in the target page, and further the target rendering component is rendered according to rendering data corresponding to the target pending component in the rendering request. That is, when rendering components in a page, the rendering order between various components will be coordinated according to the position of the component in the page, thereby avoiding the problem of buffering when too many components are rendered at the same time.
1 . A method for rendering page components, wherein the method comprises:
obtaining rendering data corresponding to at least one pending component in a target page and adding a rendering request corresponding to the at least one pending component to a scheduling queue, the rendering request comprising the rendering data;
reading a rendering request of a target pending component from the scheduling queue according to a position of the at least one pending component in the target page, a position of the target pending component in the target page meeting a preset condition;
rendering the target pending component according to the rendering data corresponding to the target pending component in the rendering request; and
wherein the reading a rendering request of a target pending component from the scheduling queue according to the position of the at least one pending component in the target page comprises:
reading a rendering request of a target pending component from the scheduling queue according to a scheduling policy and the position of the at least one pending component in the target page, the target pending component being a pending component which will be rendered in priority as indicated by the scheduling policy; the scheduling policy comprises in-viewport first and First In First Out (FIFO), the in-viewport first having a higher priority than the FIFO.
2 . The method of claim 1 , wherein,
in response to an existence of a rendering request of a pending component within the viewport of the target page in the scheduling queue, the target pending component is an in-viewport component among the at least one rendering component;
in response to an absence of a rendering request of a pending component within the viewport of the target page in the scheduling queue, the target pending component is a non in-viewport component that enters the scheduling queue in priority among the at least one pending component.
3 . The method of claim 1 , wherein in response to the target pending component comprising a first number of pending components, before rendering the target pending component according to rendering data corresponding to the target pending component in the rendering request, the method further comprises:
in response to the first number being more than a preset number threshold, determining a preset number threshold of pending components from the first number of pending components in the order of entering the scheduling queue;
the rendering the target pending component according to rendering data corresponding to the target pending component in the rendering request comprises:
rendering the preset number threshold of pending components in parallel according to rendering requests corresponding to the preset number threshold of pending components respectively.
4 . The method of claim 1 , wherein the method further comprises:
removing the rendering request of the target pending component from the scheduling queue and re-executing to read a rendering request of a target pending component from the scheduling queue according to the position of the at least one pending component in the target page until the rendering of the at least one pending component in the target page is completed.
5 . The method of claim 1 , wherein the method further comprises:
in response to the scheduling queue being empty, entering a dormant state and monitoring the scheduling queue at a preset frequency.
6 . The method of claim 1 , wherein before obtaining rendering data corresponding to at least one pending component in a target page, the method further comprises:
allocating a scheduling queue for the target page.
7 . An electronic device, comprising:
a processor; and
a memory coupled to the processor and having instructions stored therein, wherein the instructions, when executed by the processor, cause the electronic device to perform actions comprising:
obtaining rendering data corresponding to at least one pending component in a target page and adding a rendering request corresponding to the at least one pending component to a scheduling queue, the rendering request comprising the rendering data;
reading a rendering request of a target pending component from the scheduling queue according to a position of the at least one pending component in the target page, a position of the target pending component in the target page meeting a preset condition;
rendering the target pending component according to the rendering data corresponding to the target pending component in the rendering request; and
wherein the reading a rendering request of a target pending component from the scheduling queue according to the position of the at least one pending component in the target page comprises:
reading a rendering request of a target pending component from the scheduling queue according to a scheduling policy and the position of the at least one pending component in the target page, the target pending component being a pending component which will be rendered in priority as indicated by the scheduling policy; the scheduling policy comprises in-viewport first and First In First Out (FIFO), the in-viewport first having a higher priority than the FIFO.
8 . The device of claim 7 , wherein,
in response to an existence of a rendering request of a pending component within the viewport of the target page in the scheduling queue, the target pending component is an in-viewport component among the at least one rendering component;
in response to an absence of a rendering request of a pending component within the viewport of the target page in the scheduling queue the target pending component is a non in-viewport component that enters the scheduling queue in priority among the at least one pending component.
9 . The device of claim 7 , wherein in response to the target pending component comprising a first number of pending components, before rendering the target pending component according to rendering data corresponding to the target pending component in the rendering request, the method further comprises:
in response to the first number being more than a preset number threshold, determining a preset number threshold of pending components from the first number of pending components in the order of entering the scheduling queue;
the rendering the target pending component according to rendering data corresponding to the target pending component in the rendering request comprises:
rendering the preset number threshold of pending components in parallel according to rendering requests corresponding to the preset number threshold of pending components respectively.
10 . The device of claim 7 , wherein the method further comprises:
removing the rendering request of the target pending component from the scheduling queue and re-executing to read a rendering request of a target pending component from the scheduling queue according to the position of the at least one pending component in the target page until the rendering of the at least one pending component in the target page is completed.
11 . The device of claim 7 , wherein the actions further comprises:
in response to the scheduling queue being empty, entering a dormant state and monitoring the scheduling queue at a preset frequency.
12 . The device of claim 7 , wherein before obtaining rendering data corresponding to at least one pending component in a target page, the actions further comprises:
allocating a scheduling queue for the target page.
13 . A computer program product tangibly stored in a computer storage medium and comprising machine-executable instructions that, when executed by a device, cause the device to perform a method comprising:
obtaining rendering data corresponding to at least one pending component in a target page and adding a rendering request corresponding to the at least one pending component to a scheduling queue, the rendering request comprising the rendering data;
reading a rendering request of a target pending component from the scheduling queue according to a position of the at least one pending component in the target page, a position of the target pending component in the target page meeting a preset condition;
rendering the target pending component according to the rendering data corresponding to the target pending component in the rendering request; and
wherein the reading a rendering request of a target pending component from the scheduling queue according to the position of the at least one pending component in the target page comprises:
reading a rendering request of a target pending component from the scheduling queue according to a scheduling policy and the position of the at least one pending component in the target page, the target pending component being a pending component which will be rendered in priority as indicated by the scheduling policy; the scheduling policy comprises in-viewport first and First In First Out (FIFO), the in-viewport first having a higher priority than the FIFO.
14 . The computer program product of claim 13 , wherein,
in response to an existence of a rendering request of a pending component within the viewport of the target page in the scheduling queue, the target pending component is an in-viewport component among the at least one rendering component;
in response to an absence of a rendering request of a pending component within the viewport of the target page in the scheduling queue, the target pending component is a non in-viewport component that enters the scheduling queue in priority among the at least one pending component.
15 . The computer program product of claim 13 , wherein in response to the target pending component comprising a first number of pending components, before rendering the target pending component according to rendering data corresponding to the target pending component in the rendering request, the method further comprises:
in response to the first number being more than a preset number threshold, determining a preset number threshold of pending components from the first number of pending components in the order of entering the scheduling queue;
the rendering the target pending component according to rendering data corresponding to the target pending component in the rendering request comprises:
rendering the preset number threshold of pending components in parallel according to rendering requests corresponding to the preset number threshold of pending components respectively.
16 . The computer program product of claim 13 , wherein the method further comprises:
removing the rendering request of the target pending component from the scheduling queue and re-executing to read a rendering request of a target pending component from the scheduling queue according to the position of the at least one pending component in the target page until the rendering of the at least one pending component in the target page is completed.
17 . The computer program product of claim 13 , wherein the method further comprises:
in response to the scheduling queue being empty, entering a dormant state and monitoring the scheduling queue at a preset frequency.