A page rendering method and device, a terminal device and a readable storage medium

By segmenting the page structure and using lazy loading, combined with runtime field binding and semantic pagination decisions, the performance bottleneck and rigid architecture of page rendering in existing technologies are solved, achieving efficient and flexible page rendering and layout.

CN120579522BActive Publication Date: 2025-12-05KINCHENG BANK OF TIANJIN CO LTD
View PDF 3 Cites 0 Cited by

Patent Information

Application Number
CN202511073198.0
Authority / Receiving Office
CN · China
Patent Type
Patents(China)
Current Assignee / Owner
Filing Date
2025-08-01
Publication Date
2025-12-05
Estimated Expiration
2045-08-01

AI Technical Summary

Technical Problem

Existing technologies suffer from performance bottlenecks, high memory consumption, high development costs, and unreasonable content pagination when dealing with complex and frequently interacting dynamic page scenarios, making it difficult to meet the needs of rapidly iterating business.

Method used

By segmenting the page structure information into blocks, combining the lazy loading mechanism to load the target data blocks on demand, generating structured rendering data using runtime field binding, and making pagination decisions based on content density and semantic information, a page rendering instruction set is constructed for drawing processing.

Benefits of technology

It significantly improves page rendering efficiency, reduces memory usage, enhances layout accuracy and form configuration flexibility, ensures logical and visual consistency in content segmentation, and adapts to dynamic changes in complex page structures.

✦ Generated by Eureka AI based on patent content.

Smart Images

  • Figure CN120579522B_ABST
    Figure CN120579522B_ABST
Patent Text Reader

Abstract

The application relates to the technical field of page rendering, and discloses a page rendering method and device, a terminal device and a readable storage medium. The page rendering method disclosed by the application obtains an initial data block set by performing block processing on page structure information of a page to be rendered; performs lazy loading processing on the initial data block set to obtain a target data block set; performs parameter analysis on the target data block set to generate structured rendering data; makes a paging decision according to the structured rendering data to obtain page paging information; constructs a page rendering instruction set according to the page paging information; and performs drawing processing based on the page rendering instruction set to generate a visual page rendering result. The page rendering method disclosed by the application effectively reduces memory occupation while improving the page rendering efficiency and the accuracy of cross-page layout.
Need to check novelty before this filing date? Find Prior Art

Description

Technical Field

[0001] This application relates to the field of page rendering technology, and in particular to a page rendering method, apparatus, terminal device, and readable storage medium. Background Technology

[0002] With the widespread application of online document processing and remote form interaction, page rendering technology plays a crucial role in various web applications and lightweight terminals. Existing page rendering solutions are mostly based on traditional PDF rendering engines or preset template systems, using static layout and full loading mechanisms. While these can meet the presentation needs of simple static content, they have gradually revealed a series of performance and flexibility bottlenecks when dealing with complex, frequently interacting dynamic page scenarios.

[0003] Specifically, current technologies suffer from the following problems: First, in rendering extremely long lists (such as datasets containing thousands of items), traditional PDF rendering engines generally suffer from performance bottlenecks, resulting in noticeable page lag during loading, and memory usage increases exponentially with data size, severely impacting system stability. Second, existing form filling solutions typically rely on pre-generated complete PDF templates, lacking a flexible mechanism for dynamic field insertion, making on-demand rendering difficult and limiting the adaptability and reusability of complex forms. Third, current mainstream pagination logic often employs a fixed page height segmentation strategy, lacking awareness of semantic boundaries and content density, leading to mechanically segmented content during pagination, easily causing issues such as broken list items and inconsistent page styles, affecting readability and layout aesthetics. Fourth, in existing solutions, parameter binding and rendering logic are deeply coupled; once field structure or style is updated, the rendering logic must be modified synchronously and recompiled and deployed, resulting in high development costs and long modification cycles, making it difficult to meet the needs of rapidly iterating business processes.

[0004] Therefore, how to efficiently render and structure long lists containing a large number of items in PDFs has become an important technical problem that urgently needs to be solved. Summary of the Invention

[0005] In view of this, embodiments of this application provide a page rendering method, apparatus, terminal device, and readable storage medium, which can effectively solve the performance bottlenecks and rigid architecture problems existing in long list scenarios of PDF protocol, thereby significantly improving document rendering efficiency, layout accuracy, and form configuration flexibility.

[0006] In a first aspect, embodiments of this application provide a page rendering method, including:

[0007] The page structure information of the page to be rendered is divided into blocks to obtain an initial set of data blocks;

[0008] Lazy loading is performed based on the initial set of data blocks to obtain the current set of target data blocks to be loaded.

[0009] The target data block set is subjected to parameter parsing processing to generate structured rendering data;

[0010] Based on the structured rendering data, pagination decision processing is performed to obtain page pagination information;

[0011] Based on the page pagination information, construct a page rendering instruction set;

[0012] The drawing process is performed based on the page rendering instruction set to generate a visual page rendering result.

[0013] In some embodiments, the page structure information of the page to be rendered is processed into blocks to obtain an initial data block set, including:

[0014] Obtain current window environment parameters and user interaction behavior characteristics from the page structure information;

[0015] The visible area of ​​the currently rendered content is determined based on the window environment parameters.

[0016] Based on the visible area and the user interaction behavior characteristics, a semantic unit-based partition is performed, and the resulting multiple data blocks are combined to form an initial data block set.

[0017] In some embodiments, the lazy loading process based on the initial data block set to obtain the current target data block set to be loaded includes:

[0018] The loading triggering conditions are determined based on the window environment parameters and the user interaction behavior characteristics.

[0019] When the loading triggering condition is met, a target data block that fits the current visible area is selected from the initial data block set;

[0020] Load the target data block and release the loaded data blocks that are not in the currently visible area to obtain a set of target data blocks.

[0021] In some embodiments, the parameter parsing process performed on the target data block set to generate structured rendering data includes:

[0022] Extract the placeholder field from the target data block set;

[0023] According to the preset field mapping rules, the placeholder field is subjected to runtime delayed binding processing to generate an intermediate rendering node associated with the page structure;

[0024] The structured rendering data is constructed based on the structural configuration information of the intermediate rendering nodes.

[0025] In some embodiments, the step of performing pagination decision processing based on the structured rendering data to obtain page pagination information includes:

[0026] Extract style feature information, content density information, and semantic association information from the structured rendering data to construct a pagination feature vector;

[0027] The pagination feature vector is input into the pagination prediction model for inference to determine the pagination boundary position;

[0028] The page pagination information is generated based on the pagination boundary position.

[0029] In some embodiments, constructing a page rendering instruction set based on the page pagination information includes:

[0030] Based on the page pagination information, determine the rendering content boundaries of each pagination area;

[0031] Based on the boundaries of the rendered content, the corresponding layout content is extracted from the structured rendered data, and layout parameters are generated.

[0032] A page rendering instruction set is constructed based on the layout parameters.

[0033] In some embodiments, the page rendering instruction set includes style attributes, position coordinates, and rendering order information for each content unit. The step of performing drawing processing based on the page rendering instruction set to generate a visual page rendering result includes:

[0034] The rendering instruction set is transmitted to the preset rendering interface module, and the style attributes, position coordinates and rendering order information contained in each instruction are parsed to obtain the parsing result;

[0035] Based on the parsing results, content drawing operations are performed sequentially in the corresponding pagination areas;

[0036] After completing the drawing operations for all pagination areas, a visual page rendering result is generated.

[0037] Secondly, embodiments of this application provide a page rendering apparatus, including:

[0038] The data processing module is used to divide the page structure information of the page to be rendered into blocks to obtain an initial set of data blocks;

[0039] The loading module is used to perform lazy loading based on the initial data block set to obtain the current target data block set to be loaded.

[0040] The data generation module is used to perform parameter parsing processing on the target data block set to generate structured rendering data;

[0041] The decision processing module is used to perform pagination decision processing based on the structured rendering data and obtain page pagination information;

[0042] The instruction construction module is used to construct a set of page rendering instructions based on the page pagination information.

[0043] The drawing module is used to perform drawing processing based on the page rendering instruction set and generate visual page rendering results.

[0044] Thirdly, embodiments of this application provide a terminal device, the terminal device including a processor and a memory, the memory storing a computer program, and the processor executing the computer program to implement the page rendering method of the first aspect described above.

[0045] Fourthly, embodiments of this application provide a computer-readable storage medium, wherein when the computer program is executed on a processor, it implements the page rendering method of the first aspect described above.

[0046] The embodiments of this application have the following beneficial effects: By segmenting the page structure information and combining it with a lazy loading mechanism triggered by the visible area, the preloading of invalid data is avoided, effectively reducing memory consumption during page rendering. Based on this, parameter parsing is performed on the target data block to generate structured rendering data, enabling the page structure to have good local update capabilities and significantly shortening the modification cycle. Furthermore, the pagination decision process constructs pagination criteria based on dimensions such as content density, style features, and semantic information, ensuring that pagination boundary division is more logical and readable, improving the accuracy of cross-page content segmentation, and avoiding problems such as content fragmentation and style inconsistencies. This application achieves collaborative optimization in multiple dimensions such as resource scheduling, data processing, and visual layout during page rendering, enabling better adaptation to complex page structures and thus real-time interactive updates and continuous multi-page display. Attached Figure Description

[0047] To more clearly illustrate the technical solutions of the embodiments of this application, the accompanying drawings used in the embodiments will be briefly introduced below. It should be understood that the following drawings only show some embodiments of this application and should not be regarded as a limitation of the scope. For those skilled in the art, other related drawings can be obtained based on these drawings without creative effort.

[0048] Figure 1 This diagram illustrates a frame diagram of a page rendering method according to an embodiment of this application.

[0049] Figure 2 A flowchart of a page rendering method according to an embodiment of this application is shown;

[0050] Figure 3 A schematic diagram of a page rendering method according to an embodiment of this application is shown. Detailed Implementation

[0051] The technical solutions in 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.

