Page processing method and apparatus

Abstract

The application provides a page processing method and device, wherein the page processing method is applied to a client, a target application program is run in the client, the target application program comprises a logical thread and a rendering thread, and the method comprises the following steps: in the case that it is monitored that a current page of the target application program meets a page exception condition, the logical thread reads a target virtual DOM tree corresponding to the current page, generates a page rendering instruction based on the target virtual DOM tree, and sends the page rendering instruction to the rendering thread; and the rendering thread generates a target page of the target application program by rendering the current page according to the target virtual DOM tree in response to the page rendering instruction. In this way, only a one-way process of converting from a virtual DOM tree to a real DOM tree rendering is realized, the abnormal page of the target application program can be re-rendered and recovered, and the processing of the page exception is completed.

Description

Technical Field

[0001] This application relates to the field of computer technology, and in particular to page processing methods. This application also relates to a page processing apparatus, a computing device, and a computer-readable storage medium. Background Technology

[0002] When an application loads a page, under normal circumstances, the page will display all its content and respond to various user interactions. However, under abnormal circumstances, the page may not display any content, or it may display the content but fail to respond to any user interactions; this phenomenon is called a blank screen. When a blank screen occurs, users cannot browse the page content or perform any actions on it, affecting normal user experience.

[0003] Currently, it is possible to monitor changes in the real DOM tree of a page in real time and convert it into a virtual DOM tree described by JavaScript objects. When a white screen occurs, the recorded virtual DOM tree is converted back into the real DOM tree to complete the page recovery. However, since this page white screen recovery process is implemented by bidirectional data conversion, considering the time consumption of network transmission, this process will have a significant delay, resulting in low efficiency and a poor user experience. Summary of the Invention

[0004] In view of this, embodiments of this application provide a page processing method. This application also relates to a page processing apparatus, a computing device, and a computer-readable storage medium, to solve the aforementioned problems existing in the prior art.

[0005] According to a first aspect of the embodiments of this application, a page processing method is provided, applied to a client, wherein a target application is running in the client, the target application including a logic thread and a rendering thread, the method comprising:

[0006] If the current page of the target application is found to meet the page abnormal conditions, the logic thread reads the target virtual DOM tree corresponding to the current page, generates a page rendering instruction based on the target virtual DOM tree, and sends the page rendering instruction to the rendering thread.

[0007] The rendering thread, in response to the page rendering instruction, renders the current page according to the target virtual DOM tree to generate the target page of the target application.

[0008] According to a second aspect of the embodiments of this application, a page processing apparatus is provided, applied to a client, wherein a target application runs in the client, the target application including a monitoring module, a logic thread, and a rendering thread, the apparatus comprising:

[0009] The monitoring module is configured to send a page processing instruction to the logic thread when it detects that the current page of the target application meets the page abnormal conditions.

[0010] The logic thread is configured to, in response to the page processing instruction, read the target virtual DOM tree corresponding to the current page, generate a page rendering instruction based on the target virtual DOM tree, and send the page rendering instruction to the rendering thread;

[0011] The rendering thread is configured to render the current page according to the target virtual DOM tree in response to the page rendering instruction, thereby generating the target page of the target application.

[0012] According to a third aspect of the embodiments of this application, a computing device is provided, including a memory, a processor, and computer instructions stored in the memory and executable on the processor, wherein the processor executes the computer instructions to implement the steps of the page processing method.

[0013] According to a fourth aspect of the embodiments of this application, a computer-readable storage medium is provided that stores computer instructions, which, when executed by a processor, implement the steps of the page processing method.

[0014] The page processing method provided in this application is applied to a client running a target application, which includes a logic thread and a rendering thread. The method includes: when the current page of the target application is detected to meet page abnormal conditions, the logic thread reads the target virtual DOM tree corresponding to the current page, generates a page rendering instruction based on the target virtual DOM tree, and sends the page rendering instruction to the rendering thread; the rendering thread, in response to the page rendering instruction, renders the current page according to the target virtual DOM tree to generate the target page of the target application.

[0015] The page processing method provided in one embodiment of this application completes the page exception handling process in the target application through a combination of a logic thread and a rendering thread during the operation of the target application. Specifically, the logic thread reads the target virtual DOM tree corresponding to the abnormal page to generate page rendering instructions, driving the rendering thread to complete the re-rendering process of the current page, thus resolving the page exception phenomenon in the target application. This method only implements a one-way process of rendering from the virtual DOM tree to the real DOM tree, which can realize the re-rendering and recovery of the abnormal page of the target application and complete the page exception handling. This avoids real-time monitoring of changes in the real DOM tree of the page, eliminates the conversion process from the real DOM tree to the virtual DOM tree, reduces the latency of data conversion, and thus improves the efficiency of page exception recovery and enhances the user experience. Attached Figure Description

