Page rendering method, device and equipment

Abstract

The embodiment of the invention provides a page rendering method, device and equipment. The method comprises the following steps: receiving a rendering message sent by a server; the server and the client establish communication connection through a streaming communication protocol, and the rendering message is a streaming increment message generated by the server based on an intelligent agent; determining to-be-rendered content and the type of the to-be-rendered content according to the rendering message; determining a rendering strategy of the to-be-rendered content based on the type of the to-be-rendered content; and rendering the to-be-rendered content according to the rendering strategy to obtain a target page. And the limitation of page rendering is reduced.

Description

Technical Field

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

[0002] In artificial intelligence applications, user interaction with intelligent agents typically relies on the real-time responsiveness and dynamic content presentation of the displayed page. After generating content to be rendered, the intelligent agent on the server sends this content to the client. Upon receiving the content, the client renders it to obtain the target page.

[0003] To improve rendering efficiency, related technologies can display the content to be rendered on the real interface in a streaming manner to obtain the target page, that is, display the text content word by word on the display interface. However, the above page rendering method is mainly used for rendering text messages and cannot render special forms of content such as files and images, resulting in significant limitations in page rendering. Summary of the Invention

[0004] This application provides a page rendering method, apparatus, and device to address the problem of significant limitations in page rendering.

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

[0006] Receive rendering messages sent by the server; the server and client establish a communication connection through a streaming communication protocol, and the rendering messages are streaming incremental messages generated by the server based on the intelligent agent;

[0007] Based on the rendering message, determine the content to be rendered and the type of the content to be rendered;

[0008] Determine the rendering strategy for the content to be rendered based on its type.

[0009] The content to be rendered is rendered according to the rendering strategy to obtain the target page.

[0010] In this embodiment of the application, by introducing a message type field into the streaming communication protocol, the client can dynamically select a rendering strategy based on the message type. In this way, different rendering strategies can be selected to render the content to be rendered in the rendering message for different types of rendering messages, reducing the limitations of page rendering.

[0011] In one possible implementation, determining the content to be rendered and its type based on the rendering message includes:

[0012] The rendering message is parsed to determine the content to be rendered and the message format of the rendering message. The message format includes a type identifier field.

[0013] The type of the content to be rendered is determined based on the mapping relationship between message type and type identifier, and the type identifier field.

[0014] In this embodiment, by using an explicit type identifier field and a preset mapping relationship, the ambiguity of traditional type inference based on content features is reduced, ensuring accurate identification of different types of content to be rendered and improving rendering flexibility.

[0015] In one possible implementation, the type of the content to be rendered is one of text, markup language, and preset component types. Based on the type of the content to be rendered, a rendering strategy is determined, including:

[0016] If the content to be rendered is text, then the rendering strategy is determined to be a text streaming output strategy; the text streaming output strategy is used to indicate that the content to be rendered is rendered step by step according to the streaming incremental order.

[0017] If the type of the content to be rendered is markup language, then the rendering strategy is determined to be a contrastive rendering strategy; the contrastive rendering strategy is used to instruct the updated content in the content to be rendered to be rendered locally;

[0018] If the type of the content to be rendered is a preset component type, then the rendering strategy is determined to be to call the preset component instance strategy.

[0019] In this embodiment, by matching exclusive strategies for text streaming output, local contrast rendering, and component instance invocation to the content to be rendered for text type, markup language type, and preset component type respectively, the rendering method is accurately adapted, which not only ensures the smoothness of streaming output and the efficiency of markup language rendering, but also expands the support capability for special interactive scenarios.

[0020] In one possible implementation, when the rendering strategy is a contrastive rendering strategy, the content to be rendered is rendered according to the rendering strategy to obtain the target page, including:

[0021] The content to be rendered is stored in the cache area; the cache area stores at least one piece of content to be rendered received up to the current time.

[0022] Based on at least one piece of content to be rendered, generate at least one static document object model (DOM) node corresponding to the content to be rendered;

[0023] Based on the static DOM comparison algorithm, static DOM nodes are compared with real DOM nodes to determine the content to be updated on the current page displayed by the client; the real DOM nodes are the DOM nodes corresponding to the current page.

[0024] The current page is updated and rendered based on the content to be updated, resulting in the target page.

[0025] In this embodiment, a static DOM comparison algorithm is used to compare static DOM nodes with the real DOM nodes of the current page to accurately locate the content to be updated. Only the content to be updated is locally updated and rendered, which avoids the page flickering and performance loss caused by traditional overall refresh, significantly improves the efficiency and smoothness of streaming rendering of markup language type content, and reduces unnecessary resource consumption, bringing users a better interactive experience.

[0026] In one possible implementation, when the rendering strategy is to invoke a preset component instance strategy, the content to be rendered is rendered according to the rendering strategy to obtain the target page, including:

[0027] Determine the preset tags for the content to be rendered, including the tag type;

[0028] Based on the mapping relationship between tag types and components, and the tag type, determine the component instance corresponding to the content to be rendered;

[0029] The content to be rendered is rendered based on the component instance corresponding to the content to be rendered, and the target page is obtained.

