Page rendering method, device, electronic device and storage medium
Offline parsing and visual attribute extraction are performed through the script virtual machine in the image processing software, which solves the problems of long waiting time and poor compilation effect during landing page rendering, and improves the efficiency and restoration of page rendering.
Patent Information
- Application Number
- CN202210455351.6
- Authority / Receiving Office
- CN · China
- Patent Type
- Patents(China)
- Current Assignee / Owner
- Filing Date
- 2022-04-27
- Publication Date
- 2025-09-12
- Estimated Expiration
- 2042-04-27
AI Technical Summary
In the existing technology, the landing page rendering process requires online parsing, which results in long waiting times and inability to parse when the network is unstable, affecting the user experience. In addition, the compiled effect is very different from the visual file and requires repeated modifications.
Offline parsing is performed through the script virtual machine in the image processing software to identify the layer type and perform target compilation operations. Combined with visual attribute extraction processing, the target page is generated.
It realizes offline parsing, reduces waiting time, improves parsing efficiency, and enhances page rendering restoration and user experience.
Smart Images

Figure CN117009685B_ABST
Abstract
Description
Technical Field
[0001] The present disclosure relates to the field of data processing technology, and in particular to a page rendering method, device, electronic device, and storage medium. Background Art
[0002] With the development of internet technology, applications can display advertising content and drive user conversion through landing pages. In internet marketing, a landing page is the webpage displayed to potential users after they click on an ad or search using a search engine. Specifically, it refers to the first page a user reaches after clicking on an ad creative / link.
[0003] The landing page can be obtained by parsing and rendering the visual file. The visual file output by the current mainstream image processing software itself has structured information (Domain Specific Language, DSL). Users can query the structure through the corresponding operation specifications, and use the online parsing tool provided by the landing page production end to operate the visual file, so as to parse the required visual file structure and extract the visible elements; based on the parsed visual file structure and the extracted visible elements, the landing page is rendered. However, the above-mentioned landing page rendering process currently requires online parsing of the visual file. When there are a large number of users, they need to queue for parsing, and the waiting time is usually more than half an hour. When the network is not smooth, the parsing may not be possible, affecting the landing page rendering progress. In addition, the existing known compilation methods all have the problem of large differences between the compilation effect and the visual file. The compiled content needs to be modified repeatedly before it can be put into use, affecting the user experience. Summary of the Invention
[0004] In view of the above-mentioned technical problems, the present disclosure proposes a page rendering method, device, electronic device and storage medium.
[0005] According to one aspect of an embodiment of the present disclosure, a page rendering method is provided, wherein the method is applied to image processing software to obtain visual information to be compiled of a target page, wherein the visual information to be compiled includes information of multiple layers to be compiled;
[0006] Determining the layer types of the plurality of layer information to be compiled;
[0007] Performing a target compilation operation corresponding to the layer type on the layer information to be compiled to obtain compiled target layer information;
[0008] Performing visual attribute extraction processing based on the target layer information to obtain target visual attribute information;
[0009] Based on the target visual attribute information, the target page is rendered.
[0010] According to another aspect of an embodiment of the present disclosure, a page rendering device is provided, including:
[0011] A module for acquiring visual information to be compiled, configured to acquire visual information to be compiled of a target page, wherein the visual information to be compiled includes information of multiple layers to be compiled;
[0012] A layer type determination module, configured to determine the layer types of the plurality of layer information to be compiled;
[0013] A compiling module, configured to perform a target compiling operation corresponding to the layer type on the layer information to be compiled, to obtain compiled target layer information;
[0014] An attribute extraction module is used to perform visual attribute extraction processing based on the target layer information to obtain target visual attribute information;
[0015] A rendering module is used to render the target page based on the target visual attribute information.
[0016] According to another aspect of an embodiment of the present disclosure, an electronic device is provided, including: a processor; and a memory for storing instructions executable by the processor; wherein the processor is configured to execute the instructions to implement the above-mentioned page rendering method.
[0017] According to another aspect of an embodiment of the present disclosure, a computer-readable storage medium is provided. When instructions in the storage medium are executed by a processor of an electronic device, the electronic device is enabled to perform the above-mentioned page rendering method.
[0018] According to another aspect of an embodiment of the present disclosure, a computer program product including instructions is provided, which, when executed on a computer, enables the computer to execute the above-mentioned page rendering method.
[0019] The technical solutions provided by the embodiments of the present disclosure bring at least the following beneficial effects:
[0020] By using the script virtual machine in the image processing software to parse and process the visual information to be compiled, offline parsing of the visual information to be compiled can be achieved, which can not only avoid network limitations, but also greatly reduce waiting time, and improve the parsing time of the visual information to be compiled. In the parsing process, combined with the layer types of multiple layer information to be compiled, the target compilation operation corresponding to the layer type is performed on the layer information to be compiled to obtain the compiled target layer information, which can greatly improve the restoration degree of the target page rendered by the compiled target layer information, and can achieve the parsing of complex visual files. It also combines the target layer information to perform visual attribute extraction processing to obtain target visual attribute information, and renders the target page based on the target visual attribute information, which can improve the parsing efficiency during the page rendering process and improve the restoration degree of the target page.
[0021] It is to be understood that the foregoing general description and the following detailed description are exemplary and explanatory only and are not restrictive of the disclosure. BRIEF DESCRIPTION OF THE DRAWINGS
[0022] The accompanying drawings herein are incorporated into and constitute a part of the specification, illustrate embodiments consistent with the present disclosure, and together with the description are used to explain the principles of the present disclosure, and do not constitute an improper limitation of the present disclosure.
[0023] Figure 1 is a schematic diagram showing an application environment according to an exemplary embodiment;
[0024] Figure 2 is a flowchart of a page rendering method according to an exemplary embodiment;
[0025] Figure 3 is a flow chart showing a method for obtaining visual information to be compiled of a target page according to an exemplary embodiment;
[0026] Figure 4 This is a flow chart of a method for extracting visual attributes based on target layer information to obtain target visual attribute information according to an exemplary embodiment;
[0027] Figure 5 This is a flowchart of another method for performing visual attribute extraction processing based on target layer information to obtain target visual attribute information according to an exemplary embodiment;
[0028] Figure 6 This is a flow chart showing a method for rendering a target page based on target visual attribute information according to an exemplary embodiment;
[0029] Figure 7 is a flow chart showing a method for displaying a preview page and updating target visual attribute information according to an exemplary embodiment;
[0030] Figure 8 This is a schematic diagram of an operation interface during a page rendering process according to an exemplary embodiment;
[0031] Figure 9 This is a diagram showing a comparison of effects between a target page and a visual document according to an exemplary embodiment;
[0032] Figure 10 The figure is a structural block diagram of a page rendering device according to an exemplary embodiment. DETAILED DESCRIPTION
[0033] In order to enable ordinary persons in the art to better understand the technical solutions of the present disclosure, the technical solutions in the embodiments of the present disclosure will be clearly and completely described below with reference to the accompanying drawings.
[0034] It should be noted that the terms "first," "second," and the like in the specification and claims of the present disclosure and the above-mentioned drawings are used to distinguish similar objects and are not necessarily used to describe a specific order or precedence. It should be understood that the numbers used in this manner are interchangeable where appropriate so that the embodiments of the present disclosure described herein can be implemented in an order other than those illustrated or described herein. The embodiments described in the following exemplary embodiments do not represent all embodiments consistent with the present disclosure. Instead, they are merely examples of apparatus and methods consistent with certain aspects of the present disclosure as detailed in the appended claims.
[0035] See Figure 1 , Figure 1 is a schematic diagram showing an application environment according to an exemplary embodiment. Figure 1 As shown, the application environment can be image processing software, specifically, the image processing software can be Adobe Photoshop. The above-mentioned page rendering method can be executed by a script virtual machine in the image processing software. Among them, the script virtual machine can include a first script virtual machine and a second script virtual machine; as the host software, the image processing software can provide a first script virtual machine (JavaScript Engine) in the canvas (Application) and a second script virtual machine (V8 JavaScript Engine) in the extensible platform (CEP Extension Runtime). The first script virtual machine in the canvas can be used to operate the image processing software, and implement operations on the compiled visual information by calling the built-in interface, such as moving layers, deleting layers, and rasterizing images; the second script virtual machine in the extensible platform can be used for page preview, data conversion, and generation of the target page.
[0036] See also Figure 2 , Figure 2 is a flow chart showing a page rendering method according to an exemplary embodiment. The page rendering method can be applied to the above-mentioned script virtual machine, such as Figure 2 As shown, the page rendering method includes the following steps.
[0037] In step S201 , the visual information to be compiled of the target page is obtained.
[0038] In a specific embodiment, the target page may refer to a page to be generated; specifically, the target page may be a landing page to be generated. The visual information to be compiled may refer to information to be compiled that includes multiple page elements. The format of the visual information to be compiled may be a format specific to image processing software. For example, when the image processing software is Adobe Photoshop, the format of the visual information to be compiled may be a bitmap file format. The visual information to be compiled may include multiple layers of information to be compiled, and any layer of information to be compiled may represent the visual information of any of the multiple layers corresponding to the target page.
[0039] In a specific embodiment, the visual information to be compiled of the target page can be designed and generated by image processing software, which can transmit the visual information to be compiled to the first script virtual machine.
[0040] In a specific embodiment, the multiple layers of information to be compiled in the visual information to be compiled may include multiple layers of information to be compiled corresponding to multiple artboards respectively. Based on the artboard selection instruction triggered by the user, the multiple layers of information to be compiled corresponding to the artboards to be compiled in the multiple artboards may be determined.
[0041] In a specific embodiment, in order to prevent accidental deletion or movement, the image processing software may lock the background layer by default, such as Figure 3 As shown, after the above step S201, the following steps may also be included:
[0042] S301. Perform background lock detection on multiple layers of information to be compiled to obtain detection results.
[0043] S302. Unlock the layer information whose background is locked as indicated by the detection result to obtain unlocked visual information to be compiled.
[0044] In a specific embodiment, the visual information to be compiled may be unlocked visual information to be compiled.
[0045] In the above embodiment, there may be a background layer locked in the visual information to be compiled. By performing background lock detection on multiple layer information to be compiled, unlocking the layer information whose detection results indicate background lock, and obtaining the unlocked visual information to be compiled, the compilation failure of the background layer due to the background layer locking can be avoided.
[0046] In step S202 , the layer types of a plurality of layer information to be compiled are determined.
[0047] In a specific embodiment, the layer type may include non-text type, text type, invisible type, empty layer group type, mask type, image type, mixed layer type or mixed layer group type, etc. Among them, the text type may include ordinary text type and / or rich text type.
[0048] In a specific embodiment, the above step S202 may include:
[0049] Layer types are identified for multiple layers of layer information to be compiled in the visual information to be compiled, and layer types corresponding to the multiple layers of layer information to be compiled are obtained.
[0050] In a specific embodiment, layer attribute information for each layer information to be compiled can be obtained and, in combination with the layer attribute information, the layer type corresponding to the corresponding layer information to be compiled can be identified. Specifically, when the layer attribute information indicates that the layer information to be compiled is text information, the layer type of the layer information to be compiled can be determined to be text type; when the layer attribute information indicates that the layer information to be compiled is not text information, the layer type of the layer information to be compiled can be determined to be non-text type; when the layer attribute information indicates that the layer information to be compiled is normal text information or rich text information, the layer type of the layer information to be compiled can be determined to be normal text type or rich text type. When the layer attribute information indicates that the layer information to be compiled is invisible layer information, the layer type of the layer information to be compiled can be determined to be invisible type. When the layer attribute information indicates that the layer information to be compiled is layer group information and the group is empty, the layer type of the layer information to be compiled can be determined to be an empty layer group type. When the layer attribute information indicates that the layer information to be compiled is mask layer information, the layer type of the layer information to be compiled can be determined to be a mask type. When the layer attribute information indicates that the layer information to be compiled is image layer information, the layer type of the layer information to be compiled can be determined to be an image type, where image layers can include vector layers, bitmap layers, 3D layers, filter layers, smart object layers, or gradient fill layers. When the layer attribute information indicates that a mixer is applied to the layer information to be compiled, the layer type of the layer information to be compiled can be determined to be a mixed layer type. When the layer attribute information indicates that a mixer is applied to the layer information to be compiled and the layer information to be compiled is layer group information, the layer type of the layer information to be compiled can be determined to be a mixed layer group type.
[0051] In a specific embodiment, if a background layer is locked among the multiple layers of layer information to be compiled, a background lock detection can be performed on the multiple layers of layer information to be compiled, and the layer information whose detection result indicates background lock is unlocked can be unlocked to obtain unlocked visual information to be compiled. Specifically, after obtaining the unlocked visual information to be compiled, layer type identification can be performed on the multiple layers of layer information to be compiled in the unlocked visual information to be compiled to obtain the layer types corresponding to the multiple layers of layer information to be compiled.
[0052] In step S203, a target compilation operation corresponding to the layer type is performed on the layer information to be compiled to obtain compiled target layer information.
[0053] In a specific embodiment, in the process of parsing multiple layer information to be compiled, since the structure of the multiple layer information to be compiled is complex, the layer information to be compiled can be converted into target layer information with a layered structure by performing a target compilation operation corresponding to the layer type.
[0054] In a specific embodiment, the target compilation operation may refer to an operation performed on a layer corresponding to the layer information to be compiled. The target compilation operation may include operations such as merging layer information, deleting layer information, and / or modifying the hierarchical relationship of layer information.
[0055] In a specific embodiment, performing the target compilation operation corresponding to the layer type on the layer information to be compiled may include:
[0056] Delete layer information including invisible layer type or empty layer group type in multiple layer information to be compiled.
[0057] In a specific embodiment, when the layer type of the layer information includes an invisible type or an empty layer group type, the target compilation operation may be a deletion operation.
[0058] In the above embodiment, by deleting the invisible layer information, the export of irrelevant elements in the invisible layer can be avoided, thereby better improving the restoration degree of the target page.
[0059] In a specific embodiment, the visual information to be compiled may be tree structure information. Accordingly, the visual information to be compiled may be tree structure information having multiple layers of information to be compiled as nodes and hierarchical relationships between layers to which the multiple layers of information to be compiled belong as node hierarchical relationships. The performing of the target compilation operation corresponding to the layer type on the layer information to be compiled may further include:
[0060] The layer information to be processed masked by the mask layer information is determined from the plurality of layer information to be compiled.
[0061] The mask layer information and the to-be-processed layer information are merged to obtain first merged layer information, and the first merged layer information is moved to the root node of the tree structure information.
[0062] In a specific embodiment, the mask layer information may refer to layer information of a mask type among the multiple layer information to be compiled. Specifically, the tree structure information may be traversed to record the position of the mask layer information in the current layer group as the starting position. The position of the first non-mask marked layer in the current layer group corresponding to the layer group is then found in a hierarchical order from top to bottom as the ending position. The layer information between the starting position and the ending position is used as the mask layer information.
[0063] In a specific embodiment, the layer information to be processed may refer to layer information in which a portion of the area is masked by mask layer information.
[0064] In a specific embodiment, when the layer type of the layer information is a mask type, the target compilation operation may include a layer information merging operation and a layer information hierarchical relationship modification operation.
[0065] In the above embodiment, by merging the mask layer information and the layer information to be processed in advance, the mask effect of the mask layer information is applied to the layer information to be processed, thereby avoiding the mask layer information being lost during the export process and causing the mask effect to be lost, thereby improving the restoration degree of the target page.
[0066] In a specific embodiment, performing the target compilation operation corresponding to the layer type on the layer information to be compiled may include:
[0067] Merging the layer information of multiple layers of image type and continuous levels among the multiple layers of layer information to be compiled to obtain second merged layer information, and moving the second merged layer information into the root node.
[0068] In a specific embodiment, the second merged layer information may be layer information obtained by merging multiple image-type layer information with continuous layers from multiple layers of layer information to be compiled. Multiple image-type layer information with continuous layers may refer to multiple image-type layer information with continuous layers within a single layer group.
[0069] Specifically, by traversing the tree structure information, the position of the first layer information whose layer type is an image type in the current layer group can be recorded as the starting position, and then the layer information whose image type is a non-image type can be found from the current layer group in a hierarchical order from top to bottom, and the upper image information of the non-image type layer information can be used as the ending position. The layer information between the starting position and the ending position is multiple layer information whose layer type is an image type and has a continuous hierarchy. The layer information between the starting position and the ending position is merged to obtain the second merged layer information, and the second merged layer information is moved into the root node.
[0070] In the above embodiment, by merging multiple levels of continuous image types in a layer group, similar content can be made more integrated without losing editability, making it easier for users to perform secondary editing on the overall image, which is suitable for use by advertisers.
[0071] In a specific embodiment, performing the target compilation operation corresponding to the layer type on the layer information to be compiled may include:
[0072] Move a single layer information of image type among multiple layer information to be compiled into the root node.
[0073] In a specific embodiment, a single layer information whose layer type is an image type may mean that all adjacent layer information is non-image type layer information.
[0074] Specifically, by traversing the tree structure information, a single layer information whose layer type is an image type can be found among the multiple layer information to be compiled.
[0075] In a specific embodiment, when the layer type of the layer information is an image type, the target compilation operation may be an operation of modifying the hierarchical relationship of the layer information, or may include a layer information merging operation and an operation of modifying the hierarchical relationship of the layer information.
[0076] In a specific embodiment, the user can select a parsing method (including group parsing and layer parsing) according to the parsing granularity. When the user selects the parsing method of group parsing, for layer information whose layer type is image type, the above-mentioned step of merging multiple layer information whose layer type is image type and whose layer type is continuous in the multiple layer information to be compiled is performed to obtain second merged layer information, and the second merged layer information is moved into the root node, and the above-mentioned step of moving a single layer information whose layer type is image type in the multiple layer information to be compiled into the root node is performed; when the user selects the parsing method of layer parsing, for layer information whose layer type is image type, the action of moving the image type layer information into the root node is used as the target compilation operation. It can be understood that for the parsing method of layer parsing, the layer information whose layer type is continuous in the layer type is not merged and is directly moved into the root node, which can retain the hierarchical relationship between the above-mentioned layer information, thereby providing the most fine-grained material parsing, facilitating the user to perform secondary editing at the finest granularity, and better meeting the needs of different editing scenarios.
[0077] In a specific embodiment, performing the target compilation operation corresponding to the layer type on the layer information to be compiled may include:
[0078] The mixed layer information and the lower layer information of the mixed layer information are merged to obtain third merged layer information, and the third merged layer information is moved into the root node.
[0079] In a specific embodiment, the mixed layer information may refer to layer information of a mixed layer type among the plurality of layer information to be compiled. The lower layer information of the mixed layer information may refer to layer information corresponding to a layer position lower than the position corresponding to the mixed layer information.
[0080] In a specific embodiment, when the layer type of the layer information is a mixed layer type, the target compilation operation may include a layer information merging operation and a layer information hierarchical relationship modification operation.
[0081] Specifically, by merging the mixed layer information and the lower layer information of the mixed layer information to obtain the third merged layer information, the loss of the design effect of the mixed layer can be avoided, thereby improving the restoration degree of the target page.
[0082] In a specific embodiment, performing the target compilation operation corresponding to the layer type on the layer information to be compiled may include:
[0083] When the layer type is a mixed layer group type, the layer information in the mixed layer group is moved to the root node and the mixed layer group is deleted.
[0084] In a specific embodiment, the hybrid layer group may refer to a layer group whose layer type is a hybrid layer.
[0085] In a specific embodiment, when the layer type of the layer information is a mixed layer group, the target compilation operation may include an operation of modifying the hierarchical relationship of the layer information and an operation of deleting the layer information.
[0086] Specifically, a hybrid layer group may include at least one layer information; by moving all the layer information in the hybrid layer group into the root node and deleting the hybrid layer group, it is possible to avoid merging the layer information in the hybrid layer group into a single bitmap during the export process, thereby affecting secondary editing.
[0087] In a specific embodiment, performing the target compilation operation corresponding to the layer type on the layer information to be compiled may include:
[0088] Delete layer information including invisible type or empty layer group type in multiple layers to be compiled;
[0089] determining, from the plurality of layer information to be compiled, layer information to be processed that is masked by the mask layer information; merging the mask layer information and the layer information to be processed to obtain first merged layer information, and moving the first merged layer information into the root node of the tree structure information;
[0090] Merging multiple layer information of image type and continuous levels among the multiple layer information to be compiled to obtain second merged layer information, and moving the second merged layer information into the root node;
[0091] Move a single layer information of image type among multiple layer information to be compiled into the root node;
[0092] Merging the mixed layer information and the layer information below the mixed layer information to obtain third merged layer information, and moving the third merged layer information into the root node; the mixed layer information is layer information of a mixed layer type among the multiple layer information to be compiled;
[0093] When the layer type is a mixed layer group type, the layer information in the mixed layer group is moved to the root node and the mixed layer group is deleted.
[0094] In a specific embodiment, the target layer information may be layer information obtained after performing at least one target compilation operation on the layer information to be compiled.
[0095] In the above embodiment, the visual information to be compiled can be flattened into a layered structure by moving the first merged layer information into the root node of the above tree structure information, moving the second merged layer information into the root node, moving the single layer information of the image type among the multiple layer information to be compiled into the root node, moving the third merged layer information into the root node, and moving the layer information in the mixed layer group into the root node, so as to be more conducive to the description of the page structure by the code information of the target page to be converted later.
[0096] In step S204, visual attribute extraction processing is performed based on the target layer information to obtain target visual attribute information.
[0097] In a specific embodiment, the target visual attribute information may refer to the general description structure information of the target page layer layout. The target visual attribute information may represent the size attributes, position attributes, category attributes and / or content corresponding to multiple visual elements in the visual information to be compiled. The target visual attribute information may include the attribute information corresponding to each of the multiple layer information in the target layer information. Specifically, the attribute information may be a JSON (JavaScript Object Notation) array. The attribute information corresponding to each layer information may include the size information, position information, category information of the element corresponding to the layer information, and the identification information of the corresponding image.
[0098] In a specific embodiment, Figure 4 As shown, the above step S204 may include:
[0099] S401. Perform rasterization processing on the non-text layer information to obtain rasterized first layer information.
[0100] In a specific embodiment, the non-text layer information may refer to layer information of a non-text type in the target layer information. The first layer information may include a plurality of rasterized non-text layer information.
[0101] Specifically, multiple bitmap information may be obtained by performing rasterization processing on multiple non-text type layer information in the target layer information respectively, and the multiple bitmap information may be used as the first layer information.
[0102] In a specific embodiment, before rasterization processing, for layer information in non-text layer information whose size information is smaller than the preset size information, the layer information can be obtained by redrawing so that the actual size of the element remains unchanged but the layer size information (such as layer width and layer height) is the preset size information, and then rasterization processing is performed to avoid the layer size being too small, which makes it difficult for the editor to select the layer and affects secondary editing.
[0103] In the above embodiment, by rasterizing multiple non-text type layer information in the target layer information, the loss of corresponding layer effects due to the editor not supporting special layer types in some image processing software can be avoided, and the special effects in the layer information can be retained to the greatest extent, which can further improve the restoration degree of the target page.
[0104] S402. Determine the out-of-bounds layer information from the first layer information and the text layer information.
[0105] In a specific embodiment, the visual information to be compiled may include background layer information, and the out-of-bounds layer information may refer to layer information that exceeds the boundary of the background layer. The out-of-bounds layer information may include multiple pieces of layer information that exceed the boundary of the background layer, including the first layer information and the text layer information.
[0106] Specifically, by obtaining the position information of each layer information in the first layer information and the text layer information, if the position information of the layer information belongs to the boundary range of the background layer, it can be determined that the layer information is non-out-of-bounds layer information; if the position information of the layer information exceeds the boundary range of the background layer, it can be determined that the layer information is out-of-bounds layer information.
[0107] S403. Crop the target area in the out-of-bounds layer information to obtain second layer information.
[0108] In a specific embodiment, the target area may refer to an area beyond the boundary of the background layer in the cross-boundary layer information.
[0109] Specifically, the position of the target area of the out-of-bounds layer information can be determined based on the position information and size information of the out-of-bounds layer information and the position information of the background layer boundary; based on the position of the target area of the out-of-bounds layer information, the target area in the out-of-bounds layer information is cropped, and the part of the out-of-bounds layer information except the target area is retained as the second layer information.
[0110] In the above embodiment, by cropping the target area in the out-of-bounds layer information to obtain the second layer information, it is possible to avoid affecting secondary editing due to the editor being unable to select the out-of-bounds layer information.
[0111] S404: Perform visual attribute extraction processing on the non-cross-border layer information and the second layer information to obtain target visual attribute information.
[0112] In a specific embodiment, the non-cross-border layer information may refer to the layer information other than the cross-border layer information in the first layer information and the text layer information.
[0113] Specifically, for layer information whose layer type is ordinary text type, the text content information, position information, size information and color information in the ordinary text type layer information can be extracted as the attribute information corresponding to the layer information, wherein the size information may include attributes such as font size and line height; for layer information whose layer type is image type, the image position information, size information and image identification information in the image type layer information can be extracted as the attribute information corresponding to the layer information.
[0114] It should be noted that the distribution structure of the multiple attribute information in the target visual attribute information corresponds to the distribution structure of the multiple layer information in the target layer information. It is understood that the attribute information in the target visual attribute information is extracted from the layer information in the target layer information, that is, the multiple layer information in the target layer information can correspond one-to-one with the multiple attribute information in the target visual attribute information.
[0115] In a specific embodiment, Figure 5 As shown, for rich text layer information whose layer type is rich text type, the above step S204 may include:
[0116] S501. parse the rich text layer information word by word to obtain attribute information corresponding to each of the plurality of rich text characters in the rich text layer information.
[0117] In a specific embodiment, the rich text in the visual information to be compiled is different from ordinary text and can include multiple text styles to display rich text effects, thereby improving the design sense of the page. Rich text layer information can refer to layer information with a layer type of rich text. Taking a single character as a unit, the rich text layer information can include multiple rich text characters, and the attribute information of each rich text character can include attribute information such as font size, color, line height, font type, text content, and layer identifier.
[0118] In a specific embodiment, by performing character-by-character parsing on multiple rich text characters in rich text layer information, attribute information corresponding to each of the multiple rich text characters, sorted in the order of the characters in the rich text content, can be obtained. Specifically, by performing attribute extraction on a single rich text character, attribute information such as font size, color, line height, font type, text content, and layer identifier corresponding to the rich text character can be obtained.
[0119] S502. Combine and process the attribute information corresponding to the plurality of rich text characters to obtain target visual attribute information corresponding to the rich text layer information.
[0120] In a specific embodiment, a single layer may include multiple rich text fonts with the same attributes except for the font content. The attribute information of some of the same attributes in the multiple rich text characters can be combined to obtain the combined attribute information, and the combined attribute information can be used as the target visual attribute information corresponding to the rich text layer information. Specifically, the characters with the same attributes except for the text content can be merged to obtain the combined attribute information. For rich text layer information with different font attributes, the attribute information corresponding to the multiple rich text characters can be combined according to the text arrangement order of the rich text content to obtain the target visual attribute information corresponding to the rich text layer information.
[0121] In the above embodiment, by parsing the rich text type layer, the target page can retain the effect of the rich text and improve the restoration degree of the target page; by combining the attribute information with the same attributes in multiple rich text texts, the length of the description information corresponding to the attribute information can be reduced, thereby reducing the memory occupied by the target visual attribute information.
[0122] In step S205 , the target page is rendered based on the target visual attribute information.
[0123] In a specific embodiment, Figure 6 As shown, the above method also includes:
[0124] S601. Perform image export processing on the target layer information to obtain multiple target images.
[0125] In a specific embodiment, the multiple target images may be images derived one by one from the multiple layer information in the target layer information. Each target image may be a file in a picture format, for example, a target image may be a file in a png format.
[0126] In a specific embodiment, image export processing is performed on each layer information in the target layer information to obtain a target image corresponding to each layer information. Multiple images corresponding to multiple layers of the target layer information are used as multiple target images. It should be noted that the above image export processing includes text-type layer information, and the obtained target image can be an image composed of all text in the layer information, including all text effects.
[0127] In a specific embodiment, the above step S205 may include:
[0128] S602. Generate target parsing data based on target visual attribute information and multiple target images.
[0129] In a specific embodiment, the target parsed data can be used to render the target page. The target parsed data can include target visual attribute information and multiple target images, wherein the target visual attribute information can include multiple attribute information corresponding to multiple layer information in the target layer information, and the identification information in the multiple attribute information corresponds one-to-one with the identification information of the multiple target images.
[0130] Specifically, based on the correspondence between the target image and the layer information in the target layer information, and the correspondence between the target visual attribute information and the layer information in the target layer information, the correspondence between multiple target images and multiple attribute information in the target visual attribute information can be obtained; by using the identification information in the attribute information of the target visual attribute information as the identification information of the target image corresponding to the attribute information, the identification information of each of the multiple target images can be obtained.
[0131] S603. Render the target page based on the target parsed data.
[0132] In actual applications, the second script virtual machine can generate code information for a target page from the target parsed data; and send the code information for the target page to a page rendering engine, so that the page rendering engine renders the target page according to the code information. The code information for the target page can be used to render and generate the target page, and the code information for the target page can be HTML (Hypertext Markup Language) code information. The page rendering engine can be a browser.
[0133] In a specific embodiment, Figure 7 As shown, the above method also includes:
[0134] S701. Based on multiple target images, display target visual attribute information and a preview page corresponding to the target visual attribute information.
[0135] In actual applications, a preview page can be generated based on multiple target images and target visual attribute information through a second script virtual machine in the extensible platform.
[0136] S702 . In response to an update instruction based on the target visual attribute information, update the target visual attribute information, and update the preview page based on the updated target visual attribute information.
[0137] In actual applications, users can update the position information and size information in the target visual attribute information to achieve secondary editing, thereby further improving the restoration degree of the target page.
[0138] In a specific embodiment, the text type layer in the preview page can be directly generated based on the corresponding attribute information in the target visual attribute information, for example, it can be based on type information, size information and position information; it can also be generated based on the corresponding attribute information in the target visual attribute information and the corresponding target image. The specific method adopted can be determined based on the user's selection instruction. It is understandable that for text types that may contain multiple special effects in the rich text type, the special effects on the text can be retained to the greatest extent by generating the corresponding attribute information in the target visual attribute information and the corresponding target image to ensure the restoration degree of the target page.
[0139] In a specific embodiment, the above step S602 may include:
[0140] In response to a rendering confirmation instruction of the target page, target parsing data is generated based on the updated target visual attribute information and the plurality of target images.
[0141] In actual applications, after receiving the rendering instruction of the target page, the second script virtual machine can generate target parsing data based on the updated target visual attribute information and multiple target images, and generate code information of the target page according to the target parsing data.
[0142] In the above embodiment, the visual information to be compiled is parsed and processed by the script virtual machine in the image processing software, so that offline parsing of the visual information to be compiled can be achieved, which can avoid network limitations, greatly reduce waiting time, and improve the parsing time of the visual information to be compiled. In the parsing process, the layer types of multiple layer information to be compiled are combined, and the target compilation operation corresponding to the layer type is performed on the layer information to be compiled to obtain the compiled target layer information. This can greatly improve the restoration degree of the target page rendered by the compiled target layer information, and can achieve the parsing of complex visual files. It also combines the target layer information to perform visual attribute extraction processing to obtain target visual attribute information, and renders the target page based on the target visual attribute information, which can improve the parsing efficiency during the page rendering process and improve the restoration degree of the target page.
[0143] Figure 8 is a schematic diagram of an operation interface during a page rendering process according to an exemplary embodiment. Figure 9 This is a comparison diagram of the effects of a target page and a visual document according to an exemplary embodiment. Figure 8 (a)~ Figure 8 As shown in (g), the rendering process of the target page is as follows:
[0144] Before parsing, the user needs to download and install relevant plug-ins including the first script virtual machine and the second script virtual machine, so that the first script virtual machine is pre-installed in the canvas of the image processing software operated by the user and the second script virtual machine is pre-installed in the extensible platform.
[0145] Optional, combined Figure 8 As shown in (a), users can select the required parsing type according to their needs and generate parsing instructions after confirming the parsing type. Figure 8 As shown in (b), after receiving the parsing instruction, the first script virtual machine in the image processing software can call the visual information to be compiled from the image processing software and parse the tree structure information in the visual information to be compiled. Before compiling layer by layer, a background lock detection can be performed on multiple layers of the visual information to be compiled, and the layer information whose detection result indicates background lock can be unlocked to obtain the unlocked visual information to be compiled. After obtaining the unlocked visual information to be compiled, the layer type of the multiple layers of the visual information to be compiled in the unlocked visual information to be compiled can be identified to obtain the layer type corresponding to each of the multiple layers of the visual information to be compiled. After obtaining the layer type corresponding to each of the multiple layers of the visual information to be compiled, the multiple layers of the visual information to be compiled can be compiled layer by layer based on the hierarchical relationship of the multiple layers of the visual information to be compiled in a layer-by-layer compilation order starting from the root node.
[0146] During the layer-by-layer compilation process, target compilation operations corresponding to the layer type can be performed on the layer information to be compiled, obtaining compiled target layer information. Specifically, a preset level threshold can be pre-set for image and text layer information. If the layer information's current level is greater than or equal to the preset level threshold, the layer information is moved to the root node. The current level of the layer information can refer to the level corresponding to the layer group in which the layer information resides. If the current level of the layer information is less than the preset level threshold, the layer information remains within the original layer group. Comparing the current level of the layer information with the preset level threshold determines whether the layer should be moved to the root node, thereby controlling the structural framework of the target visual attribute information and meeting user needs for non-hierarchical target visual attribute information. For layer information whose layer type is a layer group, if the layer group is empty, the layer group is deleted. If it is not empty, the layer group is entered and the layer information within the layer group is compiled layer by layer until the layer information within the layer group is compiled. The target layer information can be obtained after all the layers to be compiled have been compiled. It is understandable that, by compiling layer by layer, the target layer information can inherit the hierarchical relationship among multiple layers of information to be compiled.
[0147] After the compilation is completed, the non-text layer information in the target layer information can be rasterized to obtain the rasterized first layer information; the out-of-bounds layer information is determined from the first layer information and the text layer information, the target area in the out-of-bounds layer information is cropped to obtain the second layer information, and the non-out-of-bounds layer information and the second layer information are subjected to visual attribute extraction to obtain the target visual attribute information. Among them, for rich text layer information whose layer type is rich text type, the attribute information corresponding to each of the multiple rich text characters in the rich text layer information can be obtained by performing word-by-word parsing on the rich text layer information, and the attribute information corresponding to each of the multiple rich text characters can be combined to obtain the target visual attribute information corresponding to the rich text layer information. The target layer information is subjected to image export processing, and each layer information in the target layer information is quickly exported in bitmap format to obtain multiple target images. Optionally, combined with Figure 8 As shown in (c), the second script virtual machine can display the target visual attribute information and the preview page corresponding to the target visual attribute information based on multiple target images. Figure 8 As shown in (d), the user can modify the target visual attribute information and trigger the update instruction; the second script virtual machine can update the target visual attribute information in response to the update instruction based on the target visual attribute information, and update the preview page based on the updated target visual attribute information. After the user confirms the page effect displayed on the preview page, the rendering confirmation instruction of the target page can be triggered. Optionally, in combination with Figure 8 As shown in (e), during the parsing process, there may be parsing anomalies due to the visual file being too large. Users can try again after optimizing the material size. Figure 8 As shown in (f), after the user adjusts the material size to meet the requirements, the second script virtual machine can generate target parsing data based on the updated target visual attribute information and multiple target images. Figure 8 (g) and Figure 9 As shown, the second script virtual machine can generate code information of the target page according to the target parsed data, and send the code information of the target page to the page rendering engine, so that the page rendering engine performs page rendering according to the code information of the target page to obtain the target page.
[0148] Figure 10 This is a structural block diagram of a page rendering device according to an exemplary embodiment. Figure 10 , the device comprises:
[0149] The visual information to be compiled obtaining module 1010 is used to obtain the visual information to be compiled of the target page, where the visual information to be compiled includes multiple layers of information to be compiled;
[0150] A layer type determination module 1020 is used to determine the layer types of the plurality of layer information to be compiled;
[0151] Compilation module 1030, configured to perform a target compilation operation corresponding to the layer type on the layer information to be compiled, and obtain compiled target layer information;
[0152] The attribute extraction module 1040 is used to perform visual attribute extraction processing based on the target layer information to obtain target visual attribute information;
[0153] The rendering module 1050 is configured to render the target page based on the target visual attribute information.
[0154] Regarding the apparatus in the above embodiment, the specific manner in which each module performs operations has been described in detail in the embodiment of the method, and will not be elaborated here.
[0155] In an exemplary embodiment, an electronic device is further provided, comprising: a processor; and a memory for storing instructions executable by the processor; wherein the processor is configured to execute the instructions to implement the page rendering method in the embodiment of the present disclosure.
[0156] In an exemplary embodiment, a computer-readable storage medium is further provided. When instructions in the storage medium are executed by a processor of an electronic device, the electronic device is enabled to execute the page rendering method in the embodiment of the present disclosure.
[0157] In an exemplary embodiment, a computer program product including instructions is further provided. When the computer program product is run on a computer, the computer is caused to execute the page rendering method in the embodiment of the present disclosure.
[0158] Those skilled in the art will appreciate that all or part of the processes in the above-mentioned embodiment methods can be implemented by instructing the relevant hardware through a computer program, which can be stored in a non-volatile computer-readable storage medium. When the computer program is executed, it can include the processes of the embodiments of the above-mentioned methods. Among them, any reference to memory, storage, database or other media used in the embodiments provided in this application can include non-volatile and / or volatile memory. Non-volatile memory can include read-only memory (ROM), programmable ROM (PROM), electrically programmable ROM (EPROM), electrically erasable programmable ROM (EEPROM) or flash memory. Volatile memory can include random access memory (RAM) or external cache memory. By way of illustration and not limitation, RAM is available in various forms, such as static RAM (SRAM), dynamic RAM (DRAM), synchronous DRAM (SDRAM), double data rate SDRAM (DDRSDRAM), enhanced SDRAM (ESDRAM), synchronous link (Synchlink) DRAM (SLDRAM), memory bus (Rambus) direct RAM (RDRAM), direct memory bus dynamic RAM (DRDRAM), and memory bus dynamic RAM (RDRAM).
[0159] Other embodiments of the present disclosure will readily occur to those skilled in the art after considering the specification and practicing the invention disclosed herein. This application is intended to cover any variations, uses, or adaptations of the present disclosure that follow the general principles of the present disclosure and include common knowledge or customary techniques in the art not disclosed herein. The description and examples are to be considered as exemplary only, with the true scope and spirit of the present disclosure being indicated by the following claims.
[0160] It should be understood that the present disclosure is not limited to the exact structures that have been described above and shown in the drawings, and that various modifications and changes can be made without departing from the scope thereof. The scope of the present disclosure is limited only by the appended claims.
Claims
1. A page rendering method, characterized in that: The method is applied to a script virtual machine in image processing software, and the method comprises: Obtaining visual information to be compiled of a target page, wherein the visual information to be compiled includes information of multiple layers to be compiled; Determining the layer types of the plurality of layer information to be compiled; Performing a target compilation operation corresponding to the layer type on the layer information to be compiled to obtain compiled target layer information; Performing visual attribute extraction processing based on the target layer information to obtain target visual attribute information; Based on the target visual attribute information, the target page is rendered.
2. The method according to claim 1, characterized in that The target layer information includes non-text layer information whose layer type is non-text type and text layer information whose layer type is text type; The performing of visual attribute extraction processing based on the target layer information to obtain target visual attribute information includes: Performing rasterization processing on the non-text layer information to obtain rasterized first layer information; Determining out-of-bounds layer information from the first layer information and the text layer information, wherein the out-of-bounds layer information is layer information that exceeds a background layer boundary; Performing clipping processing on the target area in the out-of-bounds layer information to obtain second layer information, wherein the target area is an area in the out-of-bounds layer information that exceeds the boundary of the background layer; Visual attribute extraction processing is performed on the non-cross-boundary layer information and the second layer information to obtain the target visual attribute information, where the non-cross-boundary layer information is layer information in the first layer information and the text layer information except the cross-boundary layer information.
3. The method according to claim 1, characterized in that The visual information to be compiled is tree structure information with the plurality of layer information to be compiled as nodes and the hierarchical relationship between the layers to which the plurality of layer information to be compiled belongs as the hierarchical relationship of the nodes; The performing of the target compilation operation corresponding to the layer type on the to-be-compiled layer information includes at least one of the following: Deleting layer information including invisible layer type or empty layer group type among the plurality of layer information to be compiled; Determining, from the plurality of layer information to be compiled, layer information to be processed that is masked by mask layer information, wherein the mask layer information is layer information of a mask type among the plurality of layer information to be compiled; Merging the mask layer information and the to-be-processed layer information to obtain first merged layer information, and moving the first merged layer information into a root node in the tree structure information; Merging a plurality of layer information of image type and continuous in hierarchy among the plurality of layer information to be compiled to obtain second merged layer information, and moving the second merged layer information into the root node; Move a single layer information of image type among the plurality of layer information to be compiled into the root node; Merging the mixed layer information and the layer information below the mixed layer information to obtain third merged layer information, and moving the third merged layer information into the root node; The mixed layer information is layer information of which the layer type is a mixed layer among the plurality of layer information to be compiled; In the case where the layer type is a mixed layer group type, the layer information in the mixed layer group is moved into the root node, and the mixed layer group is deleted.
4. The method according to any one of claims 1 to 3, characterized in that The target layer information includes rich text layer information whose layer type is rich text type; The performing of visual attribute extraction processing based on the target layer information to obtain target visual attribute information includes: Parsing the rich text layer information word by word to obtain attribute information corresponding to each of the plurality of rich text characters in the rich text layer information; The attribute information corresponding to each of the plurality of rich text characters is combined and processed to obtain target visual attribute information corresponding to the rich text layer information.
5. The method according to any one of claims 1 to 3, characterized in that After obtaining the visual information to be compiled of the target page, the method further includes: Performing background lock detection on the plurality of layer information to be compiled to obtain a detection result; performing unlocking processing on the layer information of which the detection result indicates background locking, to obtain unlocked visual information to be compiled; Determining the layer types of the plurality of layer information to be compiled includes: Layer type identification is performed on the plurality of layer information to be compiled in the unlocked visual information to be compiled to obtain layer types corresponding to the plurality of layer information to be compiled.
6. The method according to any one of claims 1 to 3, characterized in that The method further comprises: Performing image export processing on the target layer information to obtain multiple target images; The rendering of the target page based on the target visual attribute information includes: generating target parsing data based on the target visual attribute information and the plurality of target images; Render the target page based on the target parsed data.
7. The method according to claim 6, characterized in that The method further comprises: Based on the multiple target images, displaying the target visual attribute information and a preview page corresponding to the target visual attribute information; In response to an update instruction based on the target visual attribute information, updating the target visual attribute information, and updating the preview page based on the updated target visual attribute information; The generating target parsing data based on the target visual attribute information and the plurality of target images includes: In response to a rendering confirmation instruction of the target page, the target parsing data is generated based on the updated target visual attribute information and the plurality of target images.
8. A page rendering device, characterized in that: The device comprises: A module for acquiring visual information to be compiled, configured to acquire visual information to be compiled of a target page, wherein the visual information to be compiled includes information of multiple layers to be compiled; A layer type determination module, configured to determine the layer types of the plurality of layer information to be compiled; A compiling module, configured to perform a target compiling operation corresponding to the layer type on the layer information to be compiled, to obtain compiled target layer information; An attribute extraction module is used to perform visual attribute extraction processing based on the target layer information to obtain target visual attribute information; A rendering module is used to render the target page based on the target visual attribute information.
9. An electronic device, characterized in that: include: processor; a memory for storing processor-executable instructions; The processor is configured to execute the executable instructions to implement the page rendering method according to any one of claims 1 to 7.
10. A non-volatile computer-readable storage medium having computer program instructions stored thereon, characterized in that: When the computer program instructions are executed by a processor, the page rendering method according to any one of claims 1 to 7 is implemented.
11. A computer program product comprising computer instructions, characterized in that When the computer instructions are executed by a processor, the page rendering method according to any one of claims 1 to 7 is implemented.
Citation Information
Patent Citations
Page rendering method and device
CN103678631A
Small program running method and device, electronic equipment and storage medium
CN111222062A