[0016] Figure 1 This is a schematic diagram illustrating an application scenario of a page processing method provided in an embodiment of this application;

[0017] Figure 2 This is a flowchart of a page processing method provided in an embodiment of this application;

[0018] Figure 3 This is a flowchart of a page processing method for page updating provided in an embodiment of this application;

[0019] Figure 4 This is a flowchart illustrating a page processing method for page restoration provided in one embodiment of this application;

[0020] Figure 5 This is a schematic diagram of the structure of a page processing device provided in an embodiment of this application;

[0021] Figure 6 This is a structural block diagram of a computing device provided in one embodiment of this application. Detailed Implementation

[0022] Many specific details are set forth in the following description to provide a full understanding of this application. However, this application can be implemented in many other ways different from those described herein, and those skilled in the art can make similar extensions without departing from the spirit of this application; therefore, this application is not limited to the specific embodiments disclosed below.

[0023] The terminology used in one or more embodiments of this application is for the purpose of describing particular embodiments only and is not intended to limit the scope of one or more embodiments of this application. The singular forms “a,” “the,” and “the” used in one or more embodiments of this application and in the appended claims are also intended to include the plural forms unless the context clearly indicates otherwise. It should also be understood that the term “and / or” used in one or more embodiments of this application refers to and includes any or all possible combinations of one or more associated listed items.

[0024] It should be understood that although the terms first, second, etc., may be used to describe various information in one or more embodiments of this application, such information should not be limited to these terms. These terms are only used to distinguish information of the same type from one another. For example, first may also be referred to as second without departing from the scope of one or more embodiments of this application, and similarly, second may also be referred to as first. Depending on the context, the word "if" as used herein may be interpreted as "when," "when," or "in response to a determination."

[0025] First, the terms and concepts involved in one or more embodiments of this application will be explained.

[0026] WKWebView: Uses caching technology to store front-end and back-end resources, improving page performance and user experience.

[0027] WKWebView (WebKit) includes three processes: UI Process, Networking Process, and WebContentProcess.

[0028] UI Process: This is the App process. Some modules in WKWebView (WebKit) run in this process and are responsible for starting other processes.

[0029] Networking Process: This is the network module process, which is mainly responsible for network request-related functions in WKWebView. This process will only be started once in the app and is shared among multiple WKWebViews.

[0030] WebContent Process: This is the Web module process, which is mainly responsible for running WebCore and JSCore related modules. It is the core process of WKWebView. This process will be started multiple times in the App, and each WKWebView will have its own independent WebContent process.

[0031] JS: JavaScript is a dynamically executed programming language. It is a lightweight, interpreted or just-in-time (JIT) compiled high-level programming language with function priority.

[0032] DOM (Document Object Model): This is the interface for JavaScript to manipulate web pages, providing JavaScript with the ability to dynamically modify the document state.

[0033] DOM Tree (DOM Node Tree): Viewing an XML document as a tree structure, this tree structure is called a node tree.

[0034] Blank screen: refers to a display page that does not show any interface elements.

[0035] Application pages may experience loading crashes or become unresponsive, a phenomenon known as a blank screen. Taking iOS as an example, the iOS operating system provides WKWebView, a view control for displaying web content. WKWebView has its own independent WebContent and Networking processes, separate from the application process. Thanks to WKWebView's multi-threaded model, when the WKWebView process encounters an error, the problem will only manifest in WKWebView and will not affect the normal operation of the application process.

[0036] The WebContent and Networking processes of WKWebView have lower priority than the App processes. Therefore, when operating system resources are scarce, the system will prioritize ensuring the normal operation of application processes. For example, when the device's RAM usage reaches a limit that cannot guarantee the continued normal operation of the operating system, the operating system will take emergency measures to prioritize reclaiming the WKWebView process. The final manifestation of the problem is that the WebContent process is killed, and WKWebView displays a white screen.

[0037] Currently, the solution to the blank screen issue is to restart the entire application, restoring it to its initial state. However, this results in the loss of previous business logic and page states. For example, if a user navigates through a series of pages to a form and enters information, and then the blank screen occurs, restarting the application will reset all states, making it impossible to restore the application to its state before the blank screen appeared. The user's previous input will be lost, leading to a poor user experience.

[0038] Furthermore, it's currently possible to monitor changes in the application's actual DOM tree in real time and convert it into a virtual DOM tree described by JavaScript objects. The conversion result is recorded in a local cache or uploaded to a server. Then, when a white screen occurs, the recorded virtual DOM tree is converted back into the actual DOM tree to restore the application page and resolve the white screen issue. However, this method requires real-time monitoring of changes in the actual DOM tree, determining if it's a keyframe, and then converting it into a virtual DOM tree. During white screen recovery, the saved virtual DOM tree needs to be converted back into the actual DOM tree, making the process bidirectional and relatively inefficient. It also requires local caching or server support, and considering network transmission time, the recovery process after a white screen may be delayed, resulting in a poor user experience.