[0030] In this embodiment, by identifying the tag type in the content to be rendered, matching the corresponding component instance based on the mapping relationship between the tag type and the component, and completing the rendering, the special content processing capability is flexibly expanded, the interaction form is enriched, and the maintainability and scalability of the system are improved.

[0031] In one possible implementation, the page rendering method further includes:

[0032] Determine whether the rendering message contains a priority field; the priority field is used to identify the urgency of rendering the rendering message.

[0033] If the rendering message contains a priority field, the rendering order of the rendering messages is determined according to the priority field, and the content to be rendered is rendered according to the rendering order.

[0034] If the rendering message does not contain a priority field, the content to be rendered is rendered according to the order in which the rendering messages are received.

[0035] In this embodiment, by determining whether the rendering message contains a priority field, the rendering logic of "priority sorting" or "receiving order sorting" is flexibly adopted. This ensures the priority presentation of core and urgent content while also taking into account the continuity of streaming rendering of ordinary content, thereby improving the rationality of rendering scheduling and the user interaction experience.

[0036] Secondly, embodiments of this application provide a page rendering apparatus, the apparatus comprising:

[0037] The receiving module is used to receive rendering messages sent by the server; the server and the client establish a communication connection through a streaming communication protocol, and the rendering messages are streaming incremental messages generated by the server based on the intelligent agent;

[0038] The first determining module is used to determine the content to be rendered and the type of the content to be rendered based on the rendering message.

[0039] The second determining module is used to determine the rendering strategy of the content to be rendered based on the type of the content to be rendered.

[0040] The rendering module is used to render the content to be rendered according to the rendering strategy to obtain the target page.

[0041] In one possible implementation, the first determining module is specifically used for:

[0042] The rendering message is parsed to determine the content to be rendered and the message format of the rendering message. The message format includes a type identifier field.

[0043] The type of the content to be rendered is determined based on the mapping relationship between message type and type identifier, and the type identifier field.

[0044] In one possible implementation, the type of the content to be rendered is one of text type, markup language type, and preset component type, and the second determining module is specifically used for:

[0045] If the content to be rendered is text, then the rendering strategy is determined to be a text streaming output strategy; the text streaming output strategy is used to indicate that the content to be rendered is rendered step by step according to the streaming incremental order.

[0046] If the type of the content to be rendered is markup language, then the rendering strategy is determined to be a contrastive rendering strategy; the contrastive rendering strategy is used to instruct the updated content in the content to be rendered to be rendered locally;

[0047] If the type of the content to be rendered is a preset component type, then the rendering strategy is determined to be to call the preset component instance strategy.

[0048] In one possible implementation, when the rendering strategy is a contrastive rendering strategy, the rendering module is specifically used for:

[0049] The content to be rendered is stored in the cache area; the cache area stores at least one piece of content to be rendered received up to the current time.

[0050] Based on at least one content to be rendered, generate at least one static document object model (DOM) node corresponding to the content to be rendered.

[0051] Based on the static DOM comparison algorithm, static DOM nodes are compared with real DOM nodes to determine the content to be updated on the current page displayed by the client; the real DOM nodes are the DOM nodes corresponding to the current page.

[0052] The current page is updated and rendered based on the content to be updated, resulting in the target page.

[0053] In one possible implementation, when the rendering strategy is to invoke a preset component instance strategy, the rendering module is specifically used for:

[0054] Determine the preset tags for the content to be rendered, including the tag type;

[0055] Based on the mapping relationship between tag types and components, and the tag type, determine the component instance corresponding to the content to be rendered;

[0056] The content to be rendered is rendered based on the component instance corresponding to the content to be rendered, and the target page is obtained.

[0057] In one possible implementation, the page rendering apparatus further includes a third determining module, which is specifically used for:

[0058] Determine whether the rendering message contains a priority field; the priority field is used to identify the urgency of rendering the rendering message.

[0059] If the rendering message contains a priority field, the rendering order of the rendering messages is determined according to the priority field, and the content to be rendered is rendered according to the rendering order.

[0060] If the rendering message does not contain a priority field, the content to be rendered is rendered according to the order in which the rendering messages are received.

[0061] Thirdly, embodiments of this application provide a page rendering device, including:

[0062] At least one processor; and

[0063] A memory that is communicatively connected to at least one processor; wherein,

[0064] The memory stores instructions that can be executed by at least one processor, such that the at least one processor is able to perform the method shown in any of the first aspects.

[0065] Fourthly, embodiments of this application provide a non-transitory computer-readable storage medium storing computer instructions, wherein the computer instructions are used to cause a computer to perform the method shown in any of the first aspects.

[0066] Fifthly, embodiments of this application provide a computer program product, including a computer program that, when executed by a processor, implements the method shown in any of the first aspects.

[0067] The page rendering method, apparatus, and device provided in this application establish a communication connection between the server and the client through a streaming communication protocol, receive streaming incremental rendering messages generated by the server based on the intelligent agent, accurately determine the content and type to be rendered from the message, and then match a dedicated rendering strategy according to the type and execute rendering to obtain the target page. This not only realizes the "receiving and rendering" of AI response content, greatly reducing user waiting time, but also takes into account the rendering methods of different types of content to be rendered through precise adaptation of type and strategy, thereby reducing the limitations of page rendering. Attached Figure Description