[0052] The components of the embodiments of this application described and illustrated in the accompanying drawings can be arranged and designed in a variety of different configurations. Therefore, the following detailed description of the embodiments of this application provided in the drawings is not intended to limit the scope of the claimed application, but merely to illustrate selected embodiments of the application. All other embodiments obtained by those skilled in the art based on the embodiments of this application without inventive effort are within the scope of protection of this application.

[0053] In the following text, the terms "comprising," "having," and their cognates, which may be used in various embodiments of this application, are intended only to indicate a particular feature, number, step, operation, element, component, or combination thereof, and should not be construed as primarily excluding the presence of one or more other features, numbers, steps, operations, elements, components, or combinations thereof, or adding the possibility of one or more combinations thereof. Furthermore, the terms "first," "second," "third," etc., are used only for distinguishing descriptions and should not be construed as indicating or implying relative importance.

[0054] Unless otherwise specified, all terms used herein (including technical and scientific terms) shall have the same meaning as commonly understood by one of ordinary skill in the art to which the various embodiments of this application pertain. Terms (such as those defined in commonly used dictionaries) shall be interpreted as having the same meaning as in their contextual meaning in the relevant technical field and shall not be construed as having an idealized or overly formal meaning, unless clearly defined in the various embodiments of this application.

[0055] The following detailed description of some embodiments of this application is provided in conjunction with the accompanying drawings. Unless otherwise specified, the following embodiments and features can be combined with each other.

[0056] Considering the performance bottlenecks and rigid architecture issues in long list scenarios using PDF protocols in existing technologies, this paper proposes a page rendering method. This method dynamically segments page structure information and uses a lazy loading mechanism to load target data blocks on demand, reducing memory consumption while improving loading efficiency. Furthermore, it employs runtime field binding to parse data parameters and generate structured rendering data, enhancing the flexibility and modularity of field rendering. Additionally, by constructing a semantically aware pagination decision model, it achieves reasonable division of content boundaries, improving the logical continuity and style consistency of cross-page layout. Finally, it executes rendering processing based on the generated rendering instruction set, resulting in a clear and consistent visual page output. This method can adapt to the dynamic changes of complex page structures while ensuring rendering performance.

[0057] The following examples illustrate the page rendering method.

[0058] In the page rendering method used in this embodiment, such as Figure 1 As shown, it follows a layered design architecture of data layer - logic layer - rendering layer:

[0059] The data layer is responsible for storing all the raw business data used for rendering. It is organized and accessed in JSON format. Structured information such as user tables and order tables will be encapsulated into standard JSON objects and made available for real-time access.

[0060] After receiving the page structure information, the logic layer dynamically parses the JSON data according to the field mapping table and constructs an instruction representation of the page structure through an Abstract Syntax Tree (AST), forming a set of transmittable PDF rendering instructions. The logic layer also undertakes algorithm execution tasks such as pagination prediction and typesetting calculation, and is the core control module connecting data and graphics rendering.

[0061] The rendering layer receives the set of instructions generated by the logic layer, calls the preset Canvas interface, and draws the page content item by item according to the instruction elements such as style attributes, position coordinates and rendering order, and finally generates the page rendering result that is visible to the user.

[0062] Figure 2 A flowchart of a page rendering method according to an embodiment of this application is shown. Exemplarily, the page rendering method includes the following steps:

[0063] Step S100: The page structure information of the page to be rendered is divided into blocks to obtain an initial data block set.

[0064] Page structure information refers to the structured data described by a PDF document or other electronic page source. It typically includes elements such as text paragraphs, headings, tables of contents, charts, and form fields, as well as their location, hierarchy, and style attributes on the page. This structure information can be extracted by parsing the PDF source file or using relevant APIs to facilitate visualization and rendering in subsequent steps.

[0065] By demonstrating how segmenting page structure information into blocks can divide continuous page content into multiple clearly defined data units, enabling lazy loading in subsequent steps and improving rendering efficiency.

[0066] In an optional embodiment, step S100 includes the following sub-steps:

[0067] S101, obtain the current window environment parameters and user interaction behavior characteristics from the page structure information.

[0068] Among these, window environment parameters refer to the visible area information on the current terminal device, typically including window size, scaling ratio, and display density, which can be dynamically obtained through the visible area API provided by the browser or rendering engine. User interaction behavior characteristics refer to the behavioral patterns of users when performing operations such as scrolling, hovering, or quickly swiping on the PDF page, including indicators such as scrolling speed, direction, and frame rate changes, which are usually collected in real time through the interaction event listening module on the front end of the PDF page. In addition, to adapt to the display needs of different terminals, the PDF page rendering window can be set to full screen, half screen, or a user-defined area. The system automatically plans the range of data to be loaded subsequently based on the pixel width and height information fed back by the API.

[0069] As an example, under the default strategy, the preset loading area is three times the height of the current viewport to ensure that users have sufficient buffer space when performing up / down scrolling operations, thereby achieving a smooth scrolling experience.