[0039] Based on this, current solutions for the white screen phenomenon cannot simultaneously satisfy the requirements of restoring the real-time state of the page, minimizing performance overhead, and addressing numerous external dependencies. The page processing method provided in this application embodiment only adopts a unidirectional process of converting from the virtual DOM tree to the real DOM tree, combined with a dual-threaded interaction approach, to restore the page white screen phenomenon. This not only reduces the latency issue in resolving the white screen phenomenon but also improves page processing efficiency and enhances the user experience.

[0040] This application provides a page processing method, and also relates to a page processing apparatus, a computing device, and a computer-readable storage medium, which will be described in detail in the following embodiments.

[0041] Figure 1 The illustration shows an application scenario diagram of a page processing method provided according to an embodiment of this application.

[0042] Figure 1 The left side shows the client used by the user, and the right side shows the logic thread and rendering thread corresponding to the target application running in the client. The login page 100 of the target application running in the client only displays loading..., indicating that the content of the login page cannot be loaded and a white screen phenomenon occurs. It should be noted that the white screen phenomenon in the login page may be caused by the crash of the rendering thread of the target application or other network reasons. This embodiment does not make specific limitations on this.

[0043] To resolve the page anomaly (i.e., white screen phenomenon) currently occurring on the login page 100, the logic thread 102 and the rendering thread 104 can be combined to re-render and restore the login page 100. Specifically, the logic thread 102 can read the target virtual DOM tree of the login page 100, generate a page rendering instruction, and send the page rendering instruction to the rendering thread 104. Furthermore, the rendering thread 104 responds to the page rendering instruction and re-renders the login page, thus resolving the white screen phenomenon occurring on the login page 100.

[0044] It should be noted that the target virtual DOM tree is the virtual DOM tree of the latest state of the current login page. This target virtual DOM tree is obtained by the logic thread 102, and corresponding page rendering instructions are generated. Even if the current thread of the rendering thread 104 crashes or exits, the latest login page 100 can be quickly re-rendered by the restarted rendering thread 104 according to the page rendering instructions sent by the logic thread 102.

[0045] Figure 2 A flowchart of a page processing method according to an embodiment of this application is shown, which specifically includes the following steps:

[0046] It should be noted that the page processing method provided in this application embodiment is applied to a client, in which a target application runs. The target application includes a logic thread and a rendering thread, wherein the target application independently manages the logic thread and the rendering thread through dual threads. In addition, the target application in the following embodiments can be any application with dual threads (logic thread and rendering thread), but there is no limitation on the type of target application, which can be a shopping application, a financial application, a social application, etc.

[0047] Step 202: If the current page of the target application is found to meet the page abnormal conditions, the logic thread reads the target virtual DOM tree corresponding to the current page, generates a page rendering instruction based on the target virtual DOM tree, and sends the page rendering instruction to the rendering thread.

[0048] It should be noted that, in one embodiment, the target application may also be configured with a monitoring module to monitor whether the current page displayed by the target application on the client has experienced any page anomalies. The following description of page anomalies will be based on the example of a blank screen.

[0049] In practical applications, when the monitoring module detects a white screen phenomenon on the current page of the target application, indicating that the current page has met the abnormal conditions, the monitoring module can notify the logic thread to restore the current page from the white screen. The logic thread can then read the target virtual DOM tree corresponding to the current page and generate page rendering instructions based on the target virtual DOM tree. These page rendering instructions drive the rendering thread to render the page according to the target virtual DOM tree carried in the page rendering instructions. Finally, the logic thread sends the page rendering instructions to the rendering thread.

[0050] For example, when a user encounters a blank screen on the form-filling page while using a financial application, the monitoring module in the financial application can detect the page anomaly, and the logic thread can read the latest virtual DOM tree of the current form page, generate the corresponding page rendering instruction, and send the page rendering instruction to the rendering thread.

[0051] Further, reading the target virtual DOM tree corresponding to the current page includes:

[0052] Receive page exception handling instructions for the current page sent by the rendering thread;

[0053] In response to the page exception handling instruction, the target virtual DOM tree corresponding to the current page is read.

[0054] Among them, page exception handling instructions can be understood as instructions for handling exceptions that occur on the current page of the application, such as instructions for handling a blank screen.

[0055] In practical applications, the logic thread can also receive page exception handling instructions from the rendering thread for the current page of the target application. After receiving the page exception handling instructions, the logic thread begins to execute the page exception handling, including the page white screen recovery process. Furthermore, the logic thread can read the target virtual DOM tree corresponding to the current page, which is convenient for driving the rendering thread to re-render the current page based on the target virtual DOM tree, thus completing the white screen recovery work.