[0068] The accompanying drawings, which are incorporated in and form part of this specification, illustrate embodiments consistent with this application and, together with the description, serve to explain the principles of this application.

[0069] Figure 1 A schematic diagram illustrating the application scenarios provided in the embodiments of this application;

[0070] Figure 2 A flowchart illustrating a page rendering method provided in an embodiment of this application;

[0071] Figure 3 A flowchart illustrating another page rendering method provided in an embodiment of this application;

[0072] Figure 4 This is a schematic diagram illustrating how to obtain a target page, as provided in an embodiment of this application.

[0073] Figure 5 This is an illustration of another way to obtain the target page, provided as an embodiment of this application.

[0074] Figure 6 This is a schematic diagram of the structure of the page rendering apparatus provided in the embodiments of this application;

[0075] Figure 7 This is a schematic diagram of the structure of a page rendering device provided in an embodiment of this application.

[0076] The accompanying drawings illustrate specific embodiments of this application, which will be described in more detail below. These drawings and descriptions are not intended to limit the scope of the concept in any way, but rather to illustrate the concept of this application to those skilled in the art through reference to particular embodiments. Detailed Implementation

[0077] Exemplary embodiments will now be described in detail, examples of which are illustrated in the accompanying drawings. When the following description relates to the drawings, unless otherwise indicated, the same numbers in different drawings denote the same or similar elements. The embodiments described in the following exemplary embodiments do not represent all embodiments consistent with this application. Rather, they are merely examples of apparatuses and methods consistent with some aspects of this application as detailed in the appended claims.

[0078] It should be noted that, in this document, the terms "comprising," "including," or any other variations thereof are intended to cover non-exclusive inclusion, such that a process, method, article, or apparatus that comprises a list of elements includes not only those elements but also other elements not expressly listed, or elements inherent to such a process, method, article, or apparatus. Unless otherwise specified, an element defined by the phrase "comprising one..." does not exclude the presence of other identical elements in the process, method, article, or apparatus that includes that element.

[0079] It should be noted that the user information (including but not limited to user device information, user personal information, etc.) and data (including but not limited to data used for analysis, data stored, data displayed, etc.) involved in this application are all information and data authorized by the user or fully authorized by all parties. Furthermore, the collection, use and processing of the relevant data must comply with relevant laws, regulations and standards, and corresponding operation entry points are provided for users to choose to authorize or refuse.

[0080] To facilitate understanding, the following will be combined with... Figure 1 The application scenarios applicable to the embodiments of this application will be described.

[0081] Figure 1 This is a schematic diagram illustrating an application scenario provided in an embodiment of this application. Please refer to [link / reference]. Figure 1 It includes server 101 and client 102. Server 101 is equipped with an intelligent agent generation module. Client 102 includes a display page deployed on it.

[0082] In practical application, client 102 responds to a question entered by the user on the display interface by sending that question to server 101. Upon receiving the question, server 101 generates a corresponding answer using the agent generation module and sends the answer to client 102 as a rendered message. Upon receiving the rendered message, the client renders it on the display page.

[0083] With the rapid development of Artificial Intelligence (AI) technology, AI chatbots have been widely applied in fields such as online customer service, intelligent assistants, educational tutoring, and medical consultation. In these scenarios, user interaction with the AI ​​agent typically relies on the real-time response and dynamic content presentation of the front-end page. For example, in online customer service, users input questions, and the AI ​​agent needs to generate answers in real time and gradually display the answers on the client's screen in a streaming manner to reduce user waiting time and improve the interactive experience.

[0084] In related technologies, reply content can be displayed on the client's page in the following way: a communication connection is established between the server and the client via a streaming communication protocol. After the server generates a streaming incremental message based on an AI agent, it sends the streaming incremental message to the client. Upon receiving the streaming incremental message, the client updates the display page word by word. However, the above page rendering method is mainly used for rendering text messages and cannot render special forms of content such as files and images, resulting in significant rendering limitations.

[0085] In some embodiments, the responses generated by the AI ​​agent can be converted into Markdown format and rendered into HyperText Markup Language (HTML) elements using a Markdown parsing library, and then rendered based on the HTML elements. However, the above page rendering method only supports basic formatting functions and lacks optimization for partial updates, resulting in frequent page redraws and affecting page rendering performance. At the same time, for content requiring special interactive logic (such as file previews and dynamic charts), separate components need to be developed and separated from the Markdown rendering logic, making it difficult to achieve hybrid rendering.

[0086] In this embodiment, a communication connection between the server and the client is established through a streaming communication protocol. The server receives streaming incremental rendering messages generated by the intelligent agent. The content and type to be rendered are first accurately determined from the message. Then, a dedicated rendering strategy is matched according to the type and the rendering is performed to obtain the target page. This not only realizes the "receiving and rendering" of AI response content, which greatly reduces the user's waiting time, but also takes into account the rendering methods of different types of content to be rendered through precise adaptation of type and strategy, thereby reducing the limitations of page rendering.

[0087] The method described in this application will now be illustrated through specific embodiments. It should be noted that the following embodiments may exist independently or in combination with each other; identical or similar content will not be repeated in different embodiments.