[0070] For example, when a user is detected to continuously scroll through multiple areas of a PDF page within 300 milliseconds, it can be determined as a high-frequency scrolling state. Combined with the current window size (e.g., 700px × 1100px), the subsequent data loading strategy and caching mechanism can be adjusted.

[0071] S102, determine the visible area of ​​the currently rendered content based on window environment parameters.

[0072] The visible area refers to the area of ​​page content that the user can actually see on the terminal's current display device, which is usually calculated in real time based on parameters such as window size, scaling ratio, and resolution.

[0073] As an example, when a size change is detected in the PDF interface being viewed by the user (e.g., switching from full screen to half screen), a recalculation logic will be triggered to redetermine the center area based on the latest visible window size. Using this center area as a reference, the loaded data blocks will be dynamically adjusted: if the currently loaded area is smaller than the adjusted default loading range (e.g., twice the number of data blocks before and after the center), the missing parts will be supplemented; if the currently loaded area exceeds the default range, redundant data blocks far from the current visible center will be released to maintain reasonable memory utilization and consistent user experience.

[0074] As an example, assuming the default loading area is three times the viewport size and the current viewport height is 1200px, the actual visible area is set to 1800px before and after each loading, for a total of 3600px, to cover the current page display area and the top and bottom pre-loaded areas.

[0075] S103, based on the visible area range and user interaction behavior characteristics, perform semantic unit-based partitioning, and form an initial data block set by the multiple partitioned data blocks.

[0076] Semantic units refer to the logical structural units that make up the page content, such as headings, body paragraphs, charts, and table of contents. Their boundaries are usually inferred from the hierarchical relationships, layout, or content type in the page structure information. This division process not only considers the semantic boundaries of the PDF document but also incorporates scroll behavior to adjust the chunk size, making the division more dynamic and adaptable.

[0077] As an example, when a user is detected scrolling quickly through a PDF page, the semantic units previously divided by paragraphs are merged into larger logical blocks to reduce the number of loads. For instance, if a normal block length is 800px, it can be dynamically expanded to 1600px as needed, and the corresponding start and end index areas are marked to form an initial set of data blocks.

[0078] Step S200: Perform lazy loading based on the initial data block set to obtain the current target data block set to be loaded.

[0079] Lazy loading refers to a dynamic scheduling mechanism that loads page content based on the display needs during the user's browsing process. This mechanism avoids loading all PDF page content at once, reduces the front-end rendering load, and thus improves page response efficiency.

[0080] By demonstrating lazy loading, it is possible to reduce unnecessary loading calculations while ensuring the smooth presentation of content (e.g., PDF files), thereby enabling on-demand retrieval and efficient rendering of page data.

[0081] In an optional embodiment, step S200 includes the following sub-steps:

[0082] S201, determine the loading trigger conditions based on window environment parameters and user interaction behavior characteristics.

[0083] Among them, the loading trigger condition refers to the trigger mechanism that determines whether to perform the new data block loading operation during the page rendering process. This determination is usually based on a comprehensive analysis of the current terminal's visible window parameters and the user's scrolling behavior characteristics.

[0084] As an example, the loading strategy is dynamically adjusted by monitoring the user's scrolling speed when browsing PDF pages: when the viewport completes rapid scrolling of multiple page areas within 500ms (e.g., loading three data blocks consecutively), a centralized loading is triggered; conversely, when the scrolling speed exceeds a set threshold (e.g., frame intervals are less than 16ms), data loading is paused until the user stops scrolling, at which point the required data is completed all at once. This rhythm-aware mechanism effectively avoids redundant loading of data blocks caused by high-frequency scrolling, further reducing memory pressure and improving response efficiency.

[0085] S202, when the loading trigger condition is met, select a target data block from the initial data block set that is compatible with the current visible area.

[0086] The target data block refers to a subset of data that is associated with the current user's operation location and is within the scope of the loading strategy.

[0087] As an example, a loading strategy centered on the current scroll position is adopted: by default, five times the content range of the current viewport is loaded, and the center area of ​​the visible PDF is kept in the middle of the loading range. When it is detected that the user continuously scrolls to the loading edge area, the new edge area is set as the new loading center, and two data blocks are loaded from the front and back sides respectively.

[0088] S203, load the target data block and release the loaded data blocks that are not currently in the visible area to obtain the target data block set.

[0089] Loading refers to transferring the target data block from the data source or memory into the rendering cache, so that it can be used for field parsing and rendering in subsequent steps. Releasing refers to removing loaded data blocks that are no longer within the visible area or outside the loading range from the rendering cache, in order to free up memory resources and maintain the controllability of the cache queue.

[0090] For example, if the data blocks loaded in the previous round included A, B, C, and D, and the database loaded in this round includes C, D, E, F, and G, then C, D, E, F, and G are kept in the cache, A and B are marked as inactive data blocks and then released, so that the updated target data set includes C, D, E, F, and G, to meet the requirement of continuous loading of content before and after the visible area.

[0091] Step S300: Perform parameter parsing processing on the target data block set to generate structured rendering data.