[0056] Furthermore, since page anomalies can be caused by different reasons, the rendering thread can generate different page anomaly handling instructions based on different page anomaly conditions; specifically, before receiving the page anomaly handling instructions for the current page sent by the rendering thread, the process also includes:

[0057] Determine the current page state, and determine the exception type of the page exception condition based on the page state, wherein the exception type includes a blank page and an unresponsive page.

[0058] Based on the exception type, generate a page exception handling instruction corresponding to the current page.

[0059] Among them, the blank page type can be understood as the state type where the current page content of the application cannot be displayed, such as a white display interface with only a "loading" icon shown; the unresponsive page type can be understood as the state type where the current page of the application does not respond when receiving interactive operations.

[0060] In practical applications, the rendering thread can determine the exception type of the current page by judging the current page state of the target application. Exception types include page blankness and page unresponsiveness. Continuing the example above, when the page exception for the form page is page blankness, the content displayed on the page will not be shown, only a "loading" icon will be displayed. When the page exception for the form page is page unresponsiveness, the form page will remain unresponsive when the user performs actions such as "clicking" or "entering" on the form page. Furthermore, the rendering thread generates page exception handling instructions corresponding to the current page based on the different exception types.

[0061] In one embodiment provided in this application, the logic thread can determine the target virtual DOM tree of the current page based on the timestamp of the virtual DOM tree of the current page, thereby re-rendering the current page; specifically, reading the target virtual DOM tree corresponding to the current page includes:

[0062] Read at least one virtual DOM tree of the current page;

[0063] The target virtual DOM tree for the current page is determined based on the timestamp of each virtual DOM tree.

[0064] In practical applications, the logic thread can cache at least one virtual DOM tree for the current page. Each page update or load will cache the corresponding virtual DOM tree. It should be noted that the number of virtual DOM trees cached by the logic thread can be determined based on the thread's cache memory capacity; this embodiment does not specify a particular number. Furthermore, the logic thread can determine the target virtual DOM tree for the current page by reading the timestamp of each virtual DOM tree. The target virtual DOM tree refers to the latest virtual DOM tree after the current page experiences a blank screen state. The goal is to obtain the latest virtual DOM tree and re-render it, enabling the current page to display the page content that would prevent a blank screen.

[0065] Further, determining the target virtual DOM tree of the current page based on the timestamp of each virtual DOM tree includes:

[0066] The at least one virtual DOM tree is sorted based on the timestamp of each virtual DOM tree;

[0067] The virtual DOM tree with the largest timestamp is determined as the target virtual DOM tree for the current page.

[0068] In practical applications, the logic thread sorts at least one virtual DOM tree based on the timestamp of each virtual DOM tree, selects the virtual DOM tree with the largest timestamp as the virtual DOM tree of the current page's latest state, and determines the virtual DOM tree of the latest state as the target virtual DOM tree.

[0069] For example, if the logic thread currently caches three virtual DOM trees with timestamps 1, 2, and 3, and the time order is progressively increasing, then by sorting the three virtual DOM trees, it can be determined that the virtual DOM tree corresponding to timestamp 3 is the virtual DOM tree of the current page.

[0070] It should be noted that when the application's page is updated in real time, the timestamp of the virtual DOM tree can represent whether the virtual DOM tree is in the latest state. In addition, in this embodiment, the target virtual DOM tree of the latest state of the current page can also be determined by other means, and no limitation is made in this embodiment.

[0071] Furthermore, based on the target virtual DOM tree, the logic thread can determine the elements to be rendered on the current page, and then generate page rendering instructions for the current page; specifically, generating page rendering instructions based on the target virtual DOM tree includes:

[0072] Parse the target virtual DOM tree to determine the elements to be rendered on the current page;

[0073] Based on the element to be rendered, generate the page rendering instruction corresponding to the current page.

[0074] In practical applications, the logic thread parses the target virtual DOM tree, determines all elements to be rendered on the current page, and generates page rendering instructions corresponding to the current page based on the elements to be rendered. This facilitates the subsequent rendering thread to render all the elements to be rendered on the current page, completing the page re-rendering process. It should be noted that the process of converting the target virtual DOM tree into instructions is not described in detail in this embodiment. The execution process of existing technologies can be referred to, and no limitation is made thereto.

[0075] The page processing method provided in this application embodiment allows the logic thread to read the target virtual DOM tree of the latest state of the current page and generate the page rendering instruction corresponding to the target virtual DOM tree when the page of the application experiences a white screen. This enables the subsequent rendering thread to re-render the current page according to the page rendering instruction, thereby solving the white screen problem.

[0076] Step 204: The rendering thread, in response to the page rendering instruction, renders the current page according to the target virtual DOM tree to generate the target page of the target application.