[0088] Figure 2 This is a flowchart illustrating a page rendering method provided in an embodiment of this application. Please refer to [link / reference]. Figure 2 The method may include:

[0089] S201. Receive rendering messages sent by the server; the server and client establish a communication connection through a streaming communication protocol, and the rendering messages are streaming incremental messages generated by the server based on the agent.

[0090] The execution entity in this application embodiment can be a page rendering device or a page rendering apparatus set in the page rendering device. The page rendering apparatus can be implemented by software or by a combination of software and hardware. The page rendering device can be a client, wherein the client can be a terminal device capable of displaying pages, such as a mobile phone or a computer.

[0091] A streaming communication protocol is a protocol that supports one-way real-time data transmission from a server to a client. Streaming communication protocols can be, for example, Server-Sent Events (SSE) or WebSockets, to implement segmented data transmission.

[0092] The server deploys an intelligent agent, such as an AI agent. The AI ​​agent generates answers based on the user's question. The rendered message is a partial answer generated by the server in segments and sequentially based on the AI ​​agent's understanding and analysis of the user's question (multiple such incremental messages are concatenated to form the complete answer).

[0093] After generating the rendering message, the AI ​​agent sends the rendering message to the client through a communication connection established between the server and the client via a streaming communication protocol.

[0094] S202. Based on the rendering message, determine the content to be rendered and the type of the content to be rendered.

[0095] The content to be rendered refers to the core content displayed on the client's display page.

[0096] The type of content to be rendered is a classification identifier for the content to be rendered. The type of content to be rendered can be, for example, text, markup language, or preset component.

[0097] Optionally, after receiving the rendering message, the client can parse the message structure according to its message format, and then extract the fields specifically for storing the content to be rendered and the type of the content to be rendered from the parsed message. The content to be rendered is then determined from the fields storing the content to be rendered, and the type of the content to be rendered is determined from the fields storing the type of the content to be rendered.

[0098] S203. Determine the rendering strategy for the content to be rendered based on its type.

[0099] The rendering strategy for the content to be rendered can be determined as follows: If the content to be rendered is text, the rendering strategy is determined to be a text streaming output strategy; the text streaming output strategy is used to instruct the content to be rendered to be rendered step by step according to the streaming incremental order; if the content to be rendered is markup language, the rendering strategy is determined to be a contrastive rendering strategy; the contrastive rendering strategy is used to instruct the updated content in the content to be rendered to be rendered locally; if the content to be rendered is a preset component type, the rendering strategy is determined to be a strategy of calling the preset component instance.

[0100] A rendering strategy is a set of specific rendering rules and execution plans defined by the client for different types of content to be rendered. Rendering strategies can be, for example, text streaming output strategies, contrast rendering strategies, or strategies that invoke preset component instances.

[0101] Among these strategies, the text streaming output strategy refers to a rendering method that receives and displays content in segments. An example of this strategy is pushing text word by word in the SSE protocol. The contrastive rendering strategy can be a static DOM comparison algorithm, which determines the content to be updated by comparing the differences between old and new DOM nodes, and then renders the page based on the updated content. The strategy of calling pre-defined component instances refers to pre-setting reusable UI components on the client side, such as file previewers or interactive button components, which can be directly called to render the content to be rendered.

[0102] The content to be rendered can be one of the following types: text, markup language, or preset component.

[0103] Here, "text type" refers to plain text without any special formatting as the content to be rendered. For example, the rendered content for text type could be "Hello, this is AI's reply." When the content to be rendered is text type, no complex formatting is required; simply display the content segment by segment. Therefore, when the content to be rendered is text type, the rendering strategy is determined to be a text streaming output strategy.

[0104] Markup language type refers to structured text with syntax marking for the content to be rendered. For example, the markup language type could be Markdown. For instance, the content to be rendered in a markup language type could be heading content with formatting such as bold. When the content to be rendered is a markup language type, it needs to be converted to HTML format and its formatted display needs to be supported. Therefore, when the content to be rendered is a markup language type, a contrastive rendering strategy can be determined.

[0105] Preset component types refer to content that requires special interaction / display. For example, content with a preset component type could be a file preview, a visual chart, etc. When the content to be rendered is a preset component type, it needs to be rendered according to the corresponding UI component. Therefore, when the content to be rendered is a preset component type, the rendering strategy can be determined to be to call the preset component instance strategy.

[0106] In this embodiment, by matching exclusive strategies for text streaming output, local contrast rendering, and component instance invocation to the content to be rendered for text type, markup language type, and preset component type respectively, the rendering method is accurately adapted, which not only ensures the smoothness of streaming output and the efficiency of markup language rendering, but also expands the support capability for special interactive scenarios.

[0107] S204. Render the content to be rendered according to the rendering strategy to obtain the target page.

[0108] The target page is the final, fully displayed interface that the user sees after the content to be rendered has been rendered (such as an AI dialogue interface).

[0109] Taking a text streaming rendering strategy as an example, the content to be rendered can be rendered according to the rendering strategy to obtain the target page as follows: The client includes a buffer of text-type content to be rendered. After receiving rendering messages, each rendering message is stored in the buffer in the order of receipt to ensure logical coherence of the content. Then, the rendering action can be executed according to the principle of streaming incremental order. Specifically, each time the client receives a rendering message, it immediately adds the content to be rendered in the rendering buffer to the text display area through DOM manipulation, realizing "receiving and displaying simultaneously".