[0092] Among them, parameter parsing processing refers to the process of performing operations such as field extraction, field binding and semantic structure generation on the loaded PDF page structure data blocks. The aim is to establish a mapping relationship between the placeholder fields in the page and the content in the actual data source, and generate a data structure with semantic interpretability and renderability to drive pagination, layout and drawing in subsequent steps.

[0093] This step enables the dynamic fusion of data and templates, and generates rendering nodes based on the AST (Abstract Syntax Tree) structure, thereby effectively supporting efficient dynamic rendering of complex pages.

[0094] In an optional embodiment, step S300 includes the following sub-steps:

[0095] S301, Extract placeholder fields from the target data block set.

[0096] Placeholder fields are identifying character markers used in PDF page structure information to represent the value of a field in the data source. They are usually represented by special symbols (such as {{field name}}) and are used for data binding and template filling in PDF or HTML page templates.

[0097] For example, if the target data block contains a fragment like "Dear {{username}}, your bill amount is {{amount}} yuan", then the extracted set of placeholder fields will be ["username", "amount"]. These fields are registered as parsed items for use in the subsequent binding process.

[0098] S302, according to the preset field mapping rules, performs runtime delayed binding processing on the placeholder fields to generate intermediate rendering nodes associated with the page structure.

[0099] The field mapping table is a manually configurable format, supporting expression definition and linked configuration. To support the flexibility and scalability of this binding process, an Abstract Syntax Tree (AST) is constructed when parsing the PDF file structure. This AST represents the logical hierarchy and attribute relationships of various semantic nodes (such as paragraphs, placeholders, and block-level structures) in the PDF template. This AST not only supports pluggable operations at the instruction level but is also continuously updated, ensuring that the template does not need to be recompiled when placeholders are updated or form fields change, thus achieving dynamic decoupling between fields and structure. Finally, based on the bound set of rendering nodes, the system generates PDF page structure information for drawing and submits it to the rendering layer to perform content drawing on the Canvas.

[0100] For example, for the placeholder field {{username}}, the structured data "Zhang San" is matched in the field mapping table, and its horizontal position on the page is recorded as 150px, its vertical position as 220px, and its font size as 14pt, thereby generating a rendering node with content value, style information, and position information.

[0101] S303 constructs structured rendering data based on the structural configuration information of intermediate rendering nodes.

[0102] The structural configuration information includes attributes such as field position, rendering priority, and whether linkage completion is required.

[0103] As an example, for field groups with upstream and downstream logical relationships (such as the three-level linked fields of [Province]-[City]-[County]), when identifying placeholders, the dependencies between fields will be automatically identified based on the topological structure identifier in the mapping table. When the user only fills in a certain level field, other level fields will be intelligently filled in according to the rules to ensure the integrity of the form's semantics and logical consistency.

[0104] Step S400: Perform pagination decision processing based on structured rendering data to obtain page pagination information.

[0105] Pagination decision processing refers to predicting the pagination boundary positions of page content based on the generated structured rendering data, taking into account factors such as text density, style variations, and semantic continuity, and ultimately outputting the pagination information structure. This pagination information serves as the control basis for pagination rendering, ensuring the logical integrity and visual consistency of the page content.

[0106] In an optional embodiment, step S400 includes the following sub-steps:

[0107] S401 extracts style feature information, content density information, and semantic association information from the structured rendering data to construct a pagination feature vector.

[0108] The pagination feature vector includes style features such as font size, font color, and indentation to determine if there are formatting changes; content density information is the density of rendered nodes within a unit area to measure whether the page is too crowded; and semantic association information is used to determine the logical relationship between paragraphs and whether the theme is continuous, which can be determined by model or rule matching. These three types of information together constitute the pagination feature vector.

[0109] For example, if a PDF rendering data is used to extract a feature vector for the current pagination point, the feature vector is composed of a style similarity of 0.72, a content density of 6.0 elements / cm², and a semantic association marker of "non-continuous".

[0110] S402, input the pagination feature vector into the pagination prediction model for inference to determine the pagination boundary position.

[0111] As an example, the pagination prediction model is a multi-factor pagination decision model trained by machine learning, which can comprehensively consider multiple feature factors such as item density, style continuity, and semantic grouping to automatically determine the pagination boundary position.

[0112] Among them, item_density is used to measure the density of content items per unit area. When the density value is higher than a set threshold (such as 5 elements / cm²), it is considered a candidate point for pagination. style_continuity is used to evaluate the style consistency between adjacent elements. Its score is calculated based on the cosine similarity of features such as font, color, and indentation. The weight is set to 0.3 or 0.7 by default. semantic_grouping is used to determine whether there is semantic consistency between paragraphs. It can be achieved by topic analysis through NLP models (such as BERT) or by rule matching (such as "heading-paragraph spacing < 2cm").

[0113] In one optional implementation, to improve model adaptability, when it is detected that a user frequently scrolls or pauses before or after a PDF page boundary and experiences lag, the page will be identified as a potential misjudged sample and marked as a negative sample, triggering a model weight update mechanism to continuously optimize the accuracy and robustness of page boundary determination.

[0114] S403, Generate page pagination information based on the pagination boundary position.