[0077] In practical applications, the rendering thread responds to page rendering instructions, parses the target virtual DOM tree according to preset rules, parses it into method calls for real node operations, and then re-renders the current page to update the page view and determine the target page of the target application.

[0078] Further, the step of rendering the current page according to the target virtual DOM tree in response to the page rendering instruction to generate the target page of the target application includes:

[0079] Parse the page rendering instructions and construct the real DOM tree corresponding to the target virtual DOM tree;

[0080] The current page is rendered based on the real DOM tree to generate the target page of the target application.

[0081] Specifically, the rendering thread can determine at least one element to be rendered corresponding to the target virtual DOM tree by parsing the page rendering instructions, and determine the real DOM tree based on each element to be rendered in the current page. It should be noted that the virtual DOM of the JS thread and the real DOM of the rendering thread are in real-time correspondence. Therefore, the rendering thread can re-render the current page based on the tree structure data corresponding to the real DOM tree to generate the target page of the target application. The specific rendering process is not specifically limited in this embodiment.

[0082] It is important to emphasize that in the logic thread, the real DOM tree structure is described by a JavaScript object, which can be called a virtual DOM tree. The advantage of the virtual DOM tree is that it is recorded using a JavaScript object, which facilitates subsequent comparison of differences between the virtual DOM trees, obtains the comparison results, and guides the updating of the page view. It plays a key role in the process of restoring the page from a blank screen. Therefore, in this embodiment, since the virtual DOM tree is synchronized with the page view in real time, in the initial stage of restoring the page from a blank screen, the virtual DOM tree is parsed again to obtain the corresponding page rendering instructions, which guide the rendering thread to complete the re-rendering of the page.

[0083] Another embodiment of this application provides a page processing method in which, when the current page of the target application is in a normal state, a logic thread is responsible for updating the page data, and a rendering thread is responsible for rendering the virtual DOM tree to be updated, so as to realize the interactive process of page data changes; specifically, the method further includes:

[0084] The rendering thread receives interactive operations for the target page, generates interactive instructions based on the interactive operations, and sends the interactive instructions to the logic thread.

[0085] When the target page of the target application is detected to be in normal condition, the logic thread, in response to the interaction command, generates a target virtual DOM tree; obtains a reference virtual DOM tree, compares the reference virtual DOM tree and the target virtual DOM tree to obtain a virtual DOM tree to be updated; generates a page update command based on the virtual DOM tree to be updated, and sends the page update command to the rendering thread.

[0086] The rendering thread, in response to the page update instruction, updates the target page according to the virtual DOM tree to be updated, and generates the updated page of the target application.

[0087] In practical applications, the rendering thread receives interactive operations from the target page of the target application, such as clicks and input, and generates corresponding interactive instructions. These instructions are then forwarded to the logic thread. This process indicates that the rendering thread is functioning normally. When the monitoring module detects that the target page is in a normal state in real time, it means that data changes in the rendering and logic threads have not been affected by network or other factors. Therefore, the logic thread can respond to the interactive instructions, generating the latest version of the target virtual DOM tree. Simultaneously, it can obtain a reference virtual DOM tree, which can be understood as the virtual DOM tree in the previous state before the latest state. By comparing the target and reference virtual DOM trees, the difference between the previous and current states can be determined. This difference virtual DOM tree can be understood as the virtual DOM tree to be updated. Based on this virtual DOM tree, a page update instruction for the target page is generated and sent to the rendering thread.

[0088] Furthermore, the rendering thread can update the target page based on the virtual DOM tree to be updated, according to the page update instructions, generating the updated page for the target application. It should be noted that, in this embodiment, the page update process between the logic thread and the rendering thread when data changes under normal page conditions is data-driven. When data changes, the data is parsed, and the differences between the old and new virtual DOMs are compared. The difference results are then converted into operation instructions for the real DOM nodes. The rendering thread parses the instructions, performs the node operations, and ultimately updates the view.

[0089] In summary, the page processing method provided in this application restores the page and saves the real-time state of the interface by notifying the logic thread to generate rendering instructions from the latest virtual DOM and resend them to the rendering thread when a white screen is detected due to a rendering thread crash or other reasons. This method eliminates the need for real-time monitoring of the real DOM, avoids the process of converting the real DOM to the virtual DOM, and does not require server support, reducing data conversion latency. Therefore, it improves the efficiency of page anomaly recovery and enhances the user experience.

[0090] Figure 3 A flowchart illustrating a page processing method for page updates according to an embodiment of this application is shown.

[0091] Step 302: After responding to an interactive operation on the current page of the target application, the rendering thread can generate an interactive instruction corresponding to the interactive operation and send the interactive instruction to the logic thread.