[0110] The page rendering method provided in this application establishes a communication connection between the server and the client through a streaming communication protocol, receives streaming incremental rendering messages generated by the server based on the intelligent agent, first accurately determines the content and type to be rendered from the message, and then matches a dedicated rendering strategy according to the type and executes rendering to obtain the target page. This not only realizes the "receiving and rendering" of AI response content, greatly reducing user waiting time, but also takes into account the rendering methods of different types of content to be rendered through precise adaptation of type and strategy, thereby reducing the limitations of page rendering.

[0111] Based on any of the above embodiments, the following, in conjunction with Figure 3 This section provides a detailed explanation of the page rendering process.

[0112] Figure 3 This is a flowchart illustrating another page rendering method provided in an embodiment of this application. Please refer to... Figure 3 The method includes:

[0113] S301, Receive rendering messages sent by the server.

[0114] It should be noted that the execution process of S301 can be found in S201, and will not be repeated here.

[0115] S302. Parse the rendering message to determine the content to be rendered and the message format of the rendering message. The message format includes a type identifier field.

[0116] The message format is a predefined data structure specification for rendering messages. The message format clearly defines the field types, meanings, and organization methods within the message.

[0117] The type identifier field is a field specific to the predefined message type in the message format, used to distinguish the type of content to be rendered.

[0118] Optionally, based on a preset rendering message format specification, the client specifies the structural standard of the rendering message and performs structural parsing on the rendering message. For example, assuming the rendering message format specification is JavaScript Object Notation (JSON), the client can parse the rendering message using the JSON.parse() method to obtain at least one field from the rendering message.

[0119] The client can specify the content to be rendered and the message format field in at least one field. Then, the content to be rendered is specified in the content to be rendered field, and the message format is specified in the message format field.

[0120] S303. Determine the type of the content to be rendered based on the mapping relationship between message type and type identifier, and the type identifier field.

[0121] For example, suppose the mapping relationship between message type and type identifier is as shown in Table 1:

[0122] Table 1

[0123]

[0124] Assuming the type identifier field indicates that the type identifier is AAA, then the type of the content to be rendered can be determined to be text.

[0125] S304. Determine the rendering strategy for the content to be rendered based on its type.

[0126] It should be noted that the execution process of S304 can be found in S203, and will not be repeated here.

[0127] S305. Render the content to be rendered according to the rendering strategy to obtain the target page.

[0128] When the rendering strategy is a contrastive rendering strategy, the content to be rendered can be rendered according to the rendering strategy to obtain the target page in the following way: Store the content to be rendered in a cache area; the cache area stores at least one piece of content to be rendered received up to the current time; generate at least one DOM node corresponding to the at least one piece of content to be rendered; compare the static DOM node with the real DOM node according to the static DOM comparison algorithm to determine the content to be updated for the current page displayed on the client; the real DOM node is the DOM node corresponding to the current page; update and render the current page according to the content to be updated to obtain the target page.

[0129] The cache area is a pre-defined temporary storage space in the client, specifically used to store all markup language types of content to be rendered up to the current moment. This avoids content fragmentation caused by streaming incremental transmission and provides a data foundation for generating complete static DOM nodes.

[0130] At least one piece of content to be rendered is the markup language type of content received in the cache area up to the current moment. The DOM node corresponding to at least one piece of content to be rendered is the HTML node tree corresponding to at least one piece of content to be rendered. The DOM node is stored only in the client's memory and is not mounted onto the actual DOM tree of the displayed page.

[0131] Optionally, based on at least one content to be rendered, a markup language rendering engine can be used to convert the content to be rendered into a corresponding HTML structure, thereby constructing a DOM node corresponding to the content to be rendered.

[0132] The client obtains the actual DOM nodes of the displayed page. These actual DOM nodes are the DOM node tree that is currently mounted and visible to the user on the client's page, corresponding to the previously rendered page content. The static DOM comparison algorithm is a DOM difference detection algorithm that determines the differences between two DOM node trees by traversing and comparing their structure, attributes, and content, thus avoiding the performance overhead of traversing the entire DOM tree.

[0133] Optionally, a static DOM comparison algorithm can be used to compare key information such as tag names, attributes, and text content of static DOM nodes and real DOM nodes in turn to determine the newly added, deleted, and modified nodes and their corresponding positions relative to the real DOM nodes, and then identify the newly added, deleted, and modified nodes and their corresponding positions as the content to be updated on the current page.

[0134] Optionally, DOM operations can be performed on the parts of the real DOM nodes that need to be updated, based on the content to be updated, so as to update and render the current page according to the content to be updated, and obtain the target page.

[0135] Below, in conjunction with Figure 4 The obtained target page will be described. Figure 4 This is a schematic diagram illustrating how a target page is obtained, as provided in an embodiment of this application. Figure 4 As shown, the process may include the following steps:

[0136] S401, Receive at least one content to be rendered, which is of type markup language.

[0137] S402. Generate static DOM nodes based on at least one content to be rendered that is of type markup language.