[0115] Page pagination information refers to structured markup data containing the start and end positions of each page, content number, and page sequence number. It is used to control the rendering range and layout boundaries of each page. The pagination information will serve as a basic reference in the subsequent rendering instruction generation process, guiding content extraction and layout operations.

[0116] For example, if the pagination boundaries are 1380px and 2760px respectively, and the total page content height is 3600px, then the pagination information can be generated as follows: the content range of page 1 is from 0px to 1380px, the content range of page 2 is from 1380px to 2760px, and the content range of page 3 is from 2760px to 3600px. This pagination information structure will be used for subsequent layout control and rendering instruction generation.

[0117] Step S500: Construct a page rendering instruction set based on the page pagination information.

[0118] The page rendering instruction set refers to a structured set of rendering control commands used to guide the rendering layer in completing page drawing. It typically includes information such as text content, style parameters, position coordinates, and drawing order. Through this step, the abstract semantic structure can be transformed into executable drawing instructions for better page display.

[0119] In an optional embodiment, step S500 includes the following sub-steps:

[0120] S501, based on page pagination information, determines the rendering content boundaries of each pagination area.

[0121] The rendered content boundaries refer to the start and end positions of the content to be displayed within each pagination area, typically determined by the pagination start and end coordinates and the page content structure. The pagination information explicitly records the start and end pixel positions of each page, which serves as the basis for pagination content truncation.

[0122] For example, if the pagination information of a PDF page marks the start position of page 1 as 0 pixels and the end position as 1380 pixels, then the boundary of the rendered content of that page is the vertical range from 0 pixels to 1380 pixels.

[0123] S502 extracts the corresponding layout content from the structured rendering data based on the rendering content boundary and generates layout parameters.

[0124] The layout content refers to the text paragraphs, graphic components, or structural blocks that fall within the current rendering boundary, and usually includes information such as content values, style attributes, and paragraph structure; the layout parameters refer to the page drawing parameters calculated based on the extracted content, such as relative position, line height, and alignment, which are used to precisely control the layout effect of each element in the rendered page.

[0125] As an example, two text nodes and a chart component are extracted from the rendering area of ​​page 1. Fields such as their starting position, line spacing, and font size are read, and their relative arrangement order in the pagination area is calculated. Finally, a set of layout parameters is generated, including but not limited to paragraph starting position (y=120px, y=360px), font size (14pt), content block height (240px), etc.

[0126] S503 constructs a page rendering instruction set based on layout parameters.

[0127] The page rendering instruction set refers to the structured drawing commands used to control the rendering layer to execute graphic and text drawing. It typically includes fields such as content type (text or graphics), display value, drawing coordinates, style control information, and drawing order number.

[0128] As an example, for a text content of "Dear Zhang San" to be rendered, the following drawing instructions are generated based on the layout parameters: drawing type is text, value is "Dear Zhang San", position coordinates are (x=150px, y=220px), font size is 14pt, color is #000000, and drawing order number is 5. Multiple instructions are arranged into an ordered instruction set according to the drawing order and transmitted to the rendering module to achieve the final presentation of the page.

[0129] Step S600: Perform drawing processing based on the page rendering instruction set to generate a visual page rendering result.

[0130] The drawing process refers to the process of passing the rendering instruction set to the rendering layer, calling the page rendering interface, and completing the drawing of text and graphics on the target canvas item by item according to preset styles and positions. This drawing operation is performed on a per-page basis to ensure the continuity of layout and visual consistency of the content on each page. The page rendering result refers to the visual PDF page content that the user finally sees on the interface, including a complete view composed of text, graphics, structural elements, etc.

[0131] By performing this step, the transformation from structured instructions to image rendering can be achieved, completing the final rendering of the page.

[0132] In an optional embodiment, step S600 includes the following sub-steps:

[0133] S601 transmits the rendering instruction set to the preset rendering interface module, parses the style attributes, position coordinates and rendering order information contained in each instruction, and obtains the parsing result.

[0134] The rendering interface module is a functional module used to receive and execute page drawing commands. It is usually encapsulated in the browser rendering engine or a dedicated Canvas graphics interface. Style attributes include font, font size, color, weight, alignment, etc. Position coordinates represent the absolute or relative drawing position of the rendering unit on the page. Rendering order information is used to identify the drawing sequence relationship between multiple instructions.

[0135] For example, for a rendering instruction "Draw text 'Welcome', font 14pt, color #333333, position (x=100, y=80), sequence number 3", its content attribute will be parsed as text, style is 14pt font, dark gray, drawing position is (100, 80), sequence is the third item, and this result will be added to the drawing queue.

[0136] S602, based on the parsing results, perform content drawing operations sequentially in the corresponding pagination areas.

[0137] The content rendering operation refers to mapping the parsed rendering information onto the canvas area item by item according to the page pagination structure, thus completing the actual rendering of the text and image content. The pagination area is defined by the aforementioned pagination information, and each pagination segment corresponds to an independent rendering area. The rendering operation must maintain the layout specifications within the pagination boundaries.