[0092] Step 304: The logic thread receives and executes the interaction instruction, generates the target virtual DOM tree of the current page, generates a rendering instruction based on the target virtual DOM tree, and sends the rendering instruction to the rendering thread. The rendering thread receives and executes the rendering instruction, renders the current page, and obtains the target page.

[0093] It should be noted that when the logic thread determines that the data needs to be changed based on the interaction instructions, it performs a difference comparison on the virtual DOM tree, converts the comparison result into a rendering instruction, and sends it to the rendering thread. The rendering thread parses the rendering instruction, converts it into a real DOM operation, and after responding to the interaction again, the rendering thread continues to convert it into instructions and sends them to the logic thread so that the logic thread can continue to implement the page data update process.

[0094] Additionally, see Figure 4 , Figure 4 A flowchart illustrating a page processing method for page restoration according to an embodiment of this application is shown.

[0095] Step 402: When the rendering thread determines that a white screen has occurred on the current page of the target application, it notifies the logic thread to restore the white screen.

[0096] Step 404: During the process of restoring the white screen page, the logic thread can read the latest target virtual DOM tree of the current page, convert it into rendering instructions based on the target virtual DOM tree, and send the rendering instructions to the rendering thread; this facilitates the rendering thread to parse the rendering instructions and redraw the current page, thus realizing the process of restoring the white screen page.

[0097] It should be noted that the process of the logic thread reading the target virtual DOM tree of the current page can be referred to the description in the above embodiments, and will not be elaborated on here.

[0098] In summary, the page processing method provided in this application can solve the page white screen phenomenon, effectively restore the page state, and improve the user experience; data conversion is more effective and direct, without the need to detect changes in real nodes, reducing performance overhead; in terms of data storage, it does not rely on external devices such as servers, reducing deployment difficulty and equipment costs, and directly integrates the white screen recovery mechanism into the framework, which automatically completes the white screen recovery action without the need to modify the code, thus reducing development costs.

[0099] Corresponding to the above method embodiments, this application also provides page processing apparatus embodiments. Figure 5 A schematic diagram of the structure of a page processing apparatus according to an embodiment of this application is shown. Figure 5As shown, the device is applied to a client running a target application, which includes a monitoring module 502, a logic thread 504, and a rendering thread 506. The device includes:

[0100] The monitoring module 502 is configured to send a page processing instruction to the logic thread when it detects that the current page of the target application meets the page abnormal conditions.

[0101] The logic thread 504 is configured to, in response to the page processing instruction, read the target virtual DOM tree corresponding to the current page, generate a page rendering instruction based on the target virtual DOM tree, and send the page rendering instruction to the rendering thread;

[0102] The rendering thread 506 is configured to render the current page according to the target virtual DOM tree in response to the page rendering instruction, thereby generating the target page of the target application.

[0103] The logic thread 504 is further configured to: read at least one virtual DOM tree of the current page; and determine the target virtual DOM tree of the current page based on the timestamp of each virtual DOM tree.

[0104] The logic thread 504 is further configured to: sort the at least one virtual DOM tree based on the timestamp of each virtual DOM tree; and determine the virtual DOM tree with the largest timestamp as the target virtual DOM tree of the current page.

[0105] The logic thread 504 is further configured to: receive a page exception handling instruction for the current page sent by the rendering thread; and, in response to the page exception handling instruction, read the target virtual DOM tree corresponding to the current page.

[0106] The rendering thread 506 is further configured to: determine the page state of the current page, and determine the exception type of the page exception condition based on the page state, wherein the exception type includes a blank page type and a page interaction unresponsive type; and generate a page exception handling instruction corresponding to the current page based on the exception type.

[0107] The logic thread 504 is further configured to: parse the target virtual DOM tree to determine the elements to be rendered on the current page; and generate page rendering instructions corresponding to the current page based on the elements to be rendered.

[0108] The rendering thread 506 is further configured to: parse the page rendering instructions, construct the real DOM tree corresponding to the target virtual DOM tree; render the current page according to the real DOM tree, and generate the target page of the target application.

[0109] Optionally, the rendering thread 506 is further configured to: receive interactive operations for the target page, generate interactive instructions based on the interactive operations, and send the interactive instructions to the logic thread;

[0110] If the target page of the target application is detected to be in normal condition, the logic thread 504 is further configured to: generate a target virtual DOM tree in response to the interaction instruction; obtain a reference virtual DOM tree, compare the reference virtual DOM tree and the target virtual DOM tree to obtain a virtual DOM tree to be updated; generate a page update instruction based on the virtual DOM tree to be updated, and send the page update instruction to the rendering thread;

[0111] The rendering thread 506 is further configured to: update the target page according to the virtual DOM tree to be updated in response to the page update instruction, and generate the updated page of the target application.

[0112] The page processing apparatus provided in this application, during the operation of the target application, completes the page exception handling process in the target application through a dual-thread combination of a logic thread and a rendering thread. Specifically, the logic thread reads the target virtual DOM tree corresponding to the abnormal page to generate page rendering instructions, driving the rendering thread to complete the re-rendering process of the current page, thus resolving the page exception phenomenon in the target application. This method only implements a one-way process of rendering from the virtual DOM tree to the real DOM tree, which can realize the re-rendering and recovery of the abnormal page of the target application, and complete the page exception handling. This avoids real-time monitoring of changes in the real DOM tree of the page, eliminates the conversion process from the real DOM tree to the virtual DOM tree, reduces the latency of data conversion, and thus improves the efficiency of page exception recovery and enhances the user experience.

[0113] The above is an illustrative scheme of a page processing apparatus according to this embodiment. It should be noted that the technical solution of this page processing apparatus and the technical solution of the page processing method described above belong to the same concept. For details not described in detail in the technical solution of the page processing apparatus, please refer to the description of the technical solution of the page processing method described above.

[0114] Figure 6A structural block diagram of a computing device 600 according to an embodiment of this application is shown. The components of the computing device 600 include, but are not limited to, a memory 610 and a processor 620. The processor 620 is connected to the memory 610 via a bus 630, and a database 650 is used to store data.

[0115] The computing device 600 also includes an access device 640, which enables the computing device 600 to communicate via one or more networks 660. Examples of these networks include Public Switched Telephone Network (PSTN), Local Area Network (LAN), Wide Area Network (WAN), Personal Area Network (PAN), or combinations of communication networks such as the Internet. The access device 640 may include one or more of any type of wired or wireless network interface (e.g., a network interface card (NIC)), such as an IEEE 802.11 Wireless Local Area Network (WLAN) wireless interface, a Wi-MAX (Worldwide Interoperability for Microwave Access) interface, an Ethernet interface, a Universal Serial Bus (USB) interface, a cellular network interface, a Bluetooth interface, a Near Field Communication (NFC) interface, and so on.

[0116] In one embodiment of this application, the aforementioned components of the computing device 600 and Figure 6 Other components, not shown, can also be connected to each other, for example, via a bus. It should be understood that... Figure 6 The block diagram of the computing device shown is for illustrative purposes only and is not intended to limit the scope of this application. Those skilled in the art can add or replace other components as needed.

[0117] The computing device 600 can be any type of stationary or mobile computing device, including mobile computers or mobile computing devices (e.g., tablet computers, personal digital assistants, laptop computers, notebook computers, netbooks, etc.), mobile phones (e.g., smartphones), wearable computing devices (e.g., smartwatches, smart glasses, etc.) or other types of mobile devices, or stationary computing devices such as desktop computers or personal computers (PCs). The computing device 600 can also be a mobile or stationary server.

[0118] The processor 620 implements the page processing method when executing the computer instructions.

[0119] The above is an illustrative scheme of a computing device according to this embodiment. It should be noted that the technical solution of this computing device and the technical solution of the page processing method described above belong to the same concept. For details not described in detail in the technical solution of the computing device, please refer to the description of the technical solution of the page processing method described above.

[0120] An embodiment of this application also provides a computer-readable storage medium storing computer instructions that, when executed by a processor, implement the steps of the page processing method as described above.

[0121] The above is an illustrative scheme of a computer-readable storage medium according to this embodiment. It should be noted that the technical solution of this storage medium and the technical solution of the page processing method described above belong to the same concept. For details not described in detail in the technical solution of the storage medium, please refer to the description of the technical solution of the page processing method described above.

[0122] The foregoing has described specific embodiments of this application. Other embodiments are within the scope of the appended claims. In some cases, the actions or steps recited in the claims may be performed in a different order than that shown in the embodiments and may still achieve the desired results. Furthermore, the processes depicted in the drawings do not necessarily require the specific or sequential order shown to achieve the desired results. In some embodiments, multitasking and parallel processing are also possible or may be advantageous.

[0123] The computer instructions include computer program code, which may be in the form of source code, object code, executable file, or some intermediate form. The computer-readable medium may include: any entity or device capable of carrying the computer program code, recording media, USB flash drive, portable hard drive, magnetic disk, optical disk, computer memory, read-only memory (ROM), random access memory (RAM), electrical carrier signals, telecommunication signals, and software distribution media, etc. It should be noted that the content contained in the computer-readable medium may be appropriately added to or subtracted according to the requirements of legislation and patent practice in the jurisdiction. For example, in some jurisdictions, according to legislation and patent practice, computer-readable media may not include electrical carrier signals and telecommunication signals.

[0124] It should be noted that, for the sake of simplicity, the foregoing method embodiments are all described as a series of actions. However, those skilled in the art should understand that this application is not limited to the described order of actions, as some steps may be performed in other orders or simultaneously according to this application. Furthermore, those skilled in the art should also understand that the embodiments described in the specification are preferred embodiments, and the actions and modules involved are not necessarily essential to this application.

[0125] In the above embodiments, the descriptions of each embodiment have different focuses. For parts not described in detail in a certain embodiment, please refer to the relevant descriptions of other embodiments.

[0126] The preferred embodiments disclosed above are merely illustrative of this application. The optional embodiments do not exhaustively describe all details, nor do they limit the invention to the specific implementations described. Clearly, many modifications and variations can be made based on the content of this application. These embodiments are selected and specifically described in this application to better explain the principles and practical applications of this application, thereby enabling those skilled in the art to better understand and utilize this application. This application is limited only by the claims and their full scope and equivalents.

Claims

1. A page processing method, characterized in that, Applied to a client running a target application, the target application including a logic thread and a rendering thread, the method includes: If the current page of the target application is found to meet the page abnormal conditions, the logic thread reads the target virtual DOM tree corresponding to the current page, generates a page rendering instruction based on the target virtual DOM tree, and sends the page rendering instruction to the rendering thread. The logic thread pre-caches at least one virtual DOM tree of the current page. Reading the target virtual DOM tree corresponding to the current page includes reading at least one virtual DOM tree of the current page and determining the target virtual DOM tree of the current page based on the timestamp of each virtual DOM tree. The rendering thread, in response to the page rendering instruction, renders the current page according to the target virtual DOM tree to generate the target page of the target application.

2. The method according to claim 1, characterized in that, Determining the target virtual DOM tree for the current page based on the timestamp of each virtual DOM tree includes: The at least one virtual DOM tree is sorted based on the timestamp of each virtual DOM tree; The virtual DOM tree with the largest timestamp is determined as the target virtual DOM tree for the current page.

3. The method according to claim 1, characterized in that, The step of reading the target virtual DOM tree corresponding to the current page includes: Receive page exception handling instructions for the current page sent by the rendering thread; In response to the page exception handling instruction, the target virtual DOM tree corresponding to the current page is read.

4. The method according to claim 3, characterized in that, Before receiving the page exception handling instruction for the current page sent by the rendering thread, the method further includes: Determine the current page state, and determine the exception type of the page exception condition based on the page state, wherein the exception type includes a blank page and an unresponsive page. Based on the exception type, generate a page exception handling instruction corresponding to the current page.

5. The method according to any one of claims 1-4, characterized in that, The generation of page rendering instructions based on the target virtual DOM tree includes: Parse the target virtual DOM tree to determine the elements to be rendered on the current page; Based on the element to be rendered, generate the page rendering instruction corresponding to the current page.

6. The method according to claim 5, characterized in that, The step of rendering the current page according to the target virtual DOM tree in response to the page rendering instruction to generate the target page of the target application includes: Parse the page rendering instructions and construct the real DOM tree corresponding to the target virtual DOM tree; The current page is rendered based on the real DOM tree to generate the target page of the target application.

7. The method according to claim 1, characterized in that, The method further includes: The rendering thread receives interactive operations for the target page, generates interactive instructions based on the interactive operations, and sends the interactive instructions to the logic thread. When the target page of the target application is detected to be in normal condition, the logic thread, in response to the interaction command, generates a target virtual DOM tree; obtains a reference virtual DOM tree, compares the reference virtual DOM tree and the target virtual DOM tree to obtain a virtual DOM tree to be updated; generates a page update command based on the virtual DOM tree to be updated, and sends the page update command to the rendering thread. The rendering thread, in response to the page update instruction, updates the target page according to the virtual DOM tree to be updated, and generates the updated page of the target application.

8. A page processing apparatus, characterized in that, Applied to a client, in which a target application runs, the target application including a monitoring module, a logic thread, and a rendering thread, the device includes: The monitoring module is configured to send a page processing instruction to the logic thread when it detects that the current page of the target application meets the page abnormal conditions. The logic thread is configured to respond to the page processing instruction, read the target virtual DOM tree corresponding to the current page, generate a page rendering instruction based on the target virtual DOM tree, and send the page rendering instruction to the rendering thread. The logic thread pre-caches at least one virtual DOM tree of the current page. Reading the target virtual DOM tree corresponding to the current page includes reading at least one virtual DOM tree of the current page and determining the target virtual DOM tree of the current page based on the timestamp of each virtual DOM tree. The rendering thread is configured to render the current page according to the target virtual DOM tree in response to the page rendering instruction, thereby generating the target page of the target application.

9. A computing device, comprising a memory, a processor, and computer instructions stored in the memory and executable on the processor, characterized in that, When the processor executes the computer instructions, it implements the steps of the method according to any one of claims 1-7.

10. A computer-readable storage medium storing computer instructions, characterized in that, When executed by a processor, the computer instructions implement the steps of the method according to any one of claims 1-7.

Images