[0138] S403. Based on the static DOM comparison algorithm, compare the static DOM nodes with the real DOM nodes to determine the content to be updated on the current page displayed by the client.

[0139] S404. Update and render the current page according to the content to be updated to obtain the target page.

[0140] In this embodiment, a static DOM comparison algorithm is used to compare static DOM nodes with the real DOM nodes of the current page to accurately locate the content to be updated. Only the content to be updated is locally updated and rendered, which avoids the page flickering and performance loss caused by traditional overall refresh, significantly improves the efficiency and smoothness of streaming rendering of markup language type content, and reduces unnecessary resource consumption, bringing users a better interactive experience.

[0141] When the rendering strategy is to call the preset component instance strategy, the content to be rendered can be rendered according to the rendering strategy to obtain the target page in the following way: determine the preset tags of the content to be rendered, including the tag type; determine the component instance corresponding to the content to be rendered according to the mapping relationship between the tag type and the component, and the tag type; render the content to be rendered according to the component instance corresponding to the content to be rendered to obtain the target page.

[0142] Preset tags are pre-defined text formats that trigger the rendering of custom components, pre-configured on both the client and server. Preset tags include a tag type, which is an identifier field within the preset tag used to clearly define the component category.

[0143] For example, suppose the mapping relationship between tag types and components is as shown in Table 2:

[0144] Table 2

[0145]

[0146] Assuming the tag type is file-preview, then the component instance corresponding to the content to be rendered is determined to be the file preview component.

[0147] Optionally, the rendering logic of the content to be rendered can be determined based on the component instance corresponding to the content to be rendered, and then the content to be rendered can be rendered according to the rendering logic to obtain the target interface.

[0148] Below, in conjunction with Figure 5 The obtained target page will be described. Figure 5 This is another schematic diagram illustrating how to obtain a target page, as provided in an embodiment of this application. Figure 5 As shown, the process may include the following steps:

[0149] S501. Parse the rendering message to obtain the preset tags of the content to be rendered, including the tag type.

[0150] S502. Based on the mapping relationship between tag type and component, and tag type, determine the component instance corresponding to the content to be rendered.

[0151] S503. Determine the rendering logic corresponding to the content to be rendered based on the component instance.

[0152] S504. Render the content to be rendered according to the rendering logic corresponding to the content to be rendered, and obtain the target page.

[0153] In this embodiment, by identifying the tag type in the content to be rendered, matching the corresponding component instance based on the mapping relationship between the tag type and the component, and completing the rendering, the special content processing capability is flexibly expanded, the interaction form is enriched, and the maintainability and scalability of the system are improved.

[0154] Optionally, after receiving a rendering message, the client can also determine whether the rendering message contains a priority field. The priority field is used to identify the urgency of rendering the rendering message. If the rendering message contains a priority field, the rendering order of the rendering messages is determined according to the priority field, and the content to be rendered is rendered according to the rendering order. If the rendering message does not contain a priority field, the content to be rendered is rendered according to the order in which the rendering messages are received.

[0155] The rendering message may also contain a priority field. The priority field indicates the rendering priority of the rendering message. The higher the rendering priority, the higher the urgency of the rendering message; the lower the rendering priority, the lower the urgency of the rendering message.

[0156] Optionally, after parsing the rendering message, it can be determined whether the rendering message contains a priority field. If the rendering message contains a priority field, it means that the content to be rendered needs to be rendered according to the rendering priority of the rendering message. In this case, the rendering order of the rendering message can be determined according to the rendering priority indicated by the priority field. The rendering order refers to the order in which the client performs rendering operations on the content to be rendered.

[0157] Optionally, all currently pending rendering messages can be grouped and sorted according to priority based on preset rendering priority rules to determine the rendering order of the current rendering messages. Then, all currently pending rendering messages are rendered sequentially according to the rendering order, thereby achieving rendering of the content to be rendered according to the rendering order.

[0158] If the rendering message does not contain a priority field, it means that the content to be rendered does not need to be rendered according to the rendering priority of the rendering message. In this case, the content to be rendered can be rendered according to the order in which the rendering messages are received. The receiving order refers to the order in which the client receives the rendering messages pushed by the server.

[0159] Optionally, the order in which rendering messages are received can be determined as the rendering order of the content to be rendered. Then, all rendering messages to be processed are rendered sequentially according to the rendering order, thereby achieving rendering of the content to be rendered according to the rendering order.

[0160] In this embodiment, by determining whether the rendering message contains a priority field, the rendering logic of "priority sorting" or "receiving order sorting" is flexibly adopted. This ensures the priority presentation of core and urgent content while also taking into account the continuity of streaming rendering of ordinary content, thereby improving the rationality of rendering scheduling and the user interaction experience.

[0161] Figure 6 This is a schematic diagram of the structure of the page rendering apparatus provided in an embodiment of this application. Please refer to... Figure 6 The page rendering device 10 may include:

[0162] The receiving module 11 is used to receive rendering messages sent by the server; the server and the client establish a communication connection through a streaming communication protocol, and the rendering message is a streaming incremental message generated by the server based on the intelligent agent;

[0163] The first determining module 12 is used to determine the content to be rendered and the type of the content to be rendered based on the rendering message.