[0138] As an example, within the pagination range corresponding to page 2 (starting position 1380px, ending position 2760px), the rendering queue contains 6 rendering instructions, which are executed one by one in numerical order: the first item is the paragraph title, the second to fifth items are the body paragraphs, and the sixth item is the chart element, ensuring that the content is fully presented within the page range.

[0139] S603 generates a visual page rendering result after completing the drawing operation of all pagination areas.

[0140] Among them, the visual page rendering result refers to the final page image with visual display effect formed after all the content in the pagination area is drawn. This result can be used in various forms such as user interface display, printing output or file export.

[0141] As an example, once all pagination areas have been drawn, the canvas content of each page is merged into a complete multi-page view. The final rendered result can be used for front-end display, ensuring that the page structure is correct, the layout is clear, and the content is complete when the user browses.

[0142] Figure 3 A schematic diagram of a page rendering apparatus according to an embodiment of this application is shown. Exemplarily, the page rendering apparatus 100 includes:

[0143] The data processing module 110 is used to divide the page structure information of the page to be rendered into blocks to obtain an initial data block set;

[0144] Loading module 120 is used to perform lazy loading based on the initial data block set to obtain the current target data block set to be loaded;

[0145] Data generation module 130 is used to perform parameter parsing processing on the target data block set to generate structured rendering data;

[0146] Decision processing module 140 is used to perform pagination decision processing based on the structured rendering data and obtain page pagination information;

[0147] The instruction construction module 150 is used to construct a page rendering instruction set based on the page pagination information;

[0148] The drawing module 160 is used to perform drawing processing based on the page rendering instruction set and generate a visual page rendering result.

[0149] It is understood that the apparatus of this embodiment corresponds to the method of the above embodiments, and the options in the above embodiments are also applicable to this embodiment, so they will not be described again here.

[0150] This application also provides a terminal device, exemplary of which includes a processor and a memory, wherein the memory stores a computer program, and the processor executes the computer program to enable the terminal device to perform the functions of the various modules in the above-described method or apparatus.

[0151] The processor can be an integrated circuit chip with signal processing capabilities. The processor can be a general-purpose processor, including at least one of a Central Processing Unit (CPU), Graphics Processing Unit (GPU), Network Processor (NP), Digital Signal Processor (DSP), Application-Specific Integrated Circuit (ASIC), Field-Programmable Gate Array (FPGA), or other programmable logic devices, discrete gate or transistor logic devices, or discrete hardware components. The general-purpose processor can be a microprocessor or any conventional processor, capable of implementing or executing the methods, steps, and logic block diagrams disclosed in the embodiments of this application.

[0152] The memory can be, but is not limited to, Random Access Memory (RAM), Read Only Memory (ROM), Programmable Read-Only Memory (PROM), Erasable Programmable Read-Only Memory (EPROM), Electrically Erasable Programmable Read-Only Memory (EEPROM), etc. The memory is used to store computer programs, and the processor can execute the computer programs accordingly after receiving execution instructions.

[0153] This application also provides a computer-readable storage medium for storing the computer program used in the aforementioned terminal device. For example, the computer-readable storage medium may include, but is not limited to, various media capable of storing program code, such as a USB flash drive, a portable hard drive, a read-only memory (ROM), a random access memory (RAM), a magnetic disk, or an optical disk.

[0154] In the several embodiments provided in this application, it should be understood that the disclosed apparatus and methods can also be implemented in other ways. The apparatus embodiments described above are merely illustrative. For example, the flowcharts and block diagrams in the accompanying drawings show the architecture, functionality, and operation of possible implementations of apparatus, methods, and computer program products according to various embodiments of this application. In this regard, each block in a flowchart or block diagram may represent a module, segment, or portion of code containing one or more executable instructions for implementing a specified logical function. It should also be noted that, in alternative implementations, the functions marked in the blocks may occur in a different order than those marked in the drawings. For example, two consecutive blocks may actually be executed substantially in parallel, and they may sometimes be executed in reverse order, depending on the functions involved. It should also be noted that each block in the block diagram and / or flowchart, and combinations of blocks in the block diagram and / or flowchart, can be implemented using a dedicated hardware-based system that performs the specified function or action, or using a combination of dedicated hardware and computer instructions.

[0155] In addition, the functional modules or units in the various embodiments of this application can be integrated together to form an independent part, or each module can exist independently, or two or more modules can be integrated to form an independent part.

[0156] If the aforementioned functions are implemented as software functional modules and sold or used as independent products, they can be stored in a computer-readable storage medium. Based on this understanding, the technical solution of this application, in essence, or the part that contributes to the prior art, or a part of the technical solution, can be embodied in the form of a software product. This computer software product is stored in a storage medium and includes several instructions to cause a computer device (which may be a smartphone, personal computer, server, or network device, etc.) to execute all or part of the steps of the methods described in the various embodiments of this application.

[0157] The above description is merely a specific embodiment of this application, but the scope of protection of this application is not limited thereto. Any changes or substitutions that can be easily conceived by those skilled in the art within the scope of the technology disclosed in this application should be included within the scope of protection of this application.

Claims

1. A method of rendering a page, the method comprising: The method comprises: performing block processing on page structure information of a page to be rendered to obtain an initial data block set; performing lazy loading processing based on the initial data block set to obtain a target data block set to be loaded, comprising: determining a loading trigger condition according to a view window environment parameter and a user interaction behavior feature in the page structure information; wherein the loading trigger condition is dynamically adjusted based on a user interaction rhythm and a preset threshold, and a loading buffer range is associated with a view window size in a preset proportion; when the loading trigger condition is met, selecting a target data block that adapts to a current visible region from the initial data block set; loading the target data block and releasing loaded data blocks that are not in the current visible region to obtain a target data block set; wherein the releasing process executes a delayed release strategy based on user historical interaction records; extracting a placeholder field in the target data block set; wherein the extraction process synchronously constructs a field dependency topology; performing runtime delay binding processing on the placeholder field according to a preset field mapping rule to generate an intermediate rendering node associated with page structure; wherein the intermediate rendering node is constructed based on an abstract syntax tree; constructing structured rendering data according to structure configuration information of the intermediate rendering node; extracting style feature information, content density information and semantic association information in the structured rendering data to construct a page feature vector; inputting the page feature vector into a multi-factor page decision model for reasoning to determine a page boundary position; wherein the multi-factor page model is used to determine a page boundary position according to item density, style continuity and semantic grouping; the multi-factor page model is also used to mark a corresponding page sample when it is detected that a user has a preset frequency of interaction behavior before and after the page boundary to trigger model weight updating; generating page pagination information according to the page boundary position; constructing a page rendering instruction set according to the page pagination information; performing drawing processing based on the page rendering instruction set to generate a visual page rendering result.

2. The page rendering method of claim 1, wherein, The method comprises: obtaining a current view window environment parameter and a user interaction behavior feature from the page structure information; determining a visible region range of current rendering content based on the view window environment parameter; performing semantic unit-based division according to the visible region range and the user interaction behavior feature to form an initial data block set from the divided data blocks.

3. The page rendering method of claim 1, wherein, The method comprises: determining rendering content boundaries of each page region based on the page pagination information; extracting corresponding layout content from the structured rendering data based on the rendering content boundaries and generating layout parameters; constructing a page rendering instruction set according to the layout parameters.

4. The page rendering method of claim 3, wherein, The page rendering instruction set comprises style attributes, position coordinates and rendering order information of each content unit, and the method comprises: The rendering instruction set is transmitted to a preset rendering interface module, and the style attribute, the position coordinate and the rendering sequence information contained in each instruction are parsed to obtain a parsing result; According to the parsing result, content drawing operations are sequentially performed in the corresponding pagination area; After completing the drawing operations of all pagination areas, a visual page rendering result is generated.

5. A page rendering apparatus characterized by comprising: Comprise: A data processing module for block processing page structure information of a page to be rendered to obtain an initial data block set; A loading module for determining a loading trigger condition based on a view window environment parameter and a user interaction behavior feature in the page structure information; wherein the loading trigger condition is dynamically adjusted based on a user interaction rhythm and a preset threshold, and a loading buffer range is associated with a view window size in a preset proportion; When the loading trigger condition is met, a target data block that adapts to a current visible area is selected from the initial data block set; The target data block is loaded, and loaded data blocks that are not in the current visible area are released to obtain a target data block set; wherein the release process executes a delayed release strategy based on user historical interaction records; A data generation module for extracting placeholder fields in the target data block set; wherein the extraction process synchronously constructs a field dependency topology; According to a preset field mapping rule, the placeholder fields are subjected to runtime delay binding processing to generate intermediate rendering nodes associated with page structures; wherein the intermediate rendering nodes are constructed based on abstract syntax trees; According to structure configuration information of the intermediate rendering nodes, structured rendering data is constructed; A decision processing module for extracting style feature information, content density information and semantic association information in the structured rendering data to construct a pagination feature vector; The pagination feature vector is input into a multi-factor pagination decision model for inference to determine a pagination boundary position; wherein the multi-factor pagination model is used to determine the pagination boundary position according to item density, style continuity and semantic grouping; the multi-factor pagination model is also used to detect a preset frequency interaction behavior of a user before and after the pagination boundary, mark the corresponding pagination sample to trigger model weight updating; According to the pagination boundary position, the page pagination information is generated; An instruction construction module for constructing a page rendering instruction set according to the page pagination information; A drawing module for performing drawing processing based on the page rendering instruction set to generate a visual page rendering result.

6. A terminal device, characterized by comprising: The terminal device comprises a processor and a memory, the memory stores a computer program, and the processor is configured to execute the computer program to implement the page rendering method of any one of claims 1-4.

7. A computer readable storage medium characterized in that, It stores a computer program, and the computer program is executed on a processor to implement the page rendering method according to any one of claims 1-4.

Citation Information

Patent Citations

  • Rapid paging display method based on big data

    CN117271930A

  • Method and system for printing browser content

    CN118170332A

  • Page rendering method, page rendering device, electronic equipment and readable storage medium

    CN119493929A