Page rendering method and device, terminal equipment and readable storage medium
By chunking and lazy loading of the page structure, and paging decisions based on content density and semantic information, the problems of low rendering efficiency and high memory usage in the existing technology are solved, and efficient and flexible page rendering and paging processing are achieved.
Patent Information
- Application Number
- CN202511073198.0
- Authority / Receiving Office
- CN · China
- Patent Type
- Applications(China)
- Current Assignee / Owner
- Filing Date
- 2025-08-01
- Publication Date
- 2025-09-02
- Estimated Expiration
- 2045-08-01
AI Technical Summary
The existing technology has problems such as performance bottlenecks, high memory usage, large development costs, and unreasonable paging logic when dealing with dynamic page scenarios with complex structures and frequent interactions, making it difficult to achieve efficient rendering and flexible configuration.
By chunking the page structure information, combining the lazy loading mechanism, structured rendering data is generated, and paging decisions are made based on content density and semantic information, page rendering instruction set is constructed, and visual page rendering results are finally generated.
It significantly improves rendering efficiency, reduces memory usage, shortens modification cycles, improves the logic of paging boundaries and content continuity, and ensures page flexibility and readability.
Smart Images

Figure CN120579522A_ABST
Abstract
Description
Technical Field
[0001] The present 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 Art
[0002] With the widespread adoption of online document processing and remote form interaction, page rendering technology plays a key 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-load processing mechanisms. While these solutions can meet the presentation requirements of simple static content, they gradually expose a series of performance and flexibility bottlenecks when handling dynamic page scenarios with complex structures and frequent interactions.
[0003] Specifically, the current technology has the following problems: First, in the rendering process of extremely long lists (such as data sets containing thousands of items), traditional PDF rendering engines generally have performance bottlenecks, and the page will experience obvious lag when loading. In addition, memory usage increases exponentially with the data size, seriously affecting system stability; Second, existing form filling solutions usually rely on pre-generated complete PDF templates, lack a flexible field dynamic insertion mechanism, and are difficult to achieve on-demand rendering, which limits the adaptability and reusability of complex forms; Third, the current mainstream paging logic mostly adopts a fixed page high segmentation strategy, which lacks the ability to perceive semantic boundaries and content density, resulting in mechanical cutting of content during paging, which is prone to problems such as list item breakage and cross-page style imbalance, affecting reading coherence and layout aesthetics; Fourth, the parameter binding and rendering logic in the existing solution are deeply coupled. Once the field structure or style is updated, the rendering logic needs to be modified synchronously and recompiled and deployed. The development cost is high and the modification cycle is long, making it difficult to meet the business needs of rapid iteration.
[0004] Therefore, how to efficiently render and structure long lists containing a large number of items in PDF has become an important technical problem that needs to be solved urgently. Summary of the Invention
[0005] In view of this, the embodiments of the present application provide a page rendering method, apparatus, terminal device and readable storage medium, which can effectively solve the performance bottlenecks and architectural rigidity problems existing in the long list scenario of the PDF protocol, thereby significantly improving document rendering efficiency, typesetting accuracy and form configuration flexibility.
[0006] In a first aspect, an embodiment of the present application provides a page rendering method, comprising: The page structure information of the page to be rendered is divided into blocks to obtain an initial data block set; Perform lazy loading based on the initial data block set to obtain the target data block set that needs to be loaded; Performing parameter parsing on the target data block set to generate structured rendering data; Performing paging decision processing based on the structured rendering data to obtain page paging information; Constructing a page rendering instruction set according to the page paging information; Rendering is performed based on the page rendering instruction set to generate a visual page rendering result.
[0007] In some embodiments, performing block processing on the page structure information of the page to be rendered to obtain an initial data block set includes: Acquire current window environment parameters and user interaction behavior characteristics from the page structure information; Determine the visible area range of the current rendering content based on the window environment parameters; Semantic unit-based division is performed according to the visible area range and the user interaction behavior characteristics, and multiple data blocks obtained by the division are formed into an initial data block set.
[0008] In some embodiments, performing lazy loading based on the initial data block set to obtain a target data block set currently to be loaded includes: Determining a loading trigger condition according to the window environment parameters and the user interaction behavior characteristics; When the loading trigger condition is met, selecting a target data block that is adapted to the current visible area from the initial data block set; The target data block is loaded, and the loaded data blocks that are not in the current visible area are released to obtain a target data block set.
[0009] In some embodiments, performing parameter parsing on the target data block set to generate structured rendering data includes: Extracting a placeholder field from the target data block set; According to a preset field mapping rule, performing runtime delayed binding processing on the placeholder field to generate an intermediate rendering node associated with the page structure; The structured rendering data is constructed according to the structural configuration information of the intermediate rendering node.
[0010] In some embodiments, performing paging decision processing based on the structured rendering data to obtain page paging information includes: Extracting style feature information, content density information, and semantic association information from the structured rendering data to construct a paging feature vector; Inputting the paging feature vector into a paging prediction model for reasoning to determine the paging boundary position; The page paging information is generated according to the page boundary position.
[0011] In some embodiments, constructing a page rendering instruction set according to the page paging information includes: Determining the rendering content boundary of each paging area based on the page paging information; Based on the rendering content boundary, extracting corresponding layout content from the structured rendering data and generating layout parameters; Construct a page rendering instruction set according to the layout parameters.
[0012] In some embodiments, the page rendering instruction set includes style attributes, position coordinates, and rendering order information of each content unit. The rendering process based on the page rendering instruction set to generate a visual page rendering result includes: Transmitting the rendering instruction set to a preset rendering interface module, parsing the style attributes, the position coordinates, and the rendering order information contained in each instruction to obtain a parsing result; According to the analysis result, content drawing operations are performed in sequence in the corresponding paging areas; After completing the drawing operations of all paging areas, a visual page rendering result is generated.
[0013] In a second aspect, an embodiment of the present application provides a page rendering device, comprising: The data processing module is used to process the page structure information of the page to be rendered into blocks to obtain an initial data block set; A loading module is used to perform lazy loading processing based on the initial data block set to obtain the target data block set currently to be loaded; A data generation module, configured to perform parameter parsing on the target data block set to generate structured rendering data; A decision processing module, configured to perform paging decision processing based on the structured rendering data and obtain page paging information; An instruction construction module, used to construct a page rendering instruction set according to the page paging information; The drawing module is used to perform drawing processing based on the page rendering instruction set to generate a visual page rendering result.
[0014] In a third aspect, an embodiment of the present application provides a terminal device, comprising a processor and a memory, wherein the memory stores a computer program, and the processor is configured to execute the computer program to implement the page rendering method of the first aspect.
[0015] In a fourth aspect, an embodiment of the present application provides a computer-readable storage medium, and when the computer program is executed on a processor, the page rendering method of the first aspect described above is implemented.
[0016] The embodiments of the present application have the following beneficial effects: by processing the page structure information in blocks and combining the visual area to trigger the lazy loading mechanism, the preloading of invalid data is avoided, and the memory usage during the page rendering process is effectively reduced. On this basis, parameter parsing is performed on the target data block and structured rendering data is generated, so that the page structure has good local update capabilities, which significantly shortens the modification cycle. In addition, in the paging decision process, the paging basis is constructed based on dimensions such as content density, style features and semantic information to ensure that the paging boundary division is more logical and readable, improve the accuracy of cross-page content segmentation, and avoid problems such as content fragmentation and style confusion. The present application realizes the collaborative optimization of multiple dimensions such as resource scheduling, data processing and visual layout in the page rendering process, which can better adapt to complex page structures, thereby performing real-time interactive updates and continuous display of multiple pages. BRIEF DESCRIPTION OF THE DRAWINGS
[0017] In order to more clearly illustrate the technical solutions of the embodiments of the present application, the following is a brief introduction to the drawings required for use in the embodiments. It should be understood that the following drawings only show certain embodiments of the present application and therefore should not be regarded as limiting the scope. For ordinary technicians in this field, other relevant drawings can be obtained based on these drawings without creative work.
[0018] Figure 1 A framework diagram of a page rendering method in an embodiment of the present application is shown; Figure 2 A flow chart of a page rendering method in an embodiment of the present application is shown; Figure 3 A structural diagram of a page rendering method in an embodiment of the present application is shown. DETAILED DESCRIPTION
[0019] The technical solutions in the embodiments of the present application will be described clearly and completely below in conjunction with the drawings in the embodiments of the present application. Obviously, the described embodiments are only part of the embodiments of the present application, rather than all the embodiments.
[0020] The components of the embodiments of the present application generally described and illustrated in the drawings herein may be arranged and designed in a variety of different configurations. Therefore, the following detailed description of the embodiments of the present application provided in the drawings is not intended to limit the scope of the claimed application, but rather merely represents selected embodiments of the present application. All other embodiments obtained by those skilled in the art based on the embodiments of the present application without creative effort are within the scope of protection of the present application.
[0021] Hereinafter, the terms "including", "having" and their cognates used in various embodiments of the present application are intended only to indicate specific features, numbers, steps, operations, elements, components or combinations of the aforementioned items, and should not be understood as excluding the existence of one or more other features, numbers, steps, operations, elements, components or combinations of the aforementioned items or adding the possibility of one or more features, numbers, steps, operations, elements, components or combinations of the aforementioned items. In addition, the terms "first", "second", "third" and the like are only used to distinguish descriptions and should not be understood as indicating or implying relative importance.
[0022] Unless otherwise defined, all terms used herein (including technical and scientific terms) have the same meaning as commonly understood by those skilled in the art to which the various embodiments of the present application belong. The terms (such as those defined in generally used dictionaries) will be interpreted as having the same meaning as in the context of the relevant technical field and will not be interpreted as having an idealized meaning or an overly formal meaning unless clearly defined in the various embodiments of the present application.
[0023] The following describes some embodiments of the present application in detail with reference to the accompanying drawings. In the absence of conflict, the following embodiments and features in the embodiments may be combined with each other.
[0024] Considering the performance bottlenecks and architectural rigidity of existing technologies in PDF protocol long list scenarios, a page rendering method is proposed. By dynamically partitioning page structure information and incorporating a lazy loading mechanism to load target data blocks on demand, this method reduces memory consumption while improving loading efficiency. Furthermore, runtime field binding is used to parse data parameters and generate structured rendering data, enhancing the flexibility and modularity of field rendering. Furthermore, a semantically aware paging decision model is constructed to rationally demarcate content boundaries, improving the logical continuity and style consistency of cross-page layout. Finally, rendering is performed based on the generated rendering instruction set, resulting in clear and consistent visual page output. This method can adapt to the dynamic changes of complex page structures while maintaining rendering performance.
[0025] The page rendering method is described below with reference to some specific embodiments.
[0026] In the page rendering method adopted in this embodiment, Figure 1 As shown, it follows the layered design architecture of data layer-logic layer-rendering layer: The data layer is responsible for storing all raw business data used for rendering, and is organized and accessed in JSON format. For example, structured information such as user tables and order tables will be encapsulated as standard JSON objects and provided in real time.
[0027] 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 using an abstract syntax tree (AST), forming a transferable set of PDF rendering instructions. The logic layer also executes algorithms such as paging prediction and typesetting calculation, serving as the core control module connecting data and graphics rendering.
[0028] The rendering layer receives the instruction set generated by the logic layer, calls the preset Canvas interface, 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 visible to the user.
[0029] Figure 2 A flow chart of a page rendering method according to an embodiment of the present application is shown. Exemplarily, the page rendering method includes the following steps: Step S100 : dividing the page structure information of the page to be rendered into blocks to obtain an initial data block set.
[0030] 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, titles, tables of contents, charts, form fields, and their position on the page, hierarchical relationships, and style attributes. This structure information can be extracted by parsing the PDF source file or using related APIs to facilitate visualization and rendering in subsequent steps.
[0031] Exemplarily, by performing block processing on the page structure information, continuous page content can be divided into multiple data units with clear boundaries, so as to perform lazy loading processing in subsequent steps and improve rendering efficiency.
[0032] In an optional embodiment, step S100 includes the following sub-steps: S101, obtaining current window environment parameters and user interaction behavior characteristics from page structure information.
[0033] Among them, the window environment parameters refer to the visible area information on the current terminal device, usually including window size, zoom ratio and display density, etc., which can be dynamically obtained through the visible area API provided by the browser or rendering engine. User interaction behavior characteristics refer to the behavior pattern when the user performs operations such as scrolling, pausing or fast sliding on the PDF page, including indicators such as scrolling speed, direction, frame rate change, etc., which are usually collected in real time through the interactive event monitoring module at the front end of the PDF page. In addition, in order to adapt to the display requirements of different terminals, the PDF page rendering window can also be set to full screen, half screen or user-defined area. The system automatically plans the data range for subsequent loading based on the pixel width and height information fed back by the API.
[0034] Exemplarily, under the default policy, the preset loading area is three times the height of the current window to ensure that there is enough buffer area when the user performs up / down scrolling operations, thereby achieving a smooth scrolling experience.
[0035] For example, when it is detected that the user continuously slides multiple PDF page areas within 300 milliseconds, it can be determined as a high-frequency scrolling state, and combined with the current window size (such as 700px×1100px), the subsequent data loading strategy and caching mechanism can be adjusted.
[0036] S102: Determine the visible area range of the current rendering content based on the window environment parameters.
[0037] The visible area refers to the page content area that is actually visible to the user on the current display device of the terminal, and is usually calculated in real time based on parameters such as the window size, zoom ratio, and resolution.
[0038] For example, when it is detected that the size of the PDF interface browsed by the user has changed (for example, switching from full screen to half screen), the recalculation logic will be triggered, and the center area will be re-determined according to the latest visible window size. With 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 (for example, twice the data blocks before and after the center), the missing part will be supplemented; if the currently loaded area exceeds the default range, the redundant data blocks away from the current visible center will be released to maintain reasonable memory utilization and user experience consistency.
[0039] For example, assuming that the default loading area is three times the window size and the current window height is 1200px, the actual visible area range is set to 1800px for the front and back loads, and the total range is 3600px, which is used to cover the current page display area and the upper and lower preloading areas.
[0040] S103 , performing division based on semantic units according to the visible area range and the user interaction behavior characteristics, and forming an initial data block set from the multiple data blocks obtained by the division.
[0041] Semantic units are the logical structural units that make up page content, such as title segments, body paragraphs, chart units, and table of contents blocks. Their boundaries are typically inferred from the hierarchical relationships, layout format, or content type in the page structure information. This segmentation process not only considers the semantic boundaries of the PDF document but also adjusts the chunk size based on scrolling behavior, making the segmentation more dynamic and adaptable.
[0042] For example, if the user is detected scrolling quickly through the PDF page, the semantic units originally divided by paragraphs are merged into larger logical blocks to reduce loading times. For example, if the normal block length is 800px, it can be dynamically expanded to 1600px based on the situation, and the corresponding start and end index areas are marked to form the initial data block set.
[0043] Step S200 , performing lazy loading processing based on the initial data block set, and obtaining the target data block set that currently needs to be loaded.
[0044] Among them, lazy loading processing refers to a dynamic scheduling mechanism for loading page structure content according to the display requirements during user browsing operations. This mechanism can avoid loading all PDF page content at once, reduce the front-end rendering load, and thus improve page response efficiency.
[0045] Exemplarily, by performing lazy loading processing, it is possible to reduce unnecessary loading calculations while ensuring smooth presentation of content (eg, PDF files), thereby achieving on-demand acquisition and efficient rendering of page data.
[0046] In an optional embodiment, step S200 includes the following sub-steps: S201, determining a loading trigger condition according to window environment parameters and user interaction behavior characteristics.
[0047] The loading trigger condition refers to a trigger mechanism for determining whether a new data block loading operation needs to be executed 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.
[0048] For example, the loading strategy is dynamically adjusted by monitoring the user's scrolling speed while browsing PDF pages: when the viewport detects rapid scrolling of multiple page areas within 500ms (for example, loading three data blocks in a row), a centralized loading is triggered. If the scrolling speed exceeds a set threshold (for example, the frame interval is less than 16ms), data loading is suspended, and the required data is then completed in a centralized manner after the user stops scrolling. This rhythm-sensing mechanism effectively avoids redundant data block loading caused by high-frequency scrolling, further reducing memory pressure and improving responsiveness.
[0049] S202 : When a loading trigger condition is met, a target data block that is adapted to the current visible area is selected from the initial data block set.
[0050] The target data block refers to the data subset associated with the current user operation location and located within the coverage of the loading strategy.
[0051] For example, a loading strategy centered around the current scroll position is used: by default, the content range is loaded five times the current viewport, and the visible PDF center area is kept in the middle of the loading range. When 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.
[0052] S203: Load target data blocks and release loaded data blocks that are not in the current visible area to obtain a target data block set.
[0053] Loading refers to transferring target data blocks from a data source or memory into the render buffer, facilitating field parsing and rendering in subsequent steps. Releasing refers to removing loaded data blocks from the render buffer that are no longer visible and outside the loading range, freeing up memory resources and maintaining controllability of the cache queue.
[0054] For example, if the data blocks loaded in the previous round include 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 will be kept in the cache, and A and B will be 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 continuous loading requirements of the content before and after the visible area.
[0055] Step S300 : performing parameter parsing processing on the target data block set to generate structured rendering data.
[0056] Among them, parameter parsing processing refers to the process of performing field extraction, field binding, and semantic structure generation on the loaded PDF page structure data block. It aims 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 rendering capabilities to drive the paging, typesetting and drawing in subsequent steps.
[0057] Through this step, the dynamic fusion of data and templates can be achieved, and rendering nodes based on the AST (abstract syntax tree) structure can be generated, thereby effectively supporting efficient dynamic rendering of complex pages.
[0058] In an optional embodiment, step S300 includes the following sub-steps: S301: extracting placeholder fields from a target data block set.
[0059] Among them, a placeholder field refers to an identifying character tag used to represent a field value in a data source in the PDF page structure information. It is usually represented by a special symbol (such as {{field name}}) and is used for data binding and template filling in page templates such as PDF or HTML.
[0060] For example, if the target data block contains the following fragment: "Dear {{username}}, your bill amount is {{amount}} yuan", the extracted placeholder field set is ["username", "amount"]. These fields are registered as items to be resolved for use in the subsequent binding process.
[0061] S302 : Perform runtime delayed binding processing on the placeholder field according to a preset field mapping rule to generate an intermediate rendering node associated with the page structure.
[0062] Among them, the field mapping table is in a manually configurable format and supports expression definition and linkage configuration. To support the flexibility and scalability of the binding process, its AST (abstract syntax tree) is constructed when parsing the PDF file structure to represent the logical hierarchy and attribute relationships of each semantic node in the PDF template (such as paragraphs, placeholders, block-level structures, etc.). This syntax tree not only supports pluggable operations at the instruction level, but also can be continuously updated to ensure that the template does not need to be recompiled when the placeholder is updated or the form field changes, thereby achieving dynamic decoupling of fields and structures; finally, based on the bound rendering node set, the system generates PDF page structure information for drawing and submits it to the rendering layer to perform content drawing on the Canvas.
[0063] For example, for the placeholder field {{username}}, it is matched to the structured data "Zhang San" in the field mapping table, and its horizontal position on the page is recorded as 150px, vertical position is 220px, and font size is 14pt, thereby generating a rendering node with content value, style information and position information.
[0064] S303: Constructing structured rendering data according to the structural configuration information of the intermediate rendering node.
[0065] Among them, the structural configuration information includes attribute information such as field location, rendering priority, and whether linkage completion is required.
[0066] For example, for field groups with upstream and downstream logical associations (such as the three-level linkage fields of [Province] - [City] - [County]), when identifying placeholders, the dependency relationship between fields will be automatically identified based on the topological structure identifier in the mapping table, and when the user only fills in a certain level of fields, the other levels of fields will be intelligently backfilled according to the rules to ensure the semantic integrity and logical consistency of the form.
[0067] Step S400: Perform paging decision processing based on the structured rendering data to obtain page paging information.
[0068] Paging decision processing involves predicting page boundaries based on generated structured rendering data, taking into account factors such as text density, style variations, and semantic continuity, and ultimately outputting a paging information structure. This paging information serves as a control basis for page rendering, ensuring the logical integrity and visual consistency of the page content.
[0069] In an optional embodiment, step S400 includes the following sub-steps: S401 , extracting style feature information, content density information, and semantic association information from structured rendering data to construct a paging feature vector.
[0070] Style features include text layout information like font size, color, and indentation, which is used to determine formatting changes. Content density, which measures the number of rendering nodes per unit area, is used to assess page crowding. Semantic association information determines the logical relationship between paragraphs, allowing for model or rule matching to determine topic continuity. These three types of information together constitute the paging feature vector.
[0071] For example, a feature vector of the current page break point is formed by extracting a style similarity of 0.72, a content density of 6.0 elements / cm², and a semantic association mark of "non-continuous" from a certain section of PDF rendering data.
[0072] S402: Input the paging feature vector into the paging prediction model for inference to determine the paging boundary position.
[0073] Exemplarily, the paging prediction model is a multi-factor paging decision model based on machine learning training. It can comprehensively consider multiple feature factors such as item density (item_density), style continuity (style_continuity) and semantic grouping (semantic_grouping) to automatically determine the paging boundary position.
[0074] Among them, item_density is used to measure the density of content items per unit area. When the density value is higher than the set threshold (such as 5 elements / cm²), it is considered a candidate for paging. 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, and the default weight is set to 0.3 or 0.7. Semantic_grouping is used to determine whether there is semantic consistency between paragraphs. It can be achieved through topic analysis through NLP models (such as BERT) or rule matching (such as "title-paragraph spacing < 2cm").
[0075] In an optional embodiment, in order to improve the adaptability of the model, when it is detected that the user frequently manually scrolls or pauses before and after a PDF page boundary and a freeze occurs, the page will be judged as a potential misjudgment sample and marked as a negative sample, triggering the model weight update mechanism to continuously optimize the accuracy and robustness of the page boundary judgment.
[0076] S403: Generate page information according to the page boundary position.
[0077] Page paging information refers to structured markup data that includes the start and end positions of each page, content number, and paging sequence. It is used to control the rendering range and layout boundaries of each page. Paging information serves as a basic reference during the subsequent rendering instruction generation process, guiding content interception and layout operations.
[0078] For example, if the page boundaries are 1380px and 2760px, respectively, and the total page content height is 3600px, the paging 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. The paging information structure will be used for subsequent layout control and rendering instruction generation.
[0079] Step S500: construct a page rendering instruction set according to the page paging information.
[0080] The page rendering instruction set refers to the structured rendering control command set used to instruct the rendering layer to complete page drawing. It typically contains information such as text content, style parameters, position coordinates, and drawing order. Through this step, the abstract semantic structure can be converted into executable drawing instructions to facilitate better page display.
[0081] In an optional embodiment, step S500 includes the following sub-steps: S501: Determine the rendering content boundary of each paging area based on page paging information.
[0082] The rendered content boundaries refer to the actual starting and ending positions of the content within each page area. They are typically determined by the paging start and end coordinates combined with the page content structure. The paging information clearly records the starting and ending pixel positions of each page, which will serve as the basis for paging content interception.
[0083] For example, if the starting position of page 1 marked in the paging information of a PDF page is 0 pixels and the ending position is 1380 pixels, then the rendering content boundary of the page is a vertical interval from 0 pixels to 1380 pixels.
[0084] S502 : Based on the rendering content boundary, extract corresponding layout content from the structured rendering data and generate layout parameters.
[0085] Among them, layout content refers to text paragraphs, graphic components or structural blocks that fall within the current rendering boundary, which usually contains information such as content value, style attributes, paragraph structure, etc.; layout parameters refer to page drawing parameters calculated based on the extracted content, such as relative position, line height, alignment, etc., which are used to accurately control the layout effect of each element in the rendered page.
[0086] For example, two text nodes and a chart component are extracted from the rendering area of page 1, their starting position, line spacing, font size and other fields are read, and their relative arrangement order in the paging area is calculated. Finally, a set of typesetting parameters is generated, including but not limited to the paragraph starting position (y=120px,y=360px), font size (14pt), content block height (240px), etc.
[0087] S503: Construct a page rendering instruction set according to the layout parameters.
[0088] Among them, the page rendering instruction set refers to the structured drawing commands used to control the rendering layer to perform graphic drawing, which usually includes fields such as content type (text or graphics), display value, drawing coordinates, style control information and drawing order number.
[0089] For example, for a text file titled "Dear Zhang San," the following drawing instructions are generated based on the layout parameters: drawing type: text, value: "Dear Zhang San," position: (x=150px, y=220px), font size: 14pt, color: #000000, and drawing order: item 5. Multiple instructions are organized into an ordered instruction set according to the drawing order and transmitted to the rendering module to achieve the final page presentation.
[0090] Step S600: performing drawing processing based on the page rendering instruction set to generate a visual page rendering result.
[0091] Drawing processing involves passing the rendering instruction set to the rendering layer, calling the page rendering API, and then drawing the graphics and text on the target canvas, item by item, in a preset style and position. This drawing operation is performed on a per-page basis, ensuring the layout continuity and visual consistency of each page. The page rendering result is the visual content of the PDF page that the user ultimately sees on the interface, including a complete view of the text, graphics, structure, and other elements.
[0092] By executing this step, the conversion from structured instructions to image presentation can be achieved, completing the final rendering of the page.
[0093] In an optional embodiment, step S600 includes the following sub-steps: S601: Transmit the rendering instruction set to a preset rendering interface module, parse the style attributes, position coordinates, and rendering order information contained in each instruction, and obtain a parsing result.
[0094] Among them, the rendering interface module is a functional module used to receive and execute page drawing commands, which is usually encapsulated in the browser rendering engine or a dedicated Canvas graphics interface; style attributes include font, font size, color, thickness, alignment, etc.; position coordinates represent the absolute or relative drawing position of the rendering unit in the page; rendering order information is used to identify the drawing order relationship between multiple instructions.
[0095] For example, for a rendering instruction "draw the 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 the result will be added to the drawing queue.
[0096] S602: Based on the analysis result, content drawing operations are sequentially performed in corresponding paging areas.
[0097] Content drawing involves mapping the parsed rendering information onto the canvas, item by item, according to the page structure. This is done to actually draw the content. The paging area is defined by the aforementioned paging information, with each paging paragraph corresponding to an independent rendering range. Drawing operations must maintain layout specifications within the paging boundaries.
[0098] For example, within the paging 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 the order of numbering: 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.
[0099] S603: After completing the drawing operations on all the paging areas, a visual page rendering result is generated.
[0100] The visual page rendering result refers to the final page image with visual display effects formed after all contents in the paging area are drawn. This result can be used in various forms such as user interface display, print output or file export.
[0101] For example, when all paging areas are drawn, the canvas contents of each page are merged into a complete multi-page view, and the final rendering result can be used for front-end display to ensure that the page structure is correct, the layout is clear, and the content is complete when the user browses.
[0102] Figure 3 A schematic diagram of the structure of a page rendering device according to an embodiment of the present application is shown. Exemplarily, the page rendering device 100 includes: The data processing module 110 is used to process the page structure information of the page to be rendered into blocks to obtain an initial data block set; The loading module 120 is used to perform lazy loading processing based on the initial data block set to obtain the target data block set that needs to be loaded currently; The data generation module 130 is used to perform parameter parsing on the target data block set to generate structured rendering data; A decision processing module 140 is configured to perform paging decision processing based on the structured rendering data and obtain page paging information; An instruction construction module 150 is used to construct a page rendering instruction set according to the page paging information; The drawing module 160 is configured to perform drawing processing based on the page rendering instruction set to generate a visual page rendering result.
[0103] It can be understood that the apparatus of this embodiment corresponds to the method of the above embodiment, and the options in the above embodiment are also applicable to this embodiment, so they will not be described again here.
[0104] The present application also provides a terminal device. Exemplarily, the terminal device includes a processor and a memory, wherein the memory stores a computer program, and the processor runs the computer program to enable the terminal device to execute the functions of each module in the above method or the above device.
[0105] 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), a graphics processing unit (GPU), a network processor (NP), a digital signal processor (DSP), an application-specific integrated circuit (ASIC), a 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, etc., and can implement or execute the various methods, steps, and logic block diagrams disclosed in the embodiments of this application.
[0106] The memory may 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), and electrically erasable programmable read-only memory (EEPROM). The memory is used to store computer programs, and the processor can execute the computer programs accordingly after receiving an execution instruction.
[0107] This application also provides a computer-readable storage medium for storing the computer program used in the 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 mobile hard drive, a read-only memory (ROM), a random access memory (RAM), a magnetic disk, or an optical disk.
[0108] In the several embodiments provided in this application, it should be understood that the disclosed devices and methods can also be implemented in other ways. The device embodiments described above are merely schematic. For example, the flowcharts and structure diagrams in the accompanying drawings show the possible architectures, functions and operations of the devices, methods and computer program products according to the multiple embodiments of the present application. In this regard, each box in the flowchart or block diagram can represent a module, a program segment or a part of the code, and the module, program segment or a part of the code contains one or more executable instructions for implementing the specified logical functions. It should also be noted that in an alternative implementation, the functions marked in the box can also occur in an order different from that marked in the accompanying drawings. For example, two consecutive boxes can actually be executed substantially in parallel, and they can sometimes be executed in the opposite order, depending on the functions involved. It should also be noted that each box in the structure diagram and / or flowchart, and the combination of boxes in the structure diagram and / or flowchart, can be implemented using a dedicated hardware-based system that performs the specified function or action, or can be implemented using a combination of dedicated hardware and computer instructions.
[0109] In addition, the functional modules or units in the various embodiments of the present 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.
[0110] If the functions are implemented in the form of software function 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 the present application, or the part that contributes to the prior art, or part of the technical solution, can be embodied in the form of a software product. The computer software product is stored in a storage medium and includes a number of instructions for enabling a computer device (which can be a smart phone, personal computer, server, or network device, etc.) to execute all or part of the steps of the method described in each embodiment of the present application.
[0111] The above is only a specific implementation method of the present application, but the scope of protection of the present application is not limited thereto. Any technician familiar with this technical field can easily think of changes or replacements within the technical scope disclosed in this application, which should be covered by the scope of protection of the present application.
Claims
1. A page rendering method, characterized in that: The method comprises: The page structure information of the page to be rendered is divided into blocks to obtain an initial data block set; Perform lazy loading based on the initial data block set to obtain the target data block set that needs to be loaded; Performing parameter parsing on the target data block set to generate structured rendering data; Performing paging decision processing based on the structured rendering data to obtain page paging information; Constructing a page rendering instruction set according to the page paging information; Rendering is performed based on the page rendering instruction set to generate a visual page rendering result.
2. The page rendering method according to claim 1, characterized in that: The page structure information of the page to be rendered is subjected to block processing to obtain an initial data block set, including: Acquire current window environment parameters and user interaction behavior characteristics from the page structure information; Determine the visible area range of the current rendering content based on the window environment parameters; Semantic unit-based division is performed according to the visible area range and the user interaction behavior characteristics, and multiple data blocks obtained by the division are formed into an initial data block set.
3. The page rendering method according to claim 2, characterized in that: The lazy loading process is performed based on the initial data block set to obtain the target data block set currently to be loaded, including: Determining a loading trigger condition according to the window environment parameters and the user interaction behavior characteristics; When the loading trigger condition is met, selecting a target data block that is adapted to the current visible area from the initial data block set; The target data block is loaded, and the loaded data blocks that are not in the current visible area are released to obtain a target data block set.
4. The page rendering method according to claim 1, wherein: The performing parameter parsing on the target data block set to generate structured rendering data includes: Extracting a placeholder field from the target data block set; According to a preset field mapping rule, performing runtime delayed binding processing on the placeholder field to generate an intermediate rendering node associated with the page structure; The structured rendering data is constructed according to the structural configuration information of the intermediate rendering node.
5. The page rendering method according to claim 1, wherein: The performing paging decision processing according to the structured rendering data to obtain page paging information includes: Extracting style feature information, content density information, and semantic association information from the structured rendering data to construct a paging feature vector; Inputting the paging feature vector into a paging prediction model for reasoning to determine the paging boundary position; The page paging information is generated according to the page boundary position.
6. The page rendering method according to claim 1, characterized in that: The step of constructing a page rendering instruction set according to the page paging information includes: Determining the rendering content boundary of each paging area based on the page paging information; Based on the rendering content boundary, extracting corresponding layout content from the structured rendering data and generating layout parameters; Construct a page rendering instruction set according to the layout parameters.
7. The page rendering method according to claim 6, characterized in that: The page rendering instruction set includes style attributes, position coordinates, and rendering order information of each content unit. The drawing process based on the page rendering instruction set to generate a visual page rendering result includes: Transmitting the rendering instruction set to a preset rendering interface module, parsing the style attributes, the position coordinates, and the rendering order information contained in each instruction to obtain a parsing result; According to the analysis result, content drawing operations are performed in sequence in the corresponding paging areas; After completing the drawing operations of all paging areas, a visual page rendering result is generated.
8. A page rendering device, characterized in that: include: The data processing module is used to process the page structure information of the page to be rendered into blocks to obtain an initial data block set; A loading module is used to perform lazy loading processing based on the initial data block set to obtain the target data block set currently to be loaded; A data generation module, configured to perform parameter parsing on the target data block set to generate structured rendering data; A decision processing module, configured to perform paging decision processing based on the structured rendering data and obtain page paging information; An instruction construction module, used to construct a page rendering instruction set according to the page paging information; The drawing module is used to perform drawing processing based on the page rendering instruction set to generate a visual page rendering result.
9. A terminal device, characterized in that: The terminal device includes 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 according to any one of claims 1 to 7.
10. A computer-readable storage medium, characterized in that The computer program is stored therein, and when the computer program is executed on a processor, the page rendering method according to any one of claims 1 to 7 is implemented.
Citation Information
Patent Citations
Paging method and paging device
CN101196918A
Document data paging method and device, storage medium and electronic equipment
CN112464618A
Online structure digital document template generation method and system
CN117113957A
Rapid paging display method based on big data
CN117271930A
Method and system for printing browser content
CN118170332A
Cited By
Method and system for realizing online page printing based on custom form data model
CN121070294A
Android random screen layout display method and device and medium
CN121411856A