[0164] The second determining module 13 is used to determine the rendering strategy of the content to be rendered based on the type of the content to be rendered.

[0165] Rendering module 14 is used to render the content to be rendered according to the rendering strategy to obtain the target page.

[0166] In one possible implementation, the first determining module 12 is specifically used for:

[0167] The rendering message is parsed to determine the content to be rendered and the message format of the rendering message. The message format includes a type identifier field.

[0168] The type of the content to be rendered is determined based on the mapping relationship between message type and type identifier, and the type identifier field.

[0169] In one possible implementation, the type of the content to be rendered is one of text type, markup language type, and preset component type, and the second determining module 13 is specifically used for:

[0170] If the content to be rendered is text, then the rendering strategy is determined to be a text streaming output strategy; the text streaming output strategy is used to indicate that the content to be rendered is rendered step by step according to the streaming incremental order.

[0171] If the type of the content to be rendered is markup language, then the rendering strategy is determined to be a contrastive rendering strategy; the contrastive rendering strategy is used to instruct the updated content in the content to be rendered to be rendered locally;

[0172] If the type of the content to be rendered is a preset component type, then the rendering strategy is determined to be to call the preset component instance strategy.

[0173] In one possible implementation, when the rendering strategy is a contrastive rendering strategy, the rendering module 14 is specifically used for:

[0174] The content to be rendered is stored in the cache area; the cache area stores at least one piece of content to be rendered received up to the current time.

[0175] Based on at least one content to be rendered, generate at least one static document object model (DOM) node corresponding to the content to be rendered.

[0176] Based on the static DOM comparison algorithm, static DOM nodes are compared with real DOM nodes to determine the content to be updated on the current page displayed by the client; the real DOM nodes are the DOM nodes corresponding to the current page.

[0177] The current page is updated and rendered based on the content to be updated, resulting in the target page.

[0178] In one possible implementation, when the rendering strategy is to invoke a preset component instance strategy, the rendering module 14 is specifically used for:

[0179] Determine the preset tags for the content to be rendered, including the tag type;

[0180] Based on the mapping relationship between tag types and components, and the tag type, determine the component instance corresponding to the content to be rendered;

[0181] The content to be rendered is rendered based on the component instance corresponding to the content to be rendered, and the target page is obtained.

[0182] In one possible implementation, the page rendering apparatus further includes a third determining module, which is specifically used for:

[0183] Determine whether the rendering message contains a priority field; the priority field is used to identify the urgency of rendering the rendering message.

[0184] If the rendering message contains a priority field, the rendering order of the rendering messages is determined according to the priority field, and the content to be rendered is rendered according to the rendering order.

[0185] If the rendering message does not contain a priority field, the content to be rendered is rendered according to the order in which the rendering messages are received.

[0186] The page rendering apparatus provided in this application embodiment can execute the technical solution shown in the above method embodiment. Its implementation principle and beneficial effects are similar, and will not be described again here.

[0187] Figure 7 This is a schematic diagram of the structure of a page rendering device provided in an embodiment of this application. Please refer to... Figure 7 The page rendering device 20 may include a memory 21 and a processor 22. Exemplarily, the memory 21 and the processor 22 are interconnected via a bus 23.

[0188] Memory 21 is used to store program instructions;

[0189] The processor 22 is used to execute the program instructions stored in the memory, so that the data processing device 20 performs the method shown in the above method embodiment.

[0190] The page rendering device provided in this application embodiment can execute the technical solution shown in the above method embodiment. Its implementation principle and beneficial effects are similar, and will not be described again here.

[0191] This application provides a computer-readable storage medium storing computer-executable instructions, which are used to implement the above-described method when executed by a processor.

[0192] This application embodiment may also provide a computer program product, including a computer program that, when executed by a processor, can implement the above-described method.

[0193] All or part of the steps in the above-described method embodiments can be implemented by hardware related to program instructions. The aforementioned program can be stored in a readable memory. When the program is executed, it performs the steps of the above-described method embodiments; and the aforementioned memory (storage medium) includes: read-only memory (ROM), random access memory (RAM), flash memory, hard disk, solid-state drive, magnetic tape, floppy disk, optical disc, and any combination thereof.

[0194] This application describes embodiments with reference to flowchart illustrations and / or block diagrams of methods, apparatus (systems), and computer program products according to embodiments of this application. It should be understood that each block of the flowchart illustrations and / or block diagrams, and combinations of blocks in the flowchart illustrations and / or block diagrams, can be implemented by computer program instructions. These computer program instructions can be provided to a processing unit of a general-purpose computer, special-purpose computer, embedded processor, or other programmable data processing apparatus to produce a machine, such that the instructions, which execute via the processing unit of the computer or other programmable data processing apparatus, generate instructions for implementing the flowchart illustrations. Figure 1 One or more processes and / or boxes Figure 1 A device that provides the functions specified in one or more boxes.

[0195] These computer program instructions may also be stored in a computer-readable storage medium that can direct a computer or other programmable data processing device to function in a particular manner, such that the instructions stored in the computer-readable storage medium produce an article of manufacture including instruction means, which are implemented in a process Figure 1 One or more processes and / or boxes Figure 1 The function specified in one or more boxes.

