CN116578299A - Big data list implementation method based on AngullarJS framework - Google Patents

Big data list implementation method based on AngullarJS framework Download PDF

Info

Publication number
CN116578299A
CN116578299A CN202310849000.8A CN202310849000A CN116578299A CN 116578299 A CN116578299 A CN 116578299A CN 202310849000 A CN202310849000 A CN 202310849000A CN 116578299 A CN116578299 A CN 116578299A
Authority
CN
China
Prior art keywords
rendering area
height
area
data list
big data
Prior art date
Legal status (The legal status is an assumption and is not a legal conclusion. Google has not performed a legal analysis and makes no representation as to the accuracy of the status listed.)
Granted
Application number
CN202310849000.8A
Other languages
Chinese (zh)
Other versions
CN116578299B (en
Inventor
徐文勇
田红伟
魏伟宁
Current Assignee (The listed assignees may be inaccurate. Google has not performed a legal analysis and makes no representation or warranty as to the accuracy of the list.)
Chengdu Shumo Technology Co ltd
Original Assignee
Chengdu Shumo Technology Co ltd
Priority date (The priority date is an assumption and is not a legal conclusion. Google has not performed a legal analysis and makes no representation as to the accuracy of the date listed.)
Filing date
Publication date
Application filed by Chengdu Shumo Technology Co ltd filed Critical Chengdu Shumo Technology Co ltd
Priority to CN202310849000.8A priority Critical patent/CN116578299B/en
Publication of CN116578299A publication Critical patent/CN116578299A/en
Application granted granted Critical
Publication of CN116578299B publication Critical patent/CN116578299B/en
Active legal-status Critical Current
Anticipated expiration legal-status Critical

Links

Classifications

    • GPHYSICS
    • G06COMPUTING; CALCULATING OR COUNTING
    • G06FELECTRIC DIGITAL DATA PROCESSING
    • G06F8/00Arrangements for software engineering
    • G06F8/30Creation or generation of source code
    • G06F8/38Creation or generation of source code for implementing user interfaces
    • GPHYSICS
    • G06COMPUTING; CALCULATING OR COUNTING
    • G06FELECTRIC DIGITAL DATA PROCESSING
    • G06F3/00Input arrangements for transferring data to be processed into a form capable of being handled by the computer; Output arrangements for transferring data from processing unit to output unit, e.g. interface arrangements
    • G06F3/01Input arrangements or combined input and output arrangements for interaction between user and computer
    • G06F3/048Interaction techniques based on graphical user interfaces [GUI]
    • G06F3/0484Interaction techniques based on graphical user interfaces [GUI] for the control of specific functions or operations, e.g. selecting or manipulating an object, an image or a displayed text element, setting a parameter value or selecting a range
    • G06F3/0485Scrolling or panning
    • G06F3/04855Interaction with scrollbars
    • GPHYSICS
    • G06COMPUTING; CALCULATING OR COUNTING
    • G06FELECTRIC DIGITAL DATA PROCESSING
    • G06F9/00Arrangements for program control, e.g. control units
    • G06F9/06Arrangements for program control, e.g. control units using stored programs, i.e. using an internal store of processing equipment to receive or retain programs
    • G06F9/44Arrangements for executing specific programs
    • G06F9/451Execution arrangements for user interfaces
    • YGENERAL TAGGING OF NEW TECHNOLOGICAL DEVELOPMENTS; GENERAL TAGGING OF CROSS-SECTIONAL TECHNOLOGIES SPANNING OVER SEVERAL SECTIONS OF THE IPC; TECHNICAL SUBJECTS COVERED BY FORMER USPC CROSS-REFERENCE ART COLLECTIONS [XRACs] AND DIGESTS
    • Y02TECHNOLOGIES OR APPLICATIONS FOR MITIGATION OR ADAPTATION AGAINST CLIMATE CHANGE
    • Y02DCLIMATE CHANGE MITIGATION TECHNOLOGIES IN INFORMATION AND COMMUNICATION TECHNOLOGIES [ICT], I.E. INFORMATION AND COMMUNICATION TECHNOLOGIES AIMING AT THE REDUCTION OF THEIR OWN ENERGY USE
    • Y02D10/00Energy efficient computing, e.g. low power processors, power management or thermal management

Abstract

The invention discloses a big data list implementation method based on an AngullarJS framework, wherein the big data list consists of a visual area, a virtual container and a rendering area, and the rendering area further comprises an upper pre-rendering area, an actual rendering area and a lower pre-rendering area; firstly, setting the height of a visual area, calculating the height of a virtual container, the number of data items in an actual rendering area and the height of the whole rendering area, then compiling an HTML template file, monitoring a scrolling event triggered by a user, obtaining a value of a scrollTop, calculating a value of a renderIndex in real time, judging whether a big data list needs to be updated according to the value of the scrollTop and the value of the renderIndex, and finally updating the bound parameters in the HTML file based on the bidirectional binding characteristic of the Angust, setting the positioning height of the rendering area, and finishing the updating of the big data list. On the premise of following the AngullarJS framework, the invention realizes the update of the big data list by using the API with higher efficiency, and does not invade and destroy the original development flow of the software.

Description

Big data list implementation method based on AngullarJS framework
Technical Field
The invention relates to the technical field of computer software development, in particular to a big data list implementation method based on an AngullarJS framework.
Background
The AngullarJS consumes serious time when rendering a large number of data lists due to the performance of the AngullarJS, and the consumption of resources of DOM rendering is far greater than the cost of JavaScript operation, so that the waiting time when a user accesses the large data list is far beyond the accepted standard, and the illusion of page jam can be generated. Only a few ten pieces of data will be displayed in the visual range, but the rendering of the remaining data will consume a lot of time, which is unnecessary and unacceptable.
In order to meet the requirement of a big data list, projects developed by using AngullarJS are used, the common practice is to adopt a paging display list or limit the maximum number of lists, the schemes can reduce user experience to a certain extent or even degrade the requirement, and when paging operation of a user is enough, the browser is likely to crash due to the problems of excessive memory or event monitoring and the like.
For example, publication number CN111381823a, publication date is 2020, 07, and the invention name is "Web end long list rendering method", which specifically includes the following technical scheme: the invention discloses a Web end long list rendering method, which comprises the following steps: page layout: setting a fixed length list in a root node; the user sets a data array to be rendered, the height of the view and a rendering function required for rendering the data, and calculates the height of the whole page according to the length of the data array and the height of DOM nodes occupied by each piece of rendered data; calculating the minimum number of data required by each page of content in the fixed length list; adding a head monitoring node and a tail monitoring node in front and behind the fixed length list respectively, adding monitoring events for the head monitoring node and the tail monitoring node by using a Intersection Observer object, starting to pull down updated data when the head monitoring element monitoring event is triggered, and conversely, starting to slide up updated data when the tail monitoring element monitoring event is triggered; the invention uses a new rolling monitoring method and DOM operation algorithm to optimize the problem of loading the long list and blocking.
The prior art described above utilizes intersection observe to monitor the relative position between the DOMs to trigger refreshing of the data and relies on the margin properties of the DOM elements for localization. However, this prior art cannot be directly used in the angullarjs framework, and has caused a problem of poor compatibility due to the use of newer listening API intersection observe.
Disclosure of Invention
In order to solve the problems and defects in the prior art, the invention provides a big data list implementation method based on an AngullarJS framework, which realizes the update of the big data list by using an API with higher efficiency on the premise of following the AngullarJS framework, and does not invade and destroy the original development flow of software.
In order to achieve the above object, the present invention has the following technical scheme:
the big data list implementation method based on the AngullarJS framework comprises a visual area, a virtual container and a rendering area, wherein the rendering area comprises an upper pre-rendering area, an actual rendering area and a lower pre-rendering area, and the big data list implementation method specifically comprises the following steps:
setting the height of a visible area;
acquiring a big data list array, calculating the height of the virtual container and setting the height of the virtual container through JavaScript;
calculating the number of data items rendered in the actual rendering area and calculating the height of the whole rendering area;
writing an HTML file, binding two parameters, namely the number of data items rendered in an actual rendering area and the index of a first piece of data in the rendering area, into the HTML file, and updating a big data list;
monitoring a user-triggered scroll bar scrolling operation, acquiring a value of a scrollTop along with triggering of a scrolling event, calculating an index value of first data in a rendering area in real time, and judging whether a large data list needs to be updated according to the value of the scrollTop and the index value of the first data in the rendering area;
based on the two-way binding characteristic of the AngularJS, updating the binding parameters in the HTML file, setting the positioning height of the rendering area, and finally completing the updating of the big data list.
Preferably, the acquiring the big data list array calculates the height of the virtual container, including:
the height of each data item is set equal, and then the height of the virtual container is equal to the length of the large data list array multiplied by the height of each data item.
Preferably, the minimum height of the actual rendering area is greater than the height of the visible area.
Preferably, the number of data items rendered in the actual rendering area is calculated to be a value of the visible area height/the height of each data item, and is obtained by rounding up.
Preferably, the calculating the height of the entire rendering area includes:
setting the number of prerendered data items included in the upper prerendered area and the lower prerendered area to be the same as the number of data items rendered in the actual rendering area, the height of the whole rendering area is the number of data items rendered in the actual rendering area multiplied by the height of each data item multiplied by 3.
Preferably, the big data list part uses a ng-repeat circular list and uses a built-in filter limit to when writing an HTML file.
Preferably, the value of the first data item in the rendering area is calculated in real time by dividing the value of the first data item by the height of each data item, and subtracting the number of the rendered data items in the upper pre-rendering area.
Preferably, the determining whether the big data list needs to be updated according to the value of the scrollTop and the value of the index of the first piece of data in the rendering area includes:
when the value of the scrollTop is smaller than the height of the actual rendering area, the rendering area does not need to be updated;
when the value of the scrollTop is larger than the height of the actual rendering area and the distance from the bottom of the visual area to the bottom of the rendering area is smaller than one third of the height of the lower pre-rendering area, the rendering area needs to be updated, including updating of the rendering area data item and updating of the rendering area position;
when the value of the index of the first piece of data in the rendering area is greater than the number of all data items minus the value of the number of data items×3 in the actual rendering area, the rendering area is not required to be updated any more, and the index of the first piece of data in the rendering area is not updated any more.
Preferably, the positioning height of the rendering area is equal to the value of the index of the first piece of data in the rendering area x the height of each piece of data item.
Preferably, the user-triggered scroll bar scrolling operation is monitored, and only one event is triggered within 100 ms.
The invention has the beneficial effects that:
(1) According to the invention, the absolute positioning and dynamic calculation of the rendering area are utilized, so that unnecessary browser DOM rendering is effectively reduced, meanwhile, the influence range of a reflow stage during rendering is reduced by the absolute positioning, and the performance consumption during single page updating is reduced.
(2) The invention utilizes the concept of prerendering and the throttling method, thereby reducing the refreshing frequency and improving the refreshing efficiency of the list on the premise of not influencing the user experience and not perceived by the user.
(3) The present invention uses the characteristics of the angullar js bi-directional data driver and the limit to filter to realize more efficient list refreshing, so that a large number of items using angullar js can still provide a high-performance large data list to the user without introducing a new plug-in or even a framework to introduce the characteristics, resulting in an additional mental burden.
(4) According to the method, the user scrolling operation is calculated in real time, the minimum data quantity capable of covering the visual area is calculated through JavaScript, and the characteristics of API (application program interface) and bidirectional data flow provided by the angular JS are matched, so that the DOM is not required to be directly operated, the minimum code is not required, the position of the actually rendered DOM area is set to correctly display the position of the scroll bar, and therefore a large data list is displayed with minimum time and memory expenditure under the condition that the user does not perceive.
Drawings
The foregoing and the following detailed description of the invention will become more apparent when read in conjunction with the following drawings in which:
FIG. 1 is a flow chart of the method of the present invention.
Detailed Description
In order for those skilled in the art to better understand the technical solution of the present invention, the technical solution for achieving the object of the present invention will be further described through several specific embodiments, and it should be noted that the technical solution claimed in the present invention includes, but is not limited to, the following embodiments. All other embodiments, which can be made by a person skilled in the art without making any inventive effort, based on the embodiments of the present invention shall fall within the scope of protection of the present invention.
The AngullarJS consumes serious time when rendering a large number of data lists due to the performance of the AngullarJS, and the consumption of resources of DOM rendering is far greater than the cost of JavaScript operation, so that the waiting time when a user accesses the large data list is far beyond the accepted standard, and the illusion of page jam can be generated. Only a few ten pieces of data will be displayed in the visual range, but the rendering of the remaining data will consume a lot of time, which is unnecessary and unacceptable.
In order to meet the requirement of a big data list, projects developed by using AngullarJS are used, the common practice is to adopt a paging display list or limit the maximum number of lists, the schemes can reduce user experience to a certain extent or even degrade the requirement, and when paging operation of a user is enough, the browser is likely to crash due to the problems of excessive memory or event monitoring and the like.
Based on this, the embodiment of the invention provides a big data list implementation method based on an AngullarJS framework, which realizes the update of the big data list by using an API with higher efficiency on the premise of following the AngullarJS framework, and does not invade and destroy the original development flow of software. According to the invention, the absolute positioning and dynamic calculation of the rendering area are utilized, so that unnecessary browser DOM rendering is effectively reduced, meanwhile, the influence range of a reflow stage during rendering is reduced by the absolute positioning, and the performance consumption during single page updating is reduced.
In this embodiment, it should be noted first that the big data list is mainly composed of three parts, but an area, a virtual container, and a rendering area, where the rendering area is composed of an upper pre-rendering area, an actual rendering area, and a lower pre-rendering area, specifically as follows:
visual area viewing content: a list area visible to a user, highly customized;
virtual container virtual content: the height is equal to the sum of the heights of all the data items after being rendered and is used for expanding the scroll bar;
actual rendering region render content: the height of the actual rendering area RenderContent is required to be larger than that of the visual area viewContent in the area where the data item is actually rendered;
upper prerendercontentTop: next to the actual rendering area, and above the actual rendering area, the area where the prerendered data item is located;
the lower preRenderContentBottom region prerendercontbottom: next to the actual rendering area, and below the actual rendering area, the area where the pre-rendered data item is located.
Further, the variables define:
each data item height: an itemhight;
index of first piece of data in rendering region: renderIndex.
The embodiment of the invention discloses a big data list realization method based on an AngullarJS framework, which mainly comprises two processes, namely an initialization configuration process and a dynamic calculation process of data items in a big data list and a process of setting the positions of the big data list, and finally realizes the updating of the big data list. The method specifically comprises the following steps with reference to figure 1 of the accompanying description.
S1, initializing configuration.
Step S101, setting a visual area height viewcontHeight.
In this embodiment, it should be noted that, the height view content height of the visual area is set by the user according to the development requirement.
S102, acquiring a big data list array, calculating the height of the virtual container, and setting the height of the page node of the virtual container through JavaScript.
In this embodiment, the default setting is that the height itemhight of each data item is equal, so the height of the virtual container is the value of the large data list array length totalnum×the height itemhight of each data item.
S103, calculating the number of the data items rendered in the actual rendering area, and calculating the height of the virtual whole rendering area.
In this embodiment, first, the minimum height of the actual rendering area needs to be greater than the visual area height viewcontheighting, so the number of data items rendered in the actual rendering area rendercontnum is obtained by taking the value of the visual area height viewcontheighting/each data item height itemhight and rounding up, and the specific expression is as follows:
renderContentNum = Math.ceil(viewContentHeight/ itemHeight);
since the minimum height of the actual rendering area needs to be at least greater than the height viewconthentht of the visible area, the number of data items rendered in the actual rendering area obtained by the above calculation expression is the minimum number.
Further, in order to reduce the number of times of calculation of the actual rendering area RenderContent to save the rendering overhead, in this embodiment, an upper prerenderconttop and a lower preRenderContentBottom are reserved above and below the actual rendering area RenderContent, respectively, where the two preRenderContentBottom contain prerenderbright data items, and the number of prerenderbright data items in the two prerenderbright areas is set to be the same as the number of data items in the actual rendering area by default in this embodiment, that is, the number of prerenderbright data items capable of at least covering the view content in the visual area are reserved up and down; therefore, the height of the upper preRenderContentTop and the lower prerendercontbottom are the same as the height of the actual rendering region renedent, and the height of the entire rendering region is renedentnum×3×itemhight;
step S104, writing an HTML template file, wherein when writing, a ng-repeat cyclic list is used for a big data list part, and a built-in filter limit to is used, and the expression is as follows:
{{ limitTo_expression | limitTo : limit : begin }};
where limit represents the number of stripes presented in the loop and begin represents the index that begins to be presented, i.e., the index of the big data list array. In this embodiment, the limit parameter binds the number of data items rendered in the actual rendering area, i.e. rendercontnum, and begin binds the index of the first piece of data in the rendering area, i.e. renderndex, and dynamically changes the values of the two parameters, thereby implementing updating of the large data list.
And S2, dynamically calculating data items in the big data list and dynamically setting the positions of the big data list.
Step S201, performing scroll event binding on view content of a visual area, monitoring a user-triggered scroll bar rolling operation, acquiring a value of a scroll Top along with triggering of the scroll event, calculating a value of an index of first data in a rendering area in real time, and judging whether a large data list needs to be updated according to the value of the scroll Top and a value of a renderIndex.
In this embodiment, the scrollTop represents an offset of the visual area viewing content from the virtual container viewing content.
In this embodiment, it should also be noted that, in order to prevent the time triggering from being too frequent, by using the throttling technology, only one event is triggered within 100ms, so as to reduce the update frequency of the list, and further improve the performance.
In this embodiment, the value of renderingindex is obtained by dividing the value of scrollTop by the height of each data item, rounding, and subtracting the number of data items rendered in the upper prerendercontentTop.
Step S201.1, when the value of the scrollTop is smaller than the height of the actual rendering area render, the rendering area does not need to be updated.
Step s201.2. when the value of scrollTop is greater than the height of the actual rendering area RenderContent, and when the distance of the bottom of the visible area from the bottom of the entire rendering area is less than a third of the height of the lower preRenderContentBottom, then an update of the rendering area is required, including an update of the rendering area data item and an update of the rendering area position.
In this embodiment, the positioning height of the rendering region is the value of renderIndex×the height itemHeight of each data item.
Step s201.3. When the value of renderingindex is greater than the number total num of all data items of the large data list array minus the value of the number renderingntnum×3 of data items in the actual rendering area, it means that the entire rendering area has been rendered to the end of the entire list, no updating of the rendering area is required, and the renderingindex is not updated any more.
In this embodiment, it should be noted that, as long as the value of the scrollTop or the value of the rendeerindex satisfies any of the above conditions, the operations corresponding to the steps S201.1 to S201.3 are performed.
Step S202, based on the two-way binding characteristic of the AngularJS, updating two parameters of RenderContentNum and RenderIndex bound by limit and begin in an HTML file, setting a top attribute of an absolutely positioned rendering area, and finally completing updating of a big data list.
The foregoing description is only a preferred embodiment of the present invention, and is not intended to limit the present invention in any way, and any simple modification, equivalent variation, etc. of the above embodiment according to the technical matter of the present invention fall within the scope of the present invention.

Claims (10)

1. The big data list implementation method based on the AngullarJS framework is characterized by comprising a visual area, a virtual container and a rendering area, wherein the rendering area comprises an upper pre-rendering area, an actual rendering area and a lower pre-rendering area, and the big data list implementation method specifically comprises the following steps:
setting the height of a visible area;
acquiring a big data list array, calculating the height of the virtual container and setting the height of the virtual container through JavaScript;
calculating the number of data items rendered in the actual rendering area and calculating the height of the whole rendering area;
writing an HTML file, binding two parameters, namely the number of data items rendered in an actual rendering area and the index of a first piece of data in the rendering area, into the HTML file, and updating a big data list;
monitoring a user-triggered scroll bar scrolling operation, acquiring a value of a scrollTop along with triggering of a scrolling event, calculating an index value of first data in a rendering area in real time, and judging whether a large data list needs to be updated according to the value of the scrollTop and the index value of the first data in the rendering area;
based on the two-way binding characteristic of the AngularJS, updating the binding parameters in the HTML file, setting the positioning height of the rendering area, and finally completing the updating of the big data list.
2. The method for implementing the big data list based on the angular js frame according to claim 1, wherein the obtaining the array of the big data list and calculating the height of the virtual container includes:
the height of each data item is set equal, and then the height of the virtual container is equal to the number of all data items of the large data list array multiplied by the height of each data item.
3. The big data list implementation method based on the angular js frame according to claim 1, wherein the minimum height of the actual rendering area is greater than the height of the visible area.
4. The method for implementing a big data list based on an angullarjs frame according to claim 3, wherein the number of data items rendered in the actual rendering area is calculated as a value using the height of the visible area/the height of each data item, and is obtained by rounding up.
5. The big data list implementation method based on the angullarjs frame as set forth in claim 4, wherein the calculating the height of the entire rendering area includes:
setting the number of pre-rendered data items included in the upper pre-rendering area and the lower pre-rendering area to be the same as the number of data items rendered in the actual rendering area, the height of the entire rendering area is the number of data items rendered in the actual rendering area x the height of each data item x 3.
6. The big data list implementation method based on the angullarjs framework according to claim 1, wherein when writing an HTML file, the big data list part uses a ng-repeat loop list and uses a built-in filter limit to.
7. The method for implementing a big data list based on an angullarjs frame according to claim 5, wherein the obtaining a value of a scrollTop, calculating in real time an index value of a first piece of data in a rendering area is obtained by dividing the value of the scrollTop by a height integer of each data item, and subtracting the number of the data items rendered in the upper pre-rendering area.
8. The method for implementing the big data list based on the angular js frame according to claim 1, wherein the determining whether the big data list needs to be updated according to the value of the scrollTop and the value of the index of the first piece of data in the rendering area includes:
when the value of the scrollTop is smaller than the height of the actual rendering area, the rendering area does not need to be updated;
when the value of the scrollTop is larger than the height of the actual rendering area and the distance from the bottom of the visual area to the bottom of the rendering area is smaller than one third of the height of the lower pre-rendering area, the rendering area needs to be updated, including updating of the rendering area data item and updating of the rendering area position;
when the value of the index of the first piece of data in the rendering area is larger than the value of the number of all data items of the large data list array minus the number of data items x 3 in the actual rendering area, the rendering area is not required to be updated any more, and the index of the first piece of data in the rendering area is not updated any more.
9. The big data list implementation method based on the angullarjs frame according to claim 1, wherein the positioning height of the rendering area is equal to the value of the index of the first piece of data in the rendering area x the height of each piece of data item.
10. The big data list implementing method based on the angular js frame according to claim 1, wherein when monitoring a user-triggered scroll bar scrolling operation, only one event is triggered within 100 ms.
CN202310849000.8A 2023-07-12 2023-07-12 Big data list implementation method based on AngullarJS framework Active CN116578299B (en)

Priority Applications (1)

Application Number Priority Date Filing Date Title
CN202310849000.8A CN116578299B (en) 2023-07-12 2023-07-12 Big data list implementation method based on AngullarJS framework

Applications Claiming Priority (1)

Application Number Priority Date Filing Date Title
CN202310849000.8A CN116578299B (en) 2023-07-12 2023-07-12 Big data list implementation method based on AngullarJS framework

Publications (2)

Publication Number Publication Date
CN116578299A true CN116578299A (en) 2023-08-11
CN116578299B CN116578299B (en) 2023-09-08

Family

ID=87536299

Family Applications (1)

Application Number Title Priority Date Filing Date
CN202310849000.8A Active CN116578299B (en) 2023-07-12 2023-07-12 Big data list implementation method based on AngullarJS framework

Country Status (1)

Country Link
CN (1) CN116578299B (en)

Citations (9)

* Cited by examiner, † Cited by third party
Publication number Priority date Publication date Assignee Title
US20110138354A1 (en) * 2009-12-07 2011-06-09 International Business Machines Corporation Interactive video player component for mashup interfaces
US20170034306A1 (en) * 2015-07-30 2017-02-02 Nasdaq, Inc. Software application architecture
CN113656716A (en) * 2021-08-02 2021-11-16 浪潮软件股份有限公司 Method for realizing virtual list with indefinite height
CN114510231A (en) * 2020-11-17 2022-05-17 腾讯科技(深圳)有限公司 Application construction method, device, equipment and computer readable storage medium
CN114980208A (en) * 2022-05-18 2022-08-30 浙江传媒学院 End-to-end mobile Web 3D rendering calculation unloading method
CN115098006A (en) * 2022-06-28 2022-09-23 徐工汉云技术股份有限公司 Performance optimization method and device for saving memory by aiming at rolling large-quantity elements based on Vue
CN115238659A (en) * 2022-06-09 2022-10-25 新奥数能科技有限公司 Report data processing method and device
CN116304415A (en) * 2023-02-03 2023-06-23 北京特立信电子技术股份有限公司 Data rendering optimization method and device based on web
CN116304438A (en) * 2023-04-10 2023-06-23 平安壹钱包电子商务有限公司 Page loading rendering optimization method, device, equipment and medium

Patent Citations (9)

* Cited by examiner, † Cited by third party
Publication number Priority date Publication date Assignee Title
US20110138354A1 (en) * 2009-12-07 2011-06-09 International Business Machines Corporation Interactive video player component for mashup interfaces
US20170034306A1 (en) * 2015-07-30 2017-02-02 Nasdaq, Inc. Software application architecture
CN114510231A (en) * 2020-11-17 2022-05-17 腾讯科技(深圳)有限公司 Application construction method, device, equipment and computer readable storage medium
CN113656716A (en) * 2021-08-02 2021-11-16 浪潮软件股份有限公司 Method for realizing virtual list with indefinite height
CN114980208A (en) * 2022-05-18 2022-08-30 浙江传媒学院 End-to-end mobile Web 3D rendering calculation unloading method
CN115238659A (en) * 2022-06-09 2022-10-25 新奥数能科技有限公司 Report data processing method and device
CN115098006A (en) * 2022-06-28 2022-09-23 徐工汉云技术股份有限公司 Performance optimization method and device for saving memory by aiming at rolling large-quantity elements based on Vue
CN116304415A (en) * 2023-02-03 2023-06-23 北京特立信电子技术股份有限公司 Data rendering optimization method and device based on web
CN116304438A (en) * 2023-04-10 2023-06-23 平安壹钱包电子商务有限公司 Page loading rendering optimization method, device, equipment and medium

Non-Patent Citations (2)

* Cited by examiner, † Cited by third party
Title
S. T. AUNG 等: "An Implementation of Java Programming Learning Assistant System Platform Using Node.js,", 《2022 10TH INTERNATIONAL CONFERENCE ON INFORMATION AND EDUCATION TECHNOLOGY (ICIET)》, pages 47 - 52 *
李晓琳 等: "基于AngularJS的健康大数据用户接口设计与实现", 《软件导刊》, vol. 16, no. 09, pages 120 - 122 *

Also Published As

Publication number Publication date
CN116578299B (en) 2023-09-08

Similar Documents

Publication Publication Date Title
US8775965B1 (en) Immersive mode for a web browser
CN106570098A (en) Page refreshing method and device
WO2021068331A1 (en) Web page adaptive layout method, server and computer-readable storage medium
US10339209B2 (en) Webpage display method and device
EP1828878B1 (en) System and method for viewing digital visual content on a device
US10740945B2 (en) Animation control methods and systems
US8484562B2 (en) Dynamic text adjustment in a user interface element
US8880995B2 (en) Method and system for localized scrolling table display in a webpage
US20050022128A1 (en) System and method for providing a webpage
CN103678622A (en) Method and device for dynamic rendering of waterfall-type picture
CN107977150A (en) A kind of view scrolling method, device and electronic equipment
CN107818008A (en) page loading method and device
CN113467871A (en) H5 page display method, device, equipment and storage medium
CN106339149A (en) Display control method and device as well as electronic equipment
JP2019040565A (en) Electronic device, advertisement display method, and advertisement display program
CN106294301A (en) Report form generation method and device
CN110020311B (en) Webpage display method, browser, terminal and computer readable storage medium
CN109815424A (en) Web page picture display methods and terminal device
CN113434138B (en) Information display method and device and electronic equipment
US20150199329A1 (en) Text display method and apparatus of electronic device
CN116578299B (en) Big data list implementation method based on AngullarJS framework
US20100211870A1 (en) Document display device and method
CN106793026A (en) A kind of method and terminal for realizing reporting events treatment
JP2013232225A (en) Content distribution device, content distribution method, content distribution program, and program for terminal
US20140300627A1 (en) Method and apparatus indicating scroll position on a display

Legal Events

Date Code Title Description
PB01 Publication
PB01 Publication
SE01 Entry into force of request for substantive examination
SE01 Entry into force of request for substantive examination
GR01 Patent grant
GR01 Patent grant