Looking for breakthrough ideas for innovation challenges? Try Patsnap Eureka!

Rendering acceleration method and device for H5 list, equipment and medium

A rendering acceleration and addition technology, applied in the computer field, can solve problems such as screen freezing and unsmooth screen scrolling, and achieve the effect of rendering optimization

Pending Publication Date: 2021-10-22
摩尔元数(福建)科技有限公司
View PDF0 Cites 3 Cited by
  • Summary
  • Abstract
  • Description
  • Claims
  • Application Information

AI Technical Summary

Problems solved by technology

[0003] The technical problem to be solved by the present invention is to provide a rendering acceleration method, device, device and medium of an H5 list. Before the H5 list is rendered, the number of screen virtual cache items is obtained by accumulating the data height one by one, so that the rendering can be optimized. So as to solve the problem of unsmooth screen scrolling and screen freeze caused by the content height problem inside the list

Method used

the structure of the environmentally friendly knitted fabric provided by the present invention; figure 2 Flow chart of the yarn wrapping machine for environmentally friendly knitted fabrics and storage devices; image 3 Is the parameter map of the yarn covering machine
View more

Image

Smart Image Click on the blue labels to locate them in the text.
Viewing Examples
Smart Image
  • Rendering acceleration method and device for H5 list, equipment and medium
  • Rendering acceleration method and device for H5 list, equipment and medium
  • Rendering acceleration method and device for H5 list, equipment and medium

Examples

Experimental program
Comparison scheme
Effect test

Embodiment 1

[0030] Such as figure 1 As shown, the present embodiment provides a rendering acceleration method for an H5 list, including the following steps:

[0031] S1. Obtain the height of the screen through the api when the page is initialized, and use the api to obtain the virtual dom height value of each piece of data before the list is rendered; the data displayed on the page is divided into sections, each text, picture, etc. for a piece of data.

[0032] S2. Through the cyclic data height accumulation method, the actual data height and the actual data number of the first screen and the second screen are sequentially obtained and recorded, and the data of the first screen and the second screen are put into the virtual cache;

[0033] Wherein, the cyclic data height accumulation method is to accumulate the virtual dom height value of each piece of data one by one in a loop, and stop the accumulation whenever the accumulated value is greater than or equal to the height of the screen,...

Embodiment 2

[0051] Such as Figure 4 As shown, in this embodiment, a rendering acceleration device for an H5 list is provided, including:

[0052] The api height acquisition module is used to obtain the screen height when the page is initialized, and obtain the virtual dom height value of each piece of data before the list is rendered;

[0053] The two-screen data acquisition module is used to obtain and record the actual data height and actual data number of the first screen and the second screen in turn through the cyclic data height accumulation method, and put the data of the first screen and the second screen into the virtual cache;

[0054] Wherein, the cyclic data height accumulation method is to accumulate the virtual dom height value of each piece of data one by one in a loop, and stop the accumulation whenever the accumulated value is greater than or equal to the height of the screen, so as to obtain the actual data height and the number of actual data pieces of one screen;

...

Embodiment 3

[0075] This embodiment provides an electronic device, such as Figure 5 As shown, it includes a memory, a processor, and a computer program stored in the memory and operable on the processor. When the processor executes the computer program, any implementation manner in Embodiment 1 can be realized.

[0076]Since the electronic device introduced in this embodiment is the device used to implement the method in Embodiment 1 of this application, based on the method described in Embodiment 1 of this application, those skilled in the art can understand the electronic device of this embodiment. Specific implementation methods and various variations thereof, so how the electronic device implements the method in the embodiment of the present application will not be described in detail here. As long as a person skilled in the art implements the equipment used by the method in the embodiment of the present application, it all belongs to the protection scope of the present application. ...

the structure of the environmentally friendly knitted fabric provided by the present invention; figure 2 Flow chart of the yarn wrapping machine for environmentally friendly knitted fabrics and storage devices; image 3 Is the parameter map of the yarn covering machine
Login to View More

PUM

No PUM Login to View More

Abstract

The invention provides a rendering acceleration method and device for an H5 list, equipment and a medium. The method comprises the steps of obtaining the screen height and the virtual dom height value of each piece of data; sequentially obtaining the actual data height and the actual data number of the first screen and the second screen through a cyclic data height accumulation method, recording the actual data height and the actual data number, and putting the data of the first screen and the second screen into a virtual cache; when the page triggers pull-up scrolling, loading data of a subsequent screen to the virtual cache one by one through the cyclic data height accumulation method; or when the page triggers pull-down scrolling, loading the historical data to the virtual cache screen by screen, however, the data of the three screens, namely the data of the current screen, the data of the previous screen and the data of the next screen, are only reserved in the virtual cache in each time of loading. According to the invention, the number of virtual caches of the screen is obtained by accumulating the data heights one by one, and rendering is optimized, so that the problems of unsmooth screen rolling and screen jamming caused by the problem of the data content height are solved.

Description

technical field [0001] The present invention relates to the field of computer technology, in particular to a rendering acceleration method, device, equipment and medium of an H5 list. Background technique [0002] H5 (i.e. HTML5 standard) list rendering acceleration is a relatively common technology in the IT field, but currently H5 list rendering acceleration imposes a mandatory limit on the height of all data, and then applies the specified content, so when the height of the data inside the list is inconsistent , but the number of pieces of data per screen is fixed. During pull-down loading or pull-up loading, if the height of a piece of data is too small, there may be only half a screen of data fetched in the cache, which will lead to the On this screen, I found that the cache was not enough, so I had to reload the new data, which caused the data cache of this screen to be calculated twice, and then ran to calculate again after halfway sliding, which would cause the scree...

Claims

the structure of the environmentally friendly knitted fabric provided by the present invention; figure 2 Flow chart of the yarn wrapping machine for environmentally friendly knitted fabrics and storage devices; image 3 Is the parameter map of the yarn covering machine
Login to View More

Application Information

Patent Timeline
no application Login to View More
IPC IPC(8): G06F9/451G06F9/445G06F8/38
CPCG06F9/451G06F9/44521G06F8/38
Inventor 刘平
Owner 摩尔元数(福建)科技有限公司
Who we serve
  • R&D Engineer
  • R&D Manager
  • IP Professional
Why Patsnap Eureka
  • Industry Leading Data Capabilities
  • Powerful AI technology
  • Patent DNA Extraction
Social media
Patsnap Eureka Blog
Learn More
PatSnap group products

Browse by: Latest US Patents, China's latest patents, Technical Efficacy Thesaurus, Application Domain, Technology Topic, Popular Technical Reports.

© 2024 PatSnap. All rights reserved.Legal|Privacy policy|Modern Slavery Act Transparency Statement|Sitemap|About US| Contact US: help@patsnap.com