[0196] These computer program instructions may also be loaded onto a computer or other programmable data processing equipment to cause a series of operational steps to be performed on the computer or other programmable equipment to produce a computer-implemented process, thereby providing instructions that execute on the computer or other programmable equipment for implementing the process. Figure 1 One or more processes and / or boxes Figure 1 The steps of the function specified in one or more boxes.

[0197] Obviously, those skilled in the art can make various modifications and variations to the embodiments of this application without departing from the spirit and scope of this application. Therefore, if these modifications and variations to the embodiments of this application fall within the scope of the claims of this application and their equivalents, this application also intends to include these modifications and variations.

[0198] In this application, the term "comprising" and its variations can refer to non-limiting inclusion; the term "or" and its variations can refer to "and / or". The terms "first", "second", etc., in this application are used to distinguish similar objects and are not necessarily used to describe a specific order or sequence. In this application, "multiple" refers to two or more. "And / or" describes the relationship between related objects, indicating that three relationships can exist. For example, A and / or B can represent: A existing alone, A and B existing simultaneously, and B existing alone. The character " / " generally indicates that the preceding and following related objects have an "or" relationship.

Claims

1. A page rendering method, characterized in that, Applied to a client, the method includes: The server receives rendering messages sent by the client; the server and the client establish a communication connection through a streaming communication protocol, and the rendering messages are streaming incremental messages generated by the server based on the agent. Based on the rendering message, determine the content to be rendered and the type of the content to be rendered; Based on the type of the content to be rendered, determine the rendering strategy for the content to be rendered; The content to be rendered is rendered according to the rendering strategy to obtain the target page.

2. The method according to claim 1, characterized in that, Based on the rendering message, determine the content to be rendered and the type of the content to be rendered, including: The rendering message is parsed to determine the content to be rendered and the message format of the rendering message, wherein the message format includes a type identifier field; The type of the content to be rendered is determined based on the mapping relationship between message type and type identifier, and the type identifier field.

3. The method according to claim 1 or 2, characterized in that, The type of the content to be rendered is one of text, markup language, and preset component types. Based on the type of the content to be rendered, a rendering strategy is determined, including: If the type of the content to be rendered is text, then the rendering strategy is determined to be a text streaming output strategy; the text streaming output strategy is used to instruct the content to be rendered to be rendered step by step according to the streaming incremental order; If the type of the content to be rendered is the markup language type, then the rendering strategy is determined to be a contrastive rendering strategy; the contrastive rendering strategy is used to instruct the local rendering of the updated content in the content to be rendered. If the type of the content to be rendered is the preset component type, then the rendering strategy is determined to be to call the preset component instance strategy.

4. The method according to claim 3, characterized in that, When the rendering strategy is the comparative rendering strategy, the content to be rendered is rendered according to the rendering strategy to obtain the target page, including: The content to be rendered is stored in a cache area; the cache area stores at least one piece of content to be rendered received up to the current time. Based on the at least one content to be rendered, generate a static document object model (DOM) node corresponding to the at least one content to be rendered; According to the static DOM comparison algorithm, the static DOM nodes are compared with the real DOM nodes to determine the content to be updated on the current page displayed by the client; the real DOM nodes are the DOM nodes corresponding to the current page. The current page is updated and rendered according to the content to be updated, and the target page is obtained.

5. The method according to claim 3, characterized in that, When the rendering strategy is the preset component instance strategy, the content to be rendered is rendered according to the rendering strategy to obtain the target page, including: Determine the preset tags for the content to be rendered, wherein the preset tags include tag types; Based on the mapping relationship between tag types and components, and the tag types, determine the component instance corresponding to the content to be rendered; The content to be rendered is rendered based on the component instance corresponding to the content to be rendered, and the target page is obtained.

6. The method according to claim 1 or 2, characterized in that, The method further includes: Determine whether the rendering message contains a priority field; the priority field is used to identify the urgency of rendering the rendering message. If the rendering message contains the priority field, the rendering order of the rendering message is determined according to the priority field, and the content to be rendered is rendered according to the rendering order. If the priority field is not included in the rendering message, the content to be rendered is rendered according to the order in which the rendering messages are received.

7. A page rendering device, characterized in that, The device includes: A receiving module is used to receive rendering messages sent by the server; the server and the client establish a communication connection through a streaming communication protocol, and the rendering messages are streaming incremental messages generated by the server based on the intelligent agent; The first determining module is used to determine the content to be rendered and the type of the content to be rendered based on the rendering message. The second determining module is used to determine the rendering strategy of the content to be rendered based on the type of the content to be rendered. The rendering module is used to render the content to be rendered according to the rendering strategy to obtain the target page.

8. A page rendering device, characterized in that, include: At least one processor; as well as A memory communicatively connected to the at least one processor; wherein, The memory stores instructions that can be executed by the at least one processor to enable the at least one processor to perform the method of any one of claims 1 to 6.

9. A non-transitory computer-readable storage medium storing computer instructions, characterized in that, in, The computer instructions are used to cause the computer to perform the method according to any one of claims 1 to 6.

10. A computer program product, comprising a computer program, characterized in that, When the computer program is executed by a processor, it implements the method of any one of claims 1 to 6.

Images