List data processing method and device, equipment and storage medium
By pre-rendering list data items to the cached display page on the embedded platform and using the canvas interface to render off-screen pages in batches, the memory consumption and interface lag issues caused by rendering extremely long lists are resolved, improving rendering efficiency and user experience.
Patent Information
- Authority / Receiving Office
- CN · China
- Patent Type
- Applications(China)
- Current Assignee / Owner
- NINGBO FOTILE KITCHEN WARE CO LTD
- Filing Date
- 2026-01-04
- Publication Date
- 2026-05-12
AI Technical Summary
In embedded platforms or resource-constrained systems, rendering extremely long lists leads to excessive memory consumption, affecting system stability and operating efficiency. Frequent DOM operations and JavaScript execution cause UI lag and slow response.
By pre-rendering list data items to the cached display page, the off-screen page is rendered in batches using the canvas interface, and the content drawing is optimized based on the viewport size and display attribute information, reducing real-time calculations and improving rendering efficiency.
It reduces page load latency, improves data item rendering efficiency, avoids frequent DOM manipulation and JavaScript execution, and enhances user experience.
Smart Images
Figure CN122019033A_ABST
Abstract
Description
Technical Field
[0001] This application relates to the field of graphics rendering technology, specifically to a list data processing method, apparatus, device, and storage medium. Background Technology
[0002] Displaying and managing extremely long list items is a significant technical challenge in embedded platforms or resource-constrained systems. Traditional list rendering methods typically preload all list items at once, but this approach leads to excessive memory consumption when the number of list items is large, thus affecting system stability and efficiency. When handling extremely long lists, frequent DOM manipulations and JavaScript execution can significantly impact rendering performance. Due to limited computing resources and memory, this can cause UI stuttering or sluggish response, thereby degrading the user experience. Summary of the Invention
[0003] This application provides a list rendering method, apparatus, device, and storage medium that improves the rendering efficiency of data items by adding a cached display page and pre-rendering the data item content to the target off-screen page.
[0004] The technical solution of this application is as follows: On the one hand, this application provides a list data processing method, the method comprising: Retrieve the position and display attribute information for each data item in the list data set; Based on the location information and display attribute information of each data item, the canvas size is calculated to obtain the target size information of the cached display page; A cached display page corresponding to the list data set is created based on the target size information, and a target display page is created based on the viewport size, where the viewport size is the area size in the terminal that can be used to render the display page; Based on the display attribute information, each data item is classified into attributes to obtain a set of data items with multiple attribute categories; Each of the data item sets is rendered to the cached display page in batches to obtain the target off-screen page; At least a portion of the rendered content from the target off-screen page is drawn onto the target display page.
[0005] On the other hand, this application provides a data processing apparatus, the apparatus comprising: The data acquisition module is used to acquire the position information and display attribute information of each data item in the list data set; The size calculation module is used to calculate the canvas size based on the position information and display attribute information of each data item, and obtain the target size information of the cached display page. The page creation module is used to create a cached display page corresponding to the list data set based on the target size information, and to create a target display page based on the viewport size, wherein the viewport size is the area size in the terminal that can be used to render and display the page; The classification module is used to classify the data items based on the display attribute information to obtain a set of data items with multiple attribute categories. The first rendering module is used to render each of the data item sets to the cached display page in batches to obtain the target off-screen page; The second rendering module is used to draw at least a portion of the rendered content from the target off-screen page onto the target display page.
[0006] On the other hand, a system upgrade device is provided, the device including a processor and a memory, the memory storing at least one instruction or at least one program, the at least one instruction or the at least one program being loaded and executed by the processor to implement the list data processing method as described above.
[0007] On the other hand, a computer-readable storage medium is provided, wherein at least one instruction or at least one program is stored therein, the at least one instruction or the at least one program being loaded and executed by a processor to implement the list data processing method as described above.
[0008] The list data processing method, apparatus, device, and storage medium provided in this application have the following technical advantages: Using the technical solution provided in this application, in the application scenario of rendering a list data set, the position information and display attribute information corresponding to each data item in the list data set are first obtained; the canvas size is calculated based on the position information and display attribute information of each data item to obtain the target size information of the cached display page; then, a cached display page corresponding to the list data set is created based on the target size information, and a target display page is created based on the viewport size, where the viewport size is the area size in the terminal that can be used to render the display page; each data item is classified based on the display attribute information to obtain a data item set with multiple attribute categories; each data item set is rendered to the cached display page in batches to obtain the target off-screen page; at least a portion of the rendered content in the target off-screen page is drawn to the target display page. By adding a cached display page, off-screen rendering can avoid recalculating and drawing all content every time you scroll or switch views. Pre-rendering the data item content to the target off-screen page helps reduce real-time calculations, reduce page loading latency, and improve the rendering efficiency of data items. Attached Figure Description
[0009] To more clearly illustrate the technical solutions and advantages in the embodiments of this application or the prior art, the drawings used in the description of the embodiments or the prior art will be briefly introduced below. Obviously, the drawings described below are only some embodiments of this application. For those skilled in the art, other drawings can be obtained based on these drawings without creative effort.
[0010] Figure 1 This is a flowchart illustrating a list data processing method provided in an embodiment of this application; Figure 2 This is a flowchart illustrating a list data processing method provided in an embodiment of this application; Figure 3 This is a flowchart illustrating a data loading and processing method provided in an embodiment of this application; Figure 4 This is a schematic diagram of a list data processing device provided in an embodiment of this application; Figure 5 This is a schematic diagram of a list data processing structure provided in an embodiment of this application. Detailed Implementation
[0011] The technical solutions of the embodiments of this application will be clearly and completely described below with reference to the accompanying drawings. Obviously, the described embodiments are only some embodiments of this application, and not all embodiments. Based on the embodiments of this application, all other embodiments obtained by those of ordinary skill in the art without creative effort are within the scope of protection of this application.
[0012] It should be noted that the terms "first," "second," etc., in the specification, claims, and accompanying drawings of this application are used to distinguish similar objects and are not necessarily used to describe a specific order or sequence. It should be understood that such data can be interchanged where appropriate so that the embodiments of this application described herein can be implemented in orders other than those illustrated or described herein. Furthermore, the terms "comprising" and "having," and any variations thereof, are intended to cover non-exclusive inclusion; for example, a process, method, system, product, or server that comprises a series of steps or units is not necessarily limited to those steps or units explicitly listed, but may include other steps or units not explicitly listed or inherent to such processes, methods, products, or devices.
[0013] Understandably, existing technologies dynamically generate and replace DOM elements by calculating the index of the visible area of a long list, while using placeholders to maintain the structure, and then using scroll events and prediction algorithms to optimize the loading of each data item. However, preloading a large number of data items can lead to excessive memory consumption, especially on embedded platforms where resources are limited. When processing extremely long lists, frequent DOM operations and JavaScript execution can affect rendering performance, causing the display interface to lag.
[0014] The following describes a system upgrade method provided by an embodiment of this application. Figure 1 This is a flowchart illustrating a system upgrade method provided in an embodiment of this application. It should be noted that while this specification provides method operation steps as shown in the embodiments or flowcharts, more or fewer operation steps may be included based on conventional or non-inventive labor. The order of steps listed in the embodiments is merely one possible execution order among many and does not represent the only possible execution order. In actual system or product execution, the method can be executed sequentially according to the embodiments or accompanying drawings, or in parallel (e.g., in a parallel processor or multi-threaded processing environment). Specifically, as shown... Figure 1 As shown, the method may include: S101, retrieve the position information and display attribute information corresponding to each data item in the list data set.
[0015] Specifically, the list data set represents a collection of multiple data items in a continuously displayed long list. Each data item includes at least text data, style data, and corresponding metadata. For example, the list data set includes data items P1, P2, ..., Pi, ..., Pn.
[0016] S102, calculate the canvas size based on the position information and display attribute information of each data item to obtain the target size information of the cached display page.
[0017] Specifically, the position information of each data item includes the coordinates and size information of data item Pi within the list data set. This position information is used to determine the coordinates and layout of each data item during rendering. The display attributes of each data item are its visual attributes, including text data, background color data, and style data. The cached display page is an off-screen canvas that is not directly displayed; it is used to render and display list items.
[0018] Specifically, the position information of each data item is traversed, the size information of each data item Pi is obtained according to the index i of the data item, and the target size information of the cached display page is obtained according to the size information of each data item Pi. The size information of the cached display page includes the width W and the height H, and the height H is equal to the total height of N list items.
[0019] S103, create a cached display page corresponding to the list data set based on the target size information, and create a target display page based on the viewport size, where the viewport size is the area size in the terminal that can be used to render the display page.
[0020] Specifically, based on the width W and height H of the target size information, a cached display page capable of accommodating the list data is created. The cached display page is a virtual canvas invisible to the user. The cached display page is used to pre-render all data items. The size of the area in the terminal display that can be used to render the display page is obtained. The viewport size includes the layout viewport size and the visual viewport size. The layout viewport size represents the webpage layout area of the browser, and the visual viewport size includes the size of the area currently visible to the user.
[0021] S104, classify each data item according to the display attribute information to obtain a set of data items with multiple attribute categories.
[0022] Specifically, based on the display attribute information, each data item is classified into attributes, including by text type, font type, icon type, etc., and the data items are traversed to obtain a set of data items with multiple attribute categories.
[0023] S105, render each data item set to the cached display page in batches to obtain the target off-screen page.
[0024] Specifically, multiple off-screen rendering fragments are created by rendering data items of multiple attribute categories block by block using the canvas interface. The canvas interface can include fillRect, fillText, and drawImag, without the need for DOM operations. After the multiple off-screen rendering fragments are rendered, the target off-screen page is obtained. The target off-screen page is represented as the display page of the data items that have been rendered on the cached display page.
[0025] S106, At least a portion of the rendered content from the target off-screen page is drawn onto the target display page.
[0026] Specifically, the target display page is the area in the terminal that can be used to render the display page. The target display page is used to display the content that the user can currently see. At least a portion of the target off-screen page is cropped and rendered to the corresponding position on the target display page.
[0027] In one embodiment, such as Figure 2 As shown, Figure 2 This is a flowchart illustrating a list data processing method provided in an embodiment of this application. After step S106, the method further includes: S202, in response to a page scrolling instruction carrying page scrolling information, at least one target data block corresponding to the page scrolling information is preloaded from the target off-screen page. The target data block is a data block to be displayed that is adjacent to the page data block currently displayed on the target display page. The page data block is obtained by dividing the list data in the target off-screen page into data blocks along the page scrolling direction.
[0028] Specifically, page scrolling information is a dynamic data set including scrolling speed, scrolling direction, current offset, etc.; page scrolling instructions are sliding behavior instructions triggered by the user or controlled by the program; page data blocks are multiple sequentially arranged subsets of list data divided into the list data set; and target data blocks represent the data blocks adjacent to the currently displayed area. For example, if the target data block is the 3rd data block, then the 2nd and 4th data blocks are preloaded.
[0029] Specifically, each page data block includes multiple data items; for example, a page data block includes 50-100 data items.
[0030] S204, draw at least one target data block onto the target display page.
[0031] Specifically, at least one target data block is drawn onto the target display page using the drawImage() function in the Canvas interface.
[0032] In this way, by preloading data blocks in the sliding direction, stuttering or blank screens are avoided when users slide. Page sliding does not need to rely on the backend or main thread to load data or draw in real time, thus optimizing memory management efficiency.
[0033] In one embodiment, such as Figure 3 As shown, Figure 3 This is a flowchart illustrating a data loading and processing method provided in an embodiment of this application. After step S204, the method further includes: S301, determine the current scrolling speed corresponding to the page scrolling instruction based on the page scrolling information.
[0034] Specifically, the current scroll position (currentScrollTop) and the scroll position (lastScrollTop) of the previous scroll event corresponding to the page scroll command are obtained. ΔP is the difference (px) between the current scroll position and the previous scroll position, where ΔP = currentScrollTop - lastScrollTop. The time difference (ΔT) between the current scroll event and the previous scroll event is also calculated. The current scroll speed is determined based on the following formula: V = ΔP / ΔT Where V is the current scrolling speed (px / s); ΔP is the difference (px) between the current scroll position and the previous scroll position. ΔT is the time difference between the current scroll event and the previous scroll event (s).
[0035] When the current scroll speed V is greater than zero, it indicates that the user is scrolling down; when the current scroll speed V is less than zero, it indicates that the user is scrolling up.
[0036] S303, based on the first correspondence between the scroll speed range and the number of data blocks loaded, determines the target data block with the target loading quantity corresponding to the current scroll speed and scroll direction from the page data blocks to be displayed in the target off-screen page. The number of data blocks loaded is positively correlated with the scroll speed.
[0037] Specifically, the current scrolling speed is matched with the preset scrolling speed range, the number of data blocks loaded corresponding to the speed range where the current scrolling speed is located is found, the target data block to be read is calculated according to the scrolling direction, the target data block is loaded from the target off-screen page, and drawn to the target display page.
[0038] For example, when the current scrolling speed is in the low scrolling speed range, 1-2 page data blocks adjacent to the target data block are loaded; when the current scrolling speed is in the high scrolling speed range, 5-10 page data blocks adjacent to the target data block are loaded.
[0039] In this way, target data blocks are loaded on demand based on scrolling speed, saving memory and drawing resources, avoiding scrolling blanks and user waiting, achieving intelligent linkage between scrolling speed and rendering loading, and maintaining interface continuity and smoothness.
[0040] In one embodiment, step S303 includes: S3031, based on the first correspondence between the scroll speed range and the number of data blocks loaded, and the second correspondence between the scroll acceleration and the increment of data block loading, determine the first quantity corresponding to the current scroll speed and the second quantity corresponding to the current scroll acceleration, wherein the current scroll acceleration is determined based on the scroll acceleration.
[0041] Specifically, the second correspondence between scrolling acceleration and data block loading increment represents the mapping rule between acceleration and the amount of additional loading. This second correspondence is used to handle sudden scrolling behavior. The current scrolling acceleration A is the rate of change of scrolling speed per unit time. The current scrolling speed V1 corresponding to the page scrolling instruction and the scrolling speed V2 of the previous scrolling event are obtained to get the speed difference ΔV. The speed difference ΔV = current scrolling speed V1 - scrolling speed V2 of the previous scrolling event, and the time difference ΔT between the current scrolling event and the previous scrolling event. That is, the current scrolling speed is determined based on the following formula: A=ΔV / ΔT Where A is the current rolling acceleration (px / s) 2 ); ΔV is the difference (px / s) between the current scroll position and the previous scroll position. ΔT is the time difference between the current scroll event and the previous scroll event (s).
[0042] Specifically, based on the first quantity, the higher the scrolling acceleration, the stronger the scrolling intention. Some additional preloaded data blocks are added on top of the original loading quantity. For example, when the current scrolling speed is in the low scrolling speed range and the current scrolling acceleration is in the high scrolling acceleration range, 1-2 more page data blocks are loaded on top of the 1-2 page data blocks adjacent to the target data block.
[0043] S3032, the sum of the first quantity and the second quantity is determined as the target loading quantity.
[0044] Specifically, the target load quantity is the total number of data blocks that need to be preloaded in the end. The target load quantity is used to dynamically optimize the load quantity based on overall speed and acceleration.
[0045] S3033, determine the target data block with a target loading quantity M from the page data blocks to be displayed in the target off-screen page.
[0046] Specifically, when scrolling downwards, the target number of data blocks are selected sequentially from the current page data blocks, with the target data block number being [i+1, i+M]; when scrolling upwards, the target number of data blocks are selected sequentially from the current page data blocks, with the target data block number being [iM, i-1].
[0047] In this way, by controlling the number of data blocks loaded through scrolling speed and scrolling acceleration, the page response speed can be significantly improved, avoiding overloading or underloading.
[0048] In one embodiment, the method further includes: S402, during the page scrolling display process, obtain the page scrolling behavior data of the operation subject for the current list data set. The page scrolling behavior data includes historical scrolling speed, historical scrolling direction and historical dwell time. The historical dwell time represents the dwell time of the display frame of the target display page. The switching of adjacent display frames is triggered by the page scrolling command.
[0049] Specifically, the page scrolling behavior data is a set of behavioral parameters generated during user operations, the historical scrolling speed is the time-series data of the most recent scrolling speeds, the historical scrolling direction is the data of the most recent scrolling direction, and the user scrolling behavior acquisition device collects the page scrolling behavior data and outputs it to the scrolling behavior prediction model.
[0050] S404, input the historical scrolling speed, historical scrolling direction and historical dwell time into the scrolling behavior prediction model to predict the page scrolling operation, and obtain the estimated scrolling position of at least one predicted display frame and the scrolling direction of each estimated scrolling position.
[0051] Specifically, the scrolling behavior prediction model uses a reinforcement learning prediction model (RL-Predict). The reinforcement learning prediction model uses a lightweight long short-term memory network (LSTM) to predict the estimated scroll position of at least one frame of the predicted display frame and the scroll direction of each estimated scroll position. The estimated scroll position represents the position of the list that the model predicts the user will scroll next, and the scroll direction of the estimated scroll position represents the scroll direction that the model infers for the user's next operation. The estimated scroll position is used to locate the preloaded data block.
[0052] S406, based on the estimated scroll position and scroll direction, determine the loading priority of each page data block to be displayed corresponding to each predicted display frame.
[0053] Specifically, the data blocks to be displayed are data areas that have not yet been drawn but will be displayed according to the prediction results. The control system assigns loading priorities to each page data block based on the spatial distance and orientation matching degree between the predicted position and each page data block.
[0054] S408, preloads the data blocks of the page to be displayed based on loading priority.
[0055] Specifically, the control system schedules resources in descending order of priority, prioritizing the loading of corresponding page data blocks onto the target off-screen page to enable rapid presentation during subsequent scrolling.
[0056] By using historical user scrolling data and reinforcement learning prediction models, the display area that the page will scroll to in advance can be determined and preloaded, which can effectively reduce white screen or delayed loading problems caused by page scrolling, thereby significantly improving the smoothness of page scrolling and user interaction experience.
[0057] In one embodiment, the above method further includes: S501, if any one of the historical scrolling speed, historical scrolling direction and historical dwell time satisfies the random scrolling behavior condition, preload the target data blocks before the currently displayed data area of the target display page and the target data blocks after the currently displayed data area of the target display page from the page data blocks to be displayed.
[0058] Specifically, the historical scrolling speed represents the speed at which the executing entity scrolls the target display page within a preset historical time period; the historical scrolling direction represents the direction and switching frequency of the executing entity scrolling the target display page in the past; the historical scrolling direction includes up, down, left, and right; the historical dwell time represents the duration of the user's dwell time on a certain display frame; the currently displayed data area includes the page data blocks within the currently visible area; the currently displayed data area is used as the reference position for preloading data blocks; and the target loading quantity is the number of page data blocks that need to be preloaded. For example, if the target loading quantity is 2, then the two target data blocks before and the two target data blocks after the currently displayed data area will be preloaded.
[0059] Specifically, the system determines whether a user meets the conditions for random scrolling behavior by using any one of the following: historical scrolling speed, historical scrolling direction, and historical dwell time. If the conditions are met, the system calculates the number of preloaded target data blocks, initiates an asynchronous request to obtain the target data blocks, and silently loads the target data blocks. When the execution entity continues to trigger scrolling events, the system reads the target data blocks and renders them to the target display page.
[0060] In this way, when users exhibit non-linear scrolling behavior, bidirectional loading of data blocks of the target number before and after the current area avoids blank content, maintains high performance and low resource consumption, and improves the smoothness of the scrolling experience and the system response speed.
[0061] Specifically, the conditions for satisfying random rolling behavior include: The following conditions must be met: the switching frequency of the scrolling direction is greater than or equal to the preset switching frequency; the discrete parameter of the scrolling speed within the preset time period is greater than or equal to the preset discrete threshold; and the dwell time is less than or equal to the preset time threshold.
[0062] Specifically, the scrolling direction switching frequency is the number of times the scrolling direction changes per unit time. The preset switching frequency is a pre-set threshold for scrolling direction switching. For example, if a user switches from "scroll down" to "scroll up" and then back to "scroll down" a total of 3 times within 1 second, the scrolling direction switching frequency is 3Hz, and the preset switching frequency is 2Hz. In this case, the page scrolling behavior data indicates that the user is in "random jump mode," satisfying random scrolling behavior. For example, if a user frequently switches from scrolling down to scrolling up or vice versa, it indicates that the user is quickly searching for a certain location.
[0063] Specifically, the discrete parameter of scrolling speed reflects the degree of fluctuation in scrolling speed within a preset time period, such as standard deviation or variance. If the scrolling speed sequence is 100px / s, 20px / s, 80px / s, and 40px / s, and the preset discrete threshold is the standard deviation (for example, a preset discrete threshold of 20), then the standard deviation of the scrolling speed is greater than the preset discrete threshold. In this case, the page scrolling behavior data indicates that the user is in a "random jump mode," satisfying random scrolling behavior. For example, when the user quickly drags the scroll bar or quickly slides the mouse wheel, the discrete parameter of the user's scrolling speed will be greater than the preset discrete threshold.
[0064] Specifically, the dwell time is the duration during which a user stops scrolling in a certain content area. When the dwell time is less than or equal to a preset time threshold, the page scrolling behavior data indicates that the user is in a "random jump mode," satisfying random scrolling behavior. For example, when a user is quickly browsing multiple content blocks or performing page jump actions, the user's dwell time in a certain display frame will be less than the preset time threshold.
[0065] In this way, by using discrete parameters of scrolling direction and scrolling speed, as well as dwell time, to determine whether the user is in random jump mode, the preloading strategy is optimized, and the rendering response speed is improved.
[0066] As can be seen from the technical solutions provided in the embodiments of this specification above, in the application scenario of rendering a list data set using the technical solutions provided in this application, the position information and display attribute information corresponding to each data item in the list data set are first obtained; the canvas size is calculated based on the position information and display attribute information of each data item to obtain the target size information of the cached display page; then, a cached display page corresponding to the list data set is created based on the target size information, and a target display page is created based on the viewport size, where the viewport size is the area size in the terminal that can be used to render the display page; each data item is classified based on the display attribute information to obtain a data item set with multiple attribute categories; each data item set is rendered to the cached display page in batches to obtain the target off-screen page; at least a portion of the rendered content in the target off-screen page is drawn to the target display page. By adding a cached display page, off-screen rendering can avoid recalculating and drawing all content every time you scroll or switch views. Pre-rendering the data item content to the target off-screen page helps reduce the amount of real-time calculation, reduce page loading latency, and improve the rendering efficiency of data items.
[0067] The following describes a list data processing workflow in practical applications, based on the methods described above: S1, retrieve the position information and display attribute information of each data item in the list data set; S2, calculate the canvas size based on the position information and display attribute information of each data item, and obtain the target size information of the cached display page; S3, create a cached display page corresponding to the list data set based on the target size information, and create a target display page based on the viewport size; S4, classify each data item according to the display attribute information to obtain a set of data items with multiple attribute categories; S5 renders each data item set to the cached display page in batches to obtain the target off-screen page; S6, draw at least a portion of the rendered content from the target off-screen page onto the target display page; S7 responds to scroll commands and determines the current scroll speed based on page scroll information; S8, based on the first correspondence between the scroll speed range and the number of data blocks loaded, and the second correspondence between the scroll acceleration and the increment of data block loading, determine the first quantity corresponding to the current scroll speed and the second quantity corresponding to the current scroll acceleration; S9, determine the target loading quantity by summing the first quantity and the second quantity; S10, determine the target data block for the target loading quantity from the page data blocks to be displayed in the target off-screen page; S11, render the target data block of the target loaded quantity to be displayed page data block onto the target display page.
[0068] The following section describes another list data processing workflow in practical applications, based on the methods described above: S1, retrieve the position information and display attribute information of each data item in the list data set; S2, calculate the canvas size based on the position information and display attribute information of each data item, and obtain the target size information of the cached display page; S3, create a cached display page corresponding to the list data set based on the target size information, and create a target display page based on the viewport size; S4, classify each data item according to the display attribute information to obtain a set of data items with multiple attribute categories; S5 renders each data item set to the cached display page in batches to obtain the target off-screen page; S6, draw at least a portion of the rendered content from the target off-screen page onto the target display page; S7, obtain page scrolling behavior data of the operation subject for the current list data set, including historical scrolling speed, historical scrolling direction and historical dwell time; S8. Determine whether any one of the historical scrolling speed, historical scrolling direction, and historical dwell time meets the conditions for random scrolling behavior. If it does, preload the page data blocks before and after the current display area from the page data blocks to be displayed. If it does not meet the conditions, proceed to S9. S9, input the historical scrolling speed, historical scrolling direction and historical dwell time into the scrolling behavior prediction model to predict the page scrolling operation, and obtain the estimated scrolling position of at least one predicted display frame and the scrolling direction of each estimated scrolling position; S10, determine the loading priority of each page data block to be displayed corresponding to each predicted display frame based on the estimated scroll position and scroll direction; S11, preload the data blocks of the page to be displayed in order of loading priority from high to low; S12, in response to the scroll command, render the preloaded page data block to be displayed onto the target display page; S13, repeat S7-S10 to dynamically update the loading priority of each data block to be displayed page.
[0069] This application provides a list data processing device, such as... Figure 5 As shown, the device includes: Data acquisition module 401 is used to acquire the position information and display attribute information of each data item in the list data set; The size calculation module 402 is used to calculate the canvas size based on the position information and display attribute information of each data item, and obtain the target size information of the cached display page. The page creation module 403 is used to create a cached display page corresponding to the list data set based on the target size information, and to create a target display page based on the viewport size, where the viewport size is the area size in the terminal that can be used to render and display the page; The classification module 404 is used to classify each data item based on the displayed attribute information to obtain a set of data items with multiple attribute categories. The first rendering module 405 is used to render each data item set to the cached display page in batches to obtain the target off-screen page; The second rendering module 406 is used to draw at least a portion of the rendered content from the target off-screen page onto the target display page.
[0070] In one specific embodiment, the above-described apparatus may further include: The data block determination module is used to preload at least one target data block corresponding to the page scrolling information from the target off-screen page in response to the page scrolling instruction carrying page scrolling information. The target data block is a data block to be displayed that is adjacent to the page data block currently displayed on the target display page. The page data block is obtained by dividing the list data in the target off-screen page into data blocks along the page scrolling direction. The drawing module is used to draw at least one target data block onto the target display page.
[0071] In one specific embodiment, the data block determination module described above may include: The scrolling speed determination unit is used to determine the current scrolling speed corresponding to the page scrolling instruction based on the page scrolling information. The first determining unit is used to determine, based on a first correspondence between the scroll speed range and the number of data blocks loaded, the target number of data blocks to be loaded from the page data blocks to be displayed in the target off-screen page, corresponding to the current scroll speed and scroll direction. The number of data blocks loaded is positively correlated with the scroll speed.
[0072] In one specific embodiment, the first determining unit described above may include: The first determining subunit is used to determine the first quantity corresponding to the current scroll speed and the second quantity corresponding to the current scroll acceleration based on the first correspondence between the scroll speed range and the number of data blocks loaded, and the second correspondence between the scroll acceleration and the increment of the data block loading. The current scroll acceleration is determined based on the scroll speed. The target loading quantity unit is used to determine the target loading quantity by summing the first quantity and the second quantity. The second determining subunit is used to determine the target data block of the target loading quantity from the page data block to be displayed in the target off-screen page.
[0073] In an optional embodiment, the above-described apparatus may further include: The scrolling behavior data acquisition module is used to acquire the page scrolling behavior data of the operating subject for the current list data set during the page scrolling display process. The page scrolling behavior data includes historical scrolling speed, historical scrolling direction and historical dwell time. The historical dwell time represents the dwell time of the display frame of the target display page. The switching of adjacent display frames is triggered by the page scrolling command. The prediction module is used to input historical scrolling speed, historical scrolling direction and historical dwell time into the scrolling behavior prediction model to predict page scrolling operations, and obtain the estimated scrolling position of at least one predicted display frame and the scrolling direction of each estimated scrolling position. The priority processing module is used to determine the loading priority of each page data block to be displayed corresponding to each predicted display frame based on the estimated scroll position and scroll direction. The loading module is used to preload blocks of page data to be displayed based on loading priority.
[0074] In one specific embodiment, the above-described apparatus may further include: The random scrolling module is used to preload the target number of target data blocks before the currently displayed data area of the target display page, and the target number of target data blocks after the currently displayed data area of the target display page, if any one of the historical scrolling speed, historical scrolling direction, and historical dwell time meets the random scrolling behavior conditions.
[0075] In an optional embodiment, the above-mentioned random rolling module further includes: The judgment unit is used to satisfy at least one of the following: the switching frequency of the scrolling direction is greater than or equal to a preset switching frequency, the discrete parameter of the scrolling speed within a preset time period is greater than or equal to a preset discrete threshold, and the dwell time is less than or equal to a preset time threshold.
[0076] It should be noted that the apparatus provided in the above embodiments is only illustrated by the division of the above functional modules when implementing its functions. In actual applications, the above functions can be assigned to different functional modules as needed, that is, the internal structure of the device can be divided into different functional modules to complete all or part of the functions described above. In addition, the apparatus and method embodiments provided in the above embodiments belong to the same concept, and the specific implementation process can be found in the method embodiments, which will not be repeated here.
[0077] This application provides a computer device including a processor and a memory. The memory stores at least one instruction or at least one program, which is loaded and executed by the processor to implement a list data processing method as provided in the above method embodiments.
[0078] Figure 5 A schematic diagram of the hardware structure of an apparatus for implementing a list data processing method provided in the embodiments of this application is shown. The apparatus may constitute or include the device or system provided in the embodiments of this application. Figure 5As shown, device 5 may include one or more processors 502 (shown as 502a, 502b, ..., 502n in the figure) 502 (processor 502 may include, but is not limited to, a microprocessor MCU or a programmable logic device FPGA, etc.), a memory 504 for storing data, and a transmission device 506 for communication functions. In addition, it may also include: a display, an input / output interface (I / O interface), a universal serial bus (USB) port (which may be included as one of the ports of the I / O interface), a network interface, a power supply, and / or a camera. Those skilled in the art will understand that... Figure 5 The structure shown is for illustrative purposes only and does not limit the structure of the aforementioned electronic device. For example, device 5 may also include a... Figure 5 The more or fewer components shown, or having the same Figure 5 The different configurations shown.
[0079] It should be noted that the aforementioned one or more processors 502 and / or other data processing circuits are generally referred to herein as "data processing circuits". These data processing circuits may be embodied, in whole or in part, in software, hardware, firmware, or any other combination thereof. Furthermore, the data processing circuits may be a single, independent processing module, or may be integrated, in whole or in part, into any other element within device 5 (or mobile device). As involved in the embodiments of this application, the data processing circuits serve as a processor control mechanism (e.g., selection of a variable resistor termination path connected to an interface).
[0080] The memory 504 can be used to store software programs and modules of application software, such as the program instructions / data storage device corresponding to the method in this embodiment. The processor 502 executes various functional applications and data processing by running the software programs and modules stored in the memory 504, thereby realizing the above-described control method for a cooking device. The memory 504 may include high-speed random access memory, and may also include non-volatile memory, such as one or more magnetic storage devices, flash memory, or other non-volatile solid-state memory. In some instances, the memory 504 may further include memory remotely located relative to the processor 502, and these remote memories can be connected to the device 5 via a network. Examples of such networks include, but are not limited to, the Internet, corporate intranets, local area networks, mobile communication networks, and combinations thereof.
[0081] The transmission device 506 is used to receive or send data via a network. Specific examples of the network described above may include a wireless network provided by the communication provider of device 5. In one example, the transmission device 506 includes a network interface controller (NIC), which can connect to other network devices via a base station to communicate with the Internet. In another example, the transmission device 506 may be a radio frequency (RF) module, used for wireless communication with the Internet.
[0082] The display can be, for example, a touchscreen liquid crystal display (LCD) that allows the user to interact with the user interface of device 5 (or mobile device).
[0083] This application also provides a computer-readable storage medium, which can be disposed in a server to store at least one instruction or at least one program related to implementing a control method for a cooking device in the method embodiment. The at least one instruction or the at least one program is loaded and executed by the processor to implement a list data processing method provided in the above method embodiment.
[0084] Optionally, in this embodiment, the storage medium may be located at at least one of the multiple network servers in a computer network. Optionally, in this embodiment, the storage medium may include, but is not limited to, various media capable of storing program code, such as USB flash drives, read-only memory (ROM), random access memory (RAM), portable hard drives, magnetic disks, or optical disks.
[0085] This invention also provides a computer program product or computer program, which includes computer instructions stored in a computer-readable storage medium. A processor of a computer device reads the computer instructions from the computer-readable storage medium and executes the computer instructions, causing the computer device to perform a control method for a cooking device provided in the various optional embodiments described above.
[0086] It should be noted that the order of the embodiments described above is merely for descriptive purposes and does not represent the superiority or inferiority of the embodiments. Furthermore, the above description focuses on specific embodiments of this application. Other embodiments are within the scope of the appended claims. In some cases, the actions or steps described in the claims can be performed in a different order than that shown in the embodiments and still achieve the desired results. Additionally, the processes depicted in the drawings do not necessarily require a specific or sequential order to achieve the desired results. In some implementations, multitasking and parallel processing are also possible or may be advantageous.
[0087] The various embodiments in this application are described in a progressive manner. Similar or identical parts between embodiments can be referred to mutually. Each embodiment focuses on describing the differences from other embodiments. In particular, the device, equipment, and storage medium embodiments are basically similar to the method embodiments, so the descriptions are relatively simple; relevant parts can be referred to the descriptions of the method embodiments.
[0088] Those skilled in the art will understand that all or part of the steps of the above embodiments can be implemented by hardware or by a program instructing related hardware. The program can be stored in a computer-readable storage medium, such as a read-only memory, a disk, or an optical disk.
[0089] The above description is only a preferred embodiment of this application and is not intended to limit this application. Any modifications, equivalent substitutions, improvements, etc., made within the spirit and principles of this application should be included within the protection scope of this application.
Claims
1. A method for processing list data, characterized in that, The method includes: Retrieve the position information and display attribute information for each data item in the list data set; Based on the location information and display attribute information of each data item, the canvas size is calculated to obtain the target size information of the cached display page; A cached display page corresponding to the list data set is created based on the target size information, and a target display page is created based on the viewport size, where the viewport size is the area size in the terminal that can be used to render the display page; Based on the display attribute information, each data item is classified into attributes to obtain a set of data items with multiple attribute categories; Each of the data item sets is rendered to the cached display page in batches to obtain the target off-screen page; At least a portion of the rendered content from the target off-screen page is drawn onto the target display page.
2. The method according to claim 1, characterized in that, After rendering at least a portion of the off-screen content to the target display page, the method further includes: In response to a page scrolling instruction carrying page scrolling information, at least one target data block corresponding to the page scrolling information is preloaded from the target off-screen page. The target data block is a data block to be displayed that is adjacent to the page data block currently displayed on the target display page. The page data block is obtained by dividing the list data in the target off-screen page into data blocks along the page scrolling direction. Draw the at least one target data block onto the target display page.
3. The method according to claim 2, characterized in that, The step of preloading at least one target data block corresponding to the page scrolling information from the target off-screen page in response to a page scrolling instruction carrying page scrolling information includes: The current scrolling speed corresponding to the page scrolling instruction is determined based on the page scrolling information; Based on the first correspondence between the scrolling speed range and the number of data blocks loaded, the target data blocks corresponding to the current scrolling speed and scrolling direction are determined from the page data blocks to be displayed in the target off-screen page. The number of data blocks loaded is positively correlated with the scrolling speed.
4. The method according to claim 3, characterized in that, The first correspondence between scroll speed range and data block loading quantity, determining the target data block with the target loading quantity corresponding to the current scroll speed from the page data blocks to be displayed in the target off-screen page, includes: Based on the first correspondence between the scrolling speed range and the number of data blocks loaded, and the second correspondence between the scrolling acceleration and the increment of data block loading, the first quantity corresponding to the current scrolling speed and the second quantity corresponding to the current scrolling acceleration are determined, wherein the current scrolling acceleration is determined based on the scrolling speed; The sum of the first quantity and the second quantity is determined as the target loading quantity; The target data block for the target loading quantity is determined from the page data blocks to be displayed in the target off-screen page.
5. The method according to any one of claims 1-3, characterized in that, The method further includes: During the page scrolling display process, the page scrolling behavior data of the operation subject for the current list data set is obtained. The page scrolling behavior data includes historical scrolling speed, historical scrolling direction and historical dwell time. The historical dwell time represents the dwell time of the display frame of the target display page. The switching of adjacent display frames is triggered by the page scrolling command. The historical scrolling speed, the historical scrolling direction, and the historical dwell time are input into the scrolling behavior prediction model to predict page scrolling operations, thereby obtaining the estimated scrolling position of at least one predicted display frame and the scrolling direction of each estimated scrolling position. The loading priority of each page data block to be displayed corresponding to each predicted display frame is determined based on the estimated scroll position and the scroll direction. The data blocks of the page to be displayed are preloaded based on the loading priority.
6. The method according to claim 5, characterized in that, The method further includes: If any one of the historical scrolling speed, the historical scrolling direction, and the historical dwell time satisfies the random scrolling behavior condition, preload the target number of target data blocks before the currently displayed data area of the target display page from the page data blocks to be displayed, and preload the target number of target data blocks after the currently displayed data area of the target display page.
7. The method according to claim 6, characterized in that, The conditions for satisfying random rolling behavior include: The following conditions must be met: the switching frequency of the rolling direction is greater than or equal to a preset switching frequency; the discrete parameter of the rolling speed within a preset time period is greater than or equal to a preset discrete threshold; and the dwell time is less than or equal to a preset time threshold.
8. A data processing apparatus, characterized in that, The device includes: The data acquisition module is used to acquire the position information and display attribute information of each data item in the list data set; The size calculation module is used to calculate the canvas size based on the position information and display attribute information of each data item, and obtain the target size information of the cached display page; The page creation module is used to create a cached display page corresponding to the list data set based on the target size information, and to create a target display page based on the viewport size, wherein the viewport size is the area size in the terminal that can be used to render and display the page; The classification module is used to classify each data item based on the display attribute information to obtain a set of data items with multiple attribute categories. The first rendering module is used to render each of the data item sets to the cached display page in batches to obtain the target off-screen page; The second rendering module is used to draw at least a portion of the rendered content from the target off-screen page onto the target display page.
9. A list data processing device, characterized in that, The device includes a processor and a memory, the memory storing at least one instruction or at least one program, the at least one instruction or the at least one program being loaded and executed by the processor to implement the list data processing method as described in any one of claims 1 to 7.
10. A computer-readable storage medium, characterized in that, The storage medium stores at least one instruction or at least one program segment, which is loaded and executed by a processor to implement the list data processing method as described in any one of claims 1 to 7.