A page processing method and related device
By checking and optimizing the online document page to be displayed in the inline frame, the flickering problem during the online document display process is solved and a smooth display effect is achieved.
Patent Information
- Application Number
- CN202210549627.7
- Authority / Receiving Office
- CN · China
- Patent Type
- Patents(China)
- Current Assignee / Owner
- Filing Date
- 2022-05-20
- Publication Date
- 2025-10-14
- Estimated Expiration
- 2042-05-20
AI Technical Summary
Online documents are prone to flickering during display, resulting in an unsmooth display.
By obtaining the online document page to be displayed, checking its flickering situation, and performing optimization processing in the inline frame, including modifying the attributes of the page elements or generating prompt information, to avoid flickering.
It achieves smooth display of online documents and improves the smoothness and effect of the display process.
Smart Images

Figure CN117150158B_ABST
Abstract
Description
TECHNICAL FIELD
[0001] The present application relates to the technical field of Internet, in particular to a page processing method, a page processing apparatus, a computer device, a computer readable storage medium and a computer program product. BACKGROUND
[0002] With the development of Internet technology, online documents are also more and more favored by Internet users. Online documents have convenient characteristics such as allowing multiple people to collaborate editing, being suitable for multiple types of devices, and being able to edit anytime and anywhere. Online documents are based on cloud storage, and usually rely on server rendering technology. The process of opening an online document by using a traditional server rendering technology mainly includes: when a user requests to access a certain online document, the server renders components written by using React (a development framework) in a document page of the online document into an HTML (HyperText Mark-up Language) Dom (Document Object Model) string based on the request, and returns the string to a browser for rendering (for example, using Canvas rendering) and display. In the above process, the server uses a heterogeneous DOM scheme to try to ensure that page elements in the document page of the online document can be aligned, but before the document page is displayed, the browser is difficult to completely reuse the Dom node generated by the server to bind operation events related to the document page, which requires the browser to re-render and replace the existing DOM node, which may cause the possibility of flickering (i.e., the page elements flicker, change or jump) when the document page of the online document is displayed. SUMMARY
[0003] The embodiments of the present application provide a page processing method, related device and storage medium, which can avoid the flickering of the online document when displayed, and improve the smoothness of the online document display process.
[0004] In one aspect, the embodiments of the present application provide a page processing method, which comprises:
[0005] obtaining a document page of an online document to be displayed;
[0006] if the document page to be displayed flickers, performing optimization processing on the document page to be displayed according to the flickering condition;
[0007] displaying the document page after optimization processing.
[0008] In one aspect, the embodiments of the present application provide a page processing apparatus, which comprises:
[0009] An acquiring unit, configured to acquire a document page of an online document to be displayed;
[0010] a processing unit configured to optimize the document page to be displayed according to the flickering condition if the document page to be displayed flickers;
[0011] The display unit is used to display the optimized document page.
[0012] In one embodiment, when acquiring the document page of the online document to be displayed, the acquiring unit may be specifically configured to:
[0013] Loading the document page of the online document according to the page data of the online document;
[0014] The page data includes any one or more of the following: direct data, style data, resource data, and script data.
[0015] In one embodiment, the processing unit is further configured to:
[0016] Based on the loaded document page, the flashing condition corresponding to the document page to be displayed is checked.
[0017] In one embodiment, when the processing unit checks the flashing condition corresponding to the document page to be displayed based on the loaded document page, it can be specifically configured to:
[0018] Create an inline frame within the loaded document page;
[0019] Check the changes of the loaded document page in the inline frame during the loading process;
[0020] The flash jump situation corresponding to the document page to be displayed is determined based on the change difference.
[0021] In one embodiment, the loading process includes a direct output phase and a stabilization phase; the direct output phase is used to load and present the direct output data of the online document; the stabilization phase is used to present the document page after loading;
[0022] When the processing unit checks the changes and differences of the loaded document page during the loading process in the inline frame, it can be specifically used to:
[0023] Get direct data from online documents;
[0024] Display straight-out data in an inline frame;
[0025] Compare the changes between the page elements of the loaded document page and the page elements presented in the inline frame of the direct-output data.
[0026] In an embodiment, the loading process comprises a resource loading stage and a script execution stage; the resource loading stage is configured to load style data and / or resource data of the online document; the script execution stage is configured to execute script data of the online document.
[0027] The processing unit can be specifically configured to:
[0028] During the loading process, the page change information of the loaded document page in the resource loading stage and the script execution stage is recorded;
[0029] The playback operation is performed based on the recorded page change information in the inline frame;
[0030] The change difference between the page elements of each frame page presented during the playback operation in the inline frame is compared frame by frame.
[0031] In an embodiment, the processing unit can be specifically configured to:
[0032] If the change difference exceeds the preset flicker range, it is determined that the document page to be displayed has flicker, and the change difference is determined as the flicker condition of the document page to be displayed.
[0033] In an embodiment, the processing unit can be specifically configured to:
[0034] According to the flicker condition, the properties of the page element with flicker are modified in the inline frame, so that the change difference is within the preset flicker range; the properties include one or more of the following: position, style, size; the page data of the online document is updated according to the modification;
[0035] The display unit can be specifically configured to:
[0036] The updated page data of the online document is rendered based on the updated page data of the online document, and the rendered document page is displayed.
[0037] In an embodiment, the processing unit can be specifically configured to:
[0038] The processing unit can be specifically configured to:
[0039] The display unit can be specifically configured to:
[0040] The page data of the online document is rendered based on the page data of the online document.
[0041] in the rendering process, outputting the prompt information;
[0042] when the rendering is completed, stopping displaying the prompt information and displaying the rendered document page.
[0043] In an embodiment, the obtaining unit, when obtaining the document page of the online document to be displayed, can be specifically configured to:
[0044] obtain target version data corresponding to the document page of the online document to be displayed.
[0045] In an embodiment, the online document is generated by N objects in collaborative editing, N is an integer greater than or equal to 2, the online document includes M version data, each version data corresponds to a version of document page; the M version data is generated based on the creation and each collaborative editing of the online document, and the M version data is stored in a cache space; the processing unit is further configured to:
[0046] determine whether the target version data is the version data already stored in the cache space;
[0047] if not, it is determined that the document page to be displayed has a flicker.
[0048] In an embodiment, the processing unit, when performing optimization processing on the document page to be displayed according to the flicker condition, can be specifically configured to:
[0049] generate prompt information according to the flicker condition, wherein the prompt information is used to prompt and replace the rendering process of the document page to be displayed;
[0050] The display unit, when displaying the document page after optimization processing, can be specifically configured to:
[0051] render based on the target version data of the online document;
[0052] in the rendering process, outputting the prompt information;
[0053] when the rendering is completed, stopping displaying the prompt information and displaying the rendered document page.
[0054] On the one hand, the embodiments of the present application provide a computer device, which comprises:
[0055] a processor adapted to execute a computer program;
[0056] a computer readable storage medium, the computer readable storage medium storing a computer program, and the computer program is executed by the processor to implement the page processing method as described above.
[0057] In one aspect, the embodiment of the present application provides a computer readable storage medium, which stores a computer program, the computer program is loaded and executed by a processor to implement the page processing method.
[0058] In one aspect, the embodiment of the present application provides a computer program product, which comprises a computer program stored in a computer readable storage medium, and the computer program is executed by a processor to implement the page processing method.
[0059] In the embodiment of the present application, the document page of the online document to be displayed is acquired, if the document page to be displayed has a flicker, the document page to be displayed is processed according to the flicker condition, and the processed document page is displayed, the flicker condition is processed in a targeted manner, so that the flicker problem of the document page to be displayed in the display process can be avoided, the smooth display of the online document can be realized by displaying the processed document page, the smoothness in the display process of the online document is improved, and the display effect of the online document is improved. BRIEF DESCRIPTION OF DRAWINGS
[0060] In order to more clearly illustrate the technical solutions in the embodiments of the present application or the prior art, the drawings needed to be used in the embodiments or the prior art description will be briefly introduced. Obviously, the drawings in the following description are only some embodiments of the present application, and other drawings can be obtained by those skilled in the art without creative labor.
[0061] Figure 1 is an architecture diagram of a page processing system provided by an exemplary embodiment of the present application;
[0062] Figure 2 is a flowchart of a page processing method provided by an exemplary embodiment of the present application;
[0063] Figure 3a is a schematic diagram of a document page to be displayed provided by an exemplary embodiment of the present application;
[0064] Figure 3b is a schematic diagram of an online document displayed in a link form provided by an exemplary embodiment of the present application;
[0065] Figure 3c is a document page loading schematic diagram of an online document provided by an exemplary embodiment of the present application;
[0066] Figure 3d is a schematic diagram of checking the change difference of the document page of the online document to be displayed in the loading process provided by an exemplary embodiment of the present application;
[0067] Figure 3e is a schematic diagram of direct data in different scenarios provided by an example embodiment of the present application;
[0068] Figure 3f is a schematic diagram of comparing the page elements presented in the inline frame after adjusting the transparency and the page elements of the document page after loading completion provided by an example embodiment of the present application;
[0069] Figure 4 is a flowchart of a page processing method provided by an example embodiment of the present application;
[0070] Figure 5a is a schematic diagram of a document page of an online document provided by an example embodiment of the present application;
[0071] Figure 5b is a schematic diagram of outputting prompt information provided by an example embodiment of the present application;
[0072] Figure 6a is a schematic diagram of displaying a document page of an online document provided by an example embodiment of the present application;
[0073] Figure 6b is a schematic diagram of outputting prompt information provided by another example embodiment of the present application;
[0074] Figure 7 is a flowchart of a page processing method provided by another example embodiment of the present application;
[0075] Figure 8 is a structural schematic diagram of a page processing apparatus provided by an example embodiment of the present application;
[0076] Figure 9 is a structural schematic diagram of a computer device provided by an example embodiment of the present application. DETAILED DESCRIPTION
[0077] The technical solutions in the embodiments of the present application will be described clearly and completely below with reference to the drawings in the embodiments of the present application. Obviously, the described embodiments are only part of the embodiments of the present application, rather than all the embodiments. Based on the embodiments in the present application, all other embodiments obtained by those of ordinary skill in the art without any creative work fall within the scope of protection of the present application.
[0078] The terms related to the embodiments of the present application will be introduced below.
[0079] I. Online document and document page
[0080] An online document is a document that is stored in the cloud and can be edited online. Objects can directly view the online document by linking it or scanning a QR code. When an online document is edited, the edited document is automatically saved, eliminating the need to save it separately, effectively preventing data loss due to various factors. An online document can be a document that allows a single object to view and edit it, or it can be a document that allows multiple objects to view or edit it at the same time and in different locations. Online documents can solve the problem of communication difficulties between objects in different locations and departments, and can effectively enable objects to complete a series of actions such as editing and discussing together at any location. The formats of online documents can include, but are not limited to: doc, sheet, slide, form, pdf; a document page can refer to a detailed page that displays the document content of an online document.
[0081] 2. Page Data
[0082] Page data may refer to the data required to load the document page of an online document. The page data may include any one or more of the following: direct-out data, style data, resource data, and script data. Among them, direct-out data refers to data that can be directly loaded by the client and displayed as a document page. The direct-out data may include page elements, document content, etc. in the document page that the object can see. Style data refers to CSS (Cascading Style Sheets) data, which can be used to control the layout of the element position in the document page and change the font, color, size, etc. in the element. Resource data may include but is not limited to image resources and video resources. Script data may include the js (JavaScript, a programming language) script of the online document, and the script data can be used to add a variety of dynamic functions to the display of the document page of the online document.
[0083] 3. Inline frame iframe
[0084] An iframe is an HTML (Hypertext Markup Language) tag used to create an inline frame (i.e., an inline frame) within a document and embed another document within the inline frame; or embed a floating frame within a document.
[0085] The embodiment of the present application provides a page processing solution, which can be applied to the scenario of opening an online document using a PC (Personal Computer), H5 (HTML5, the fifth generation Hypertext Markup Language), a mini-program, etc. Specifically: before displaying the document page of the online document, first determine whether there will be a flickering problem in the document page to be displayed. In the case that the document page flickers, the document page to be displayed can be optimized first, and then the optimized document page can be displayed. By predicting the flickering situation of the document page to be displayed and performing targeted optimization processing according to the flickering situation, the flickering problem of the document page to be displayed during the display process can be avoided. By displaying the optimized document page, the smooth display of the online document can be achieved, the smoothness of the online document display process can be improved, and the display effect of the online document can be improved.
[0086] Next, we will introduce the page processing system provided by this application. Figure 1 , Figure 1 This is an architectural diagram of a page processing system provided by an embodiment of the present application. Figure 1 As shown, the page processing system may include a computer device 101, a computer device 102, and a server 103. This application does not limit the number of computer devices. Of course, the number of servers may also be multiple, and this application still does not limit the number of servers. The computer device 101 and the server 103 in the page processing system can be directly or indirectly connected via wired or wireless communication, and the computer device 101 and the computer device 102 can exchange information through the server 103. Among them:
[0087] Any computer device can run a variety of clients, and the client can be an instant messaging client, a browser that displays web pages, a small program (i.e., an application that can be used without installation), etc. The client can be used to display document pages of various documents. For example, the client can display the document page of an online document. Among them, before displaying the document page of the online document, the computer device can determine whether the document page has any jumps, and optimize the document page if there are jumps. When any object uses a computer device (such as computer device 101) to edit an online document, the edited document page of the online document will be displayed in other computer devices (such as computer device 102) through server 102. That is to say, multiple objects can use their respective computer devices to view and edit the same online document. The objects involved in the embodiments of the present application may refer to users using computer devices, editors with permission to edit online documents, etc. The above-mentioned computer devices may include but are not limited to smartphones, tablet computers, laptops, desktop computers, smart speakers, smart watches, car terminals, smart wearable devices, etc.
[0088] Server 103 may correspond to a client and be a server that provides technical support for the services provided by the client. Server 103 stores page data of various documents and may send the stored page data of the documents to computer device 101. Server 103 may be an independent physical server, or a server cluster or distributed system composed of multiple physical servers. It may also be a cloud server that provides basic cloud computing services such as cloud services, cloud databases, cloud computing, cloud functions, cloud storage, network services, cloud communications, middleware services, domain name services, security services, CDN (Content Delivery Network), and big data and artificial intelligence platforms.
[0089] In one embodiment, the page processing flow between the computer device 101 and the server 103 is described as an example. The page processing flow includes:
[0090] (1) When an object wants to open a document page of an online document through a client of computer device 101, a data acquisition request may be generated, the data acquisition request carrying a document identifier, and the data acquisition request may be sent to server 103. In this embodiment, the object may refer to a user, specifically a user on the client side, or may be understood as a user of the online document, for example, a requester requesting to open a document page of an online document for use.
[0091] (2) The server 103 receives the data acquisition request, acquires the page data of the online document based on the document identifier, and returns the page data of the online document to the client in the computer device 101.
[0092] (3) After receiving the page data of the online document, the client of the computer device 101 may pre-determine whether the document page to be displayed has flickering based on the page data. In one implementation, the pre-determination may be performed by preloading. Specifically, the client of the computer device 101 may pre-load the document page of the online document based on the page data, and check whether the document page to be displayed has flickering based on the loaded document page. It should be understood that after the document page of the online document is preloaded, the loaded document page is not immediately displayed to the object. Instead, the loaded document page is first used to determine whether the document page to be displayed has flickering, and then the result of the flickering judgment is used to decide how to optimize and display the document page; for example: if it is determined that the document page to be displayed has flickering, the document page to be displayed can be optimized (such as adjusting the attributes of the page elements in the document page), and the optimized document page can be rendered, and then the rendered document page can be displayed, so that a flicker-free display effect can be achieved; if it is determined that the loaded page document does not have flickering, there is no need to perform any processing on the document page, and the document page of the loaded online document can be directly displayed.
[0093] In another implementation, if the online document is in a collaborative editing scenario, a prejudgment can also be made by comparing the version data. Specifically: the client of the computer device 101 determines whether the target version data corresponding to the document page to be displayed has been cached. If it has been cached, then the target version data is data that can be directly displayed and will not cause the document page to flash. It can be determined that there is no flash in the document page to be displayed; if it has not been cached, it means that the target version data has been updated due to collaborative editing, and there will be a flash. It can be determined that there is a flash in the document page to be displayed. If it is determined that there is a flash in the document page to be displayed, the document page to be displayed can be optimized (for example, displaying Loading to replace various displays in the rendering process), and the optimized document page can be rendered, and then the rendered document page can be displayed; in this way, a flash-free display effect can be achieved.
[0094] Through the above-mentioned page processing system, before displaying the document page of the online document, the embodiment of the present application first determines whether the document page to be displayed will have a flickering problem. If the document page flickers, the document page to be displayed can be optimized first, and then the optimized document page can be displayed. By predicting the flickering situation of the document page to be displayed and performing targeted optimization processing according to the flickering situation, the flickering problem of the document page to be displayed during the display process can be avoided. By displaying the optimized document page, the smooth display of the online document can be achieved, the smoothness of the online document display process can be improved, and the display effect of the online document can be improved; even if the online document is in a collaborative editing scenario, the online document can still obtain a flicker-free and smooth display effect on the computer devices of each collaborator, thereby improving the display performance of the online document.
[0095] Based on the above page processing system, please refer to Figure 2 , Figure 2 This is a flow chart of a page processing method provided by an exemplary embodiment of the present application. The page processing method can be executed by the aforementioned computer device, and more specifically, can be executed by a client in the computer device. The page processing method described in this embodiment may include the following steps S201-S203:
[0096] S201: Obtain a document page of an online document to be displayed.
[0097] Among them, the online document can be a document in various formats, such as doc, sheet, slide, form, pdf and other formats. The online document can refer to a document that supports editing by a single object, or the online document can refer to a document that supports collaborative editing by N objects, where N is an integer greater than or equal to 2. The above-mentioned online document can be an empty document, that is, the document page does not include document content, but only page elements. Of course, the above-mentioned online document can contain document content and page elements, etc., and the page elements include but are not limited to: various components and various options in the document page, etc., which are not limited in this application. For example, the document page of an online document can be as follows: Figure 3a As shown, the area 301 in the document page displays the document content, and the area 302 in the document page displays the page elements (i.e. Figure 3a , page element 31, page element 32, page element 33, and so on).
[0098] Any object can trigger an online document that you want to view or edit. In response to the trigger operation on the online document, the document page of the online document to be displayed can be obtained. The trigger operation can be clicking on the document link of the online document, scanning a QR code, etc. For example, Figure 3bAs shown, in the session interface, a document link 34 of an online document is displayed, and the document link 34 can be clicked. In response to the click operation of the document link, a document page of the online document to be displayed can be acquired.
[0099] The acquisition of the document page of the online document to be displayed can be loading the document page of the online document by a preloading manner, and the preloaded document page can be used to check whether the document page to be displayed has a flicker. The computer device can acquire page data of the online document, and load the document page of the online document according to the page data of the online document. The page data can include one or more of the following: direct output data, style data, resource data, and script data.
[0100] In an embodiment, the loading of the document page of the online document based on the page data of the online document can undergo five stages, and the loading process can be as follows Figure 3c As shown, the loading process can include a direct output stage, a resource loading stage, a script execution stage, a stable stage, and an object interaction stage. The page elements in the finally displayed document page in the five stages are in a stable state. The direct output stage can be used to load and present the direct output data of the online document, the resource loading stage can be used to load the style data and / or resource data of the online document, the script execution stage can be used to execute the script data of the online document, the stable stage can be used to present the loaded document page (also referred to as the first screen content, which refers to the first displayed document page). The object interaction stage can be used for object and online document interaction, changing page data, and the like.
[0101] To ensure smooth, flicker-free display of the document page of an online document, two dimensions can be considered. One dimension is result stability, which requires considering the differences in changes between the direct-output phase and the stable phase of the loading process. The direct-output phase loads and renders direct-output data, meaning the subject can see the page elements corresponding to the direct-output data. The stable phase renders the loaded document page, meaning the subject can see the page elements within the first-screen content of the document page. If there are jitters and inconsistencies between the page elements rendered in the direct-output phase and the stable phase, the document page display process will experience flickering. The other dimension is process stability, which requires considering the differences in changes between the resource loading phase and the script execution phase of the loading process; both the resource loading phase and the script execution phase can cause flickering issues in the document page. During the resource loading phase, the style data and / or resource data loaded from the server will affect the loading and presentation of the direct-output data and may change the layout of the document page, causing the document page to flicker. For example, the image resources loaded during the resource loading phase are likely to change the position layout of the page elements in the document page due to factors such as the image size, causing the document page to flicker. During the script execution phase, the script data loaded from the server, whether it is directly changing the direct-output data or replacing the direct-output data with the actual rendering of the product, will cause flickering problems to a certain extent when executing the script data because the actual rendering and the loaded and presented direct-output data cannot be restored consistently.
[0102] Therefore, after the computer device loads the document page of the online document according to the page data of the online document, it can determine whether the document page to be displayed has flickering based on the loaded document page. If it is determined that the document page to be displayed has flickering, step S202 can be executed. If it is determined that the document page to be displayed has not flickering, the loaded document page can be directly displayed.
[0103] It should be understood that the above-mentioned loading of the document page of the online document according to the page data of the online document is actually a process of rendering according to the page data to obtain the rendered document page.
[0104] S202: If the document page to be displayed has flickering, optimize the document page to be displayed according to the flickering situation.
[0105] When the document page to be displayed has flickering, it is difficult to locate minor differences in the style and position of the page elements of the document page through the object. Therefore, in the embodiment of the present application, if the document page to be displayed has flickering, the flickering situation corresponding to the document page to be displayed can be checked based on the loaded document page, and the document page to be displayed can be optimized according to the flickering situation. By checking the flickering situation corresponding to the document page to be displayed through the loaded document page, it is possible to judge the flickering by intuition and experience without relying on the human eye gaze of an object (such as a user), and it is possible to more accurately determine whether the document page to be displayed has flickering.
[0106] Among them, in the process of checking the flash jump situation corresponding to the document page to be displayed based on the loaded document page, since the direct-out stage may disappear very quickly, an inline frame iframe can be introduced, through which the page element situation of the direct-out stage can be reproduced, so that the change difference of the document page during the loading process can be detected, and the tiny flash jump of the page elements can be accurately quantified. At this time, the computer device checking the flash jump situation corresponding to the document page to be displayed based on the loaded document page can include: creating an inline frame within the loaded document page, and checking the change difference of the document page of the online document to be displayed during the loading process in the inline frame, and then determining the flash jump situation corresponding to the document page to be displayed based on the change difference.
[0107] Regarding the above-mentioned stages where document pages may flash, the flash problem of document pages can be viewed from two dimensions: (1) the result stability dimension, which requires considering the difference in changes between the direct-out stage and the stable stage, that is, whether the page the object starts to see (that is, the page presented by direct-out data loading) and the document page presented in the stable stage are consistent; (2) the process stability dimension, which requires considering the difference in changes between the resource loading stage and the script execution stage; that is, whether the document page displayed during the loading process is always consistent. Regarding these two dimensions, the embodiments of the present application respectively use the following different methods to check the difference in changes of the document page of the online document to be displayed during the loading process in the inline frame, which can accurately and conveniently locate the page jumps at each stage.
[0108] (1) Result stability dimension: The specific implementation process of checking the change difference of the document page of the online document to be displayed during the loading process in the inline frame can be as follows: Figure 3dAs shown, after the document page is loaded, the data acquisition function can be called to send a data acquisition request to the server. The data acquisition request can carry the document identifier of the online document. The server can obtain the direct-out data corresponding to the online document according to the document identifier and return the direct-out data to the computer device; the computer device can obtain the direct-out data and display the direct-out data in the created inline frame, and then compare the changes between the page elements of the loaded document page and the page elements presented in the inline frame by the direct-out data.
[0109] Among them, direct-out data includes page templates (such as online meeting minutes templates, online spreadsheet documents, etc.) and page direct-out content; page direct-out content refers to the target DOM string corresponding to the page element that needs to be displayed directly in the document page, that is, the direct-out display of direct-out data is rendered after superimposing the target Dom element string in the page template. The target Dom string can be obtained based on server-side rendering technology (Server-Side Rendering, SSR technology), that is, based on SSR technology, the page elements in the document page can be rendered into HTML DOM strings in advance; the client can request the target DOM string that needs to be directly output from the server. Since the direct-out data includes a combination of page templates and page direct-out content, there can be multiple combinations of direct-out data based on different sources, such as Figure 3e As shown, the page template can be stored in a local development server on the computer device side, an online server, a local storage space on the computer device side, etc., and the page direct-out content can be stored in a local development server on the computer device side, a test SCF (cloud function), an existing network SCF, etc. Therefore, in an embodiment of the present application, the computer device can select a suitable combination method to obtain direct-out data according to actual conditions, such as the ease of acquisition or the application scenario; for example: based on scenario requirements and network quality, the computer device can obtain the page template from the local storage space, obtain the page direct-out content from the server, and combine the two into direct-out data. For another example: the computer device can also obtain the direct-out data formed by the combination of the page template and the page direct-out content from the server; and so on.
[0110] The specific implementation method of comparing the change differences between the page elements of the loaded document page and the page elements presented in the inline frame of the direct-output data can be: setting the transparency of the inline frame, for example, setting the transparency to 100%, 80%, etc.; by setting the transparency of the inline frame, it is convenient to compare the change differences between the page elements of the loaded document page and the page elements presented in the inline frame, that is, through the setting of transparency, the page elements presented in the inline frame and the page elements of the loaded document page can be intuitively viewed, and which page elements have flashed can be intuitively viewed, so that the page elements that have flashed can be quickly determined, wherein the number of page elements that have flashed can be one or more. It should be understood that the change differences between the page elements can not only determine whether the document page has flashed, but also specifically determine the page elements in the document page that have flashed.
[0111] For example, Figure 3f As shown, the page elements presented in the inline frame after adjusting the transparency overlap with the page elements of the document page after loading. Figure 3f It can be seen that there is a difference in the changes between the page element "Share" option 35 of the loaded document page and the page element "Share" option 36 presented in the inline frame of the direct-out data, which means that the page the object starts to see (i.e., the page presented by the loading of the direct-out data) and the document page presented in the stable stage are inconsistent. At this time, it is determined that the page element "Share" has flashed, and the change difference corresponding to the page element "Share" option is determined based on the location of the page element "Share" option 35 and the location of the page element "Share" option 36. For another example, there is a difference in the changes between the page element Add Object Option 37 of the loaded document page and the page element Add Object Option 38 presented in the inline frame of the direct-out data. It can be determined that the page element Add Object Option has flashed. The change difference corresponding to the page element Add Object Option is determined based on the location of the page element Add Object Option 37 and the page element Add Object Option 38.
[0112] (2) Process stability dimension: Since the loaded document page is constantly changing during the resource loading stage and the script execution stage, and there is no means to control the rendering of each frame of the page, the embodiment of the present application can use video recording to obtain the page change situation during the loading process, and check the changes of page elements frame by frame based on the page change situation to achieve quantification of the flash of page elements. During the loading process, the page change information of the loaded document page during the resource loading stage and the script execution stage can be recorded, and the playback operation can be performed in the inline frame based on the recorded page change information. Then, the change differences between the page elements of each frame page presented during the playback operation in the inline frame are compared frame by frame. According to the change differences, it can be determined whether the page is always consistent during the page loading process; wherein, the page change information may include: pictures, CSS resources and js execution status of each frame page. In the inline frame, the change differences between the page elements of each frame page can be restored based on the recorded pictures, CSS resources and js execution status of each frame page. Since the display of the document page can be implemented based on SSR technology, the playback operation in the inline frame can also be understood as restoring the loading rhythm of the Dom string during the loading process, thereby achieving flash quantification during the resource loading stage and the script execution stage. In one embodiment, the page change information of the loaded document page within a short time interval of two frames in the resource loading stage and the script execution stage can be recorded; the page change information of the loaded document page within a time interval of multiple frames (i.e., greater than 2) in the resource loading stage and the script execution stage can also be recorded.
[0113] Among them, the change differences between the page elements of each frame page presented when the playback operation is performed in the inline frame in frame-by-frame comparison can refer to: the change differences between the same page elements in each frame page when the playback operation is performed in the inline frame in frame-by-frame comparison, for example, the change differences between page element 1 of the first frame page and page element 1 of the second frame page; or, the change differences between adjacent page elements of each frame page when the playback operation is performed in the inline frame in frame-by-frame comparison, such as the relative position 1 between page element 1 and the page element of the first frame page, and the relative position 2 between page element 1 and the page element of the second frame page, and the change difference is the difference between relative position 1 and relative position 2.
[0114] The method for recording page change information of the loaded document page during the resource loading phase and the script execution phase can be: the client in the computer device is configured with an API (Application Programming Interface), and the client API can be directly called to record the page change information of the loaded document page during the resource loading phase and the script execution phase during the loading process. The client API can be, for example, a browser API, an instant messaging application API, etc.
[0115] After determining the change difference, the flash jump situation corresponding to the document page to be displayed is determined based on the change difference. The computer device can determine whether the above-mentioned change difference exceeds the preset flash jump range. If it is determined that the change difference exceeds the preset flash jump range, it is determined that the document page to be displayed has a flash jump, and the change difference is determined as the flash jump situation corresponding to the document page to be displayed. If it is determined that the change difference does not exceed the preset flash jump range, it is determined that the document page to be displayed does not have a flash jump. The preset flash jump range can be set according to demand. For example, the change difference between the page element "Share" option 35 of the loaded document page and the page element "Share" option 36 presented in the inline frame of the direct-out data is 2PX (pixel unit), the preset flash jump range is 1PX, and it is determined that the change difference exceeds the preset flash jump range. At this time, it can be determined that the document page to be displayed has a flash jump, and the change difference 2PX is determined as the flash jump situation corresponding to the document page to be displayed.
[0116] Furthermore, the document page to be displayed can be optimized according to the flash jump situation to prevent the page document from flashing. In one embodiment, the document page to be displayed can be optimized according to the flash jump situation by modifying the attributes of the page element with flashing in the inline frame according to the flash jump situation (such as Figure 3d As shown, it can be modified directly in the inline frame) so that the change difference is within the preset flash range, wherein the attributes include one or more of the following: position, style, size; by modifying the attributes of the page element in the inline frame, the consistency of the page element of the flashing page and the loaded document page in the inline frame can be compared in real time, thereby achieving more accurate quantitative differences and accurately optimizing the document page. For example, the above-mentioned flash situation includes a change difference of 2PX, and the computer device can modify the position of the "Share" option 36 of the page element with the flash in the inline frame according to the flash situation, such as moving the "Share" option 36 by 2PX. Then, by Figure 3dThe developer debugging tool in the update process updates the page data of the online document according to the above modifications, that is, the developer debugging tool can update the attributes of the corresponding page elements in the page data of the online document according to the attributes of the modified flashing page elements, wherein the developer debugging tool can be a tool that comes with the client in the computer device.
[0117] In another embodiment, without adjusting the properties of the page element that causes the flash, the document page to be displayed can be directly prevented from flashing by using a weak prompt. In this case, optimizing the document page to be displayed based on the flash situation may include generating prompt information based on the flash situation, and the prompt information can be used to prompt and replace the prompt during the rendering process of the document page to be displayed.
[0118] Among them, when choosing to optimize the document page to be displayed, the document page to be displayed can be optimized for anti-flash in combination with different application scenarios. If the application scenario is the development stage, you can choose to modify the attributes of the page elements with flashing based on the difference in changes directly in the inline frame, and update the page data of the document page to achieve anti-flash optimization. In this way, in the process of restoring the local code to the rendered page, it can be convenient to assist in the flash range before and after the development page. That is to say, in the development stage, the flash of the document page of the online document to be displayed is controlled to be within the acceptable flash range (that is, the preset flash range); at the same time, it also solves the problem that small flashes cannot be quantified and can only be compared visually through repeated debugging; in addition, it also solves the problem that cloud functions need to be repeatedly compiled and deployed, and the page refreshed to view the effect during the development and testing stages. For example, if the application scenario is the debugging and testing online stage, anti-flash optimization can be achieved directly through weak prompts.
[0119] S203: Display the optimized document page.
[0120] As can be seen from step S202, the optimization processing performed on the document page to be displayed varies depending on the flashing situation, and therefore the process for displaying the optimized document page also varies. When optimizing the document page to be displayed by modifying the attributes of the flashing page element in the inline frame based on the flashing situation, displaying the optimized document page may include rendering based on the updated online document page data and displaying the rendered document page after rendering.
[0121] When prompt information is generated based on the flash situation to optimize the document page to be displayed, the document page after display optimization can be: rendered based on the page data of the online document, and output the prompt information during the rendering process. After the rendering is completed, the prompt information is stopped from being displayed, and the rendered document page is displayed.
[0122] In the embodiment of the present application, the document page of the online document to be displayed is acquired, if the document page to be displayed has a flicker, the document page to be displayed is processed according to the flicker condition, and the processed document page is displayed, so that the flicker of the document page to be displayed in the display process can be avoided, and the smooth display of the online document can be realized, the smoothness in the display process of the online document is improved, and the display effect of the online document is improved.
[0123] Based on the above page processing scheme, please refer to Figure 4 , Figure 4 is a flowchart of a page processing method provided by an exemplary embodiment of the present application. The page processing method can be executed by the computer device described above, and more specifically, can be executed by the client in the computer device. The page processing method described in the embodiment can include the following steps S401-S404.
[0124] S401, acquiring target version data corresponding to the document page of the online document to be displayed.
[0125] In the embodiment of the present application, the online document can be generated by N objects for collaborative editing; the online document can include M version data, and each version data can correspond to a version of document page. For example, as shown in Figure 5a , the region 51 in the document page displays object information (such as the avatar of the object) of the N objects, and the data region 52 displays the version data. The target version data can be any one of the M version data, or the target version data can be a new version data generated by the N objects for collaborative editing (i.e., not any one of the M version data). The target version data can include document content, page elements, etc.
[0126] The above M version data can be generated based on the creation of the online document and each collaborative editing. The creation of the online document can include at least one of the following: document template creation and version data import. It should be understood that the M version data can include but is not limited to the version data generated when the online document is created (at this time, the version data is also the initial version data, which can include the title of the newly created online document, etc.), and the version data generated by the N objects for collaborative editing. The M version data can be stored in a cache space, which can be a redis (Remote Dictionary Server) cache, a local space, etc.
[0127] In an N-object cooperation scenario (such as a multi-person cooperation scenario), when N objects simultaneously open the same online document, the document page may have a flicker (for example, a data region in the document page has a flicker) due to a cooperation editing operation on the online document by any one of the N objects, such as Figure 5a In this case, when the N objects open the online document, before displaying the document page of the online document, it can be determined whether the target version data is consistent with the version data in the cache space to determine whether the to-be-displayed document page has a flicker. The computer device can determine whether the target version data is the version data already stored in the cache space. If it is determined that the version data is the version data already stored in the cache space, the target version data can be directly obtained from the cache space, the target version data is rendered, and the rendered document page is displayed. If it is determined that the version data is not the version data already stored in the cache space, it is determined that the target version data is new version data, the to-be-displayed document page has a flicker, the target version data obtained is stored in the cache space, and step S402 is performed. At this time, the target version data includes original version data (such as the previous version data) and updated version data. The updated version data can be generated by editing the document content in the online document by any one object or multiple objects.
[0128] The specific implementation manner of determining whether the target version data is the version data already stored in the cache space can be: obtaining an identifier of the target version data, and if the identifier of the target version data is inconsistent with an identifier of the version data already stored in the cache space, it is determined that the target version data is not the version data already stored in the cache space, and if the identifier of the target version data is consistent with the identifier of the version data already stored in the cache space, it is determined that the target version data is the version data already stored in the cache space. Alternatively, the specific implementation manner of determining whether the target version data is the version data already stored in the cache space can also be: obtaining a generation time corresponding to the target version data, and if the generation time corresponding to the target version data is the same as a generation time corresponding to the version data already stored in the cache space, it is determined that the target version data is the version data already stored in the cache space, and if the generation time corresponding to the target version data is different from the generation time corresponding to the version data already stored in the cache space, it is determined that the target version data is not the version data already stored in the cache space.
[0129] Among them, the specific implementation method of obtaining the target version data corresponding to the document page of the online document to be displayed can be: obtaining the version data recorded by N objects when exiting the document page of the online document, and determining the version data recorded when exiting the document page of the online document as the target version data.
[0130] In one embodiment, the online document uses a keyframe + mutation method for collaboratively edited data, and each update will generate new version data. The specific implementation method for obtaining the target version data corresponding to the document page of the online document to be displayed can also be: the computer device can detect whether there is a data edit submission. If there is a data edit submission, it means that the version data of the online document has been updated, and each updated version data can be obtained, and the updated version data can be applied to the previous version data (historical version data) to obtain the target version data (i.e., current version data) corresponding to the document page of the online document. By applying the updated data to the previous version data, the flash jump can be minimized and the opening speed of the document page can be balanced. If there is no data edit submission. It means that the version data of the online document has not been updated, and the previous version data can be obtained as the target version data corresponding to the document page of the online document.
[0131] S402: If the document page to be displayed has a flicker, a prompt message is generated according to the flicker situation, wherein the prompt message is used to prompt and replace the rendering process of the document page to be displayed.
[0132] If there is a flash in the document page to be displayed, a weak prompt can be used to prevent the flash. The computer device can use the data difference between the target version data and the version data stored in the cache space as a flash situation, and then generate a prompt message based on the flash situation. The prompt message may include but is not limited to text prompt information, voice prompt information, and picture prompt information; if the prompt information is a text prompt information, a text prompt information is generated based on the data difference, such as the text prompt information is replacing the historical document page to be displayed, please wait; for example, the text prompt information is "Loading page".
[0133] S403: Rendering is performed based on the target version data of the online document, and prompt information is output during the rendering process.
[0134] During the rendering process of the target version data, the prompt information can be directly output. There are certain differences in the way of outputting the prompt information for different prompt information. When the prompt information is a text prompt information, the text prompt information can be displayed on the document page of the original online document being displayed, for example, Figure 5bIn the document page of the original online document, the prompt information 53 is displayed, or the text prompt information can be displayed in the newly displayed page. When the prompt information is a voice prompt information, the voice prompt information can be directly played.
[0135] It should be noted that, during the rendering process based on the target version data of the online document, the prompt information will be displayed in the computer devices where the N objects are located.
[0136] S404: When rendering is completed, stop displaying the prompt information and display the rendered document page.
[0137] During the rendering process based on the target version data, when a portion of the displayable document page data is rendered based on the online document page data, the prompt information can be stopped and the rendered document page data can be displayed, and finally the rendered complete document page can be displayed. Of course, it is also possible to stop displaying the prompt information and directly display the rendered complete document page when rendering is complete.
[0138] In an embodiment of the present application, the target version data corresponding to the document page of the online document to be displayed is obtained. If the document page to be displayed flickers, a prompt message is generated based on the flickering situation. Rendering is performed based on the target version data of the online document. During the rendering process, the prompt message is output. When rendering is complete, the prompt message is stopped and the rendered document page is displayed. Outputting the prompt message provides a certain rendering time, allowing the document page to be displayed only after rendering is complete. This can achieve a flicker-free, smooth display of the online document, thereby improving the display performance of the online document.
[0139] Based on the above page processing method, the following example illustrates the page processing method:
[0140] (1) When the target object wants to open an online document, such as Figure 6a As shown, the target object can click on the online document 610 in the document publishing interface 601. In response to the click operation on the online document 610, the direct output data of the online document can be displayed, for example, Figure 6a The direct data displayed in area 621 of the loading interface 602 includes page elements and a document title (e.g., Experience 2). During the display of the direct data, it can be determined whether there is a flicker in the document page to be displayed (e.g., Online Document 1). If it is determined that there is a flicker in the document page to be displayed, a prompt message can be generated, which is "Document Loading".
[0141] (2) After determining that the document page to be displayed has a flash, the page data of the online document to be displayed can be obtained, and then rendering can be performed based on the page data of the online document to be displayed. During the rendering process, the generated prompt information can be output, and the prompt information is displayed on the screen. Figure 6a In one embodiment, when the target object uses a mobile terminal (such as a mobile phone) to open an online document, the prompt information can be displayed on the loading interface 602. Figure 6a In another embodiment, when the target object uses a PC (such as a computer) to open an online document, the prompt information can be displayed on the loading interface 602. Figure 6b On the loading interface 605, a prompt message is output to prevent the document page from flashing.
[0142] (3) During the rendering process, when a portion of the document page data that can be displayed is rendered according to the page data of the online document, the prompt information can be stopped and the data in the rendered document page can be displayed. For example, when the document data and the top button of the online document are rendered according to the page data of the online document, the document data (i.e., the body data) and the top button of the online document can be displayed, such as Figure 6a The document page 603 in the document page is displayed in the area 61 of the document page, and the top buttons, namely the favorite button 611, the share button 612, and the more button 613, are displayed in the area 62 of the document page; then the page of the online document is continued to be rendered, and the data in the rendered document page is continued to be displayed. When the bottom options of the online document are rendered according to the page data of the online document, the bottom options in the document page can be suspended and displayed, such as Figure 6a The document page 604 is displayed in a floating manner in area 63 of the document page. The rendering process then continues based on the online document's page data, and the data in the rendered document page continues to be displayed. When the avatar information for multiple objects in the online document is rendered based on the online document's page data, the avatar information for the multiple objects is displayed in area 64 of the document page, ultimately displaying the complete document page. The text data and worksheet (Sheet Bar) have a transparency range of 0% to 100%, a display time of 0 seconds, and a duration of less than 0.5 seconds. The top buttons and bottom options have a transparency range of 0% to 100%, a display time of approximately 1 second (the faster the better), and a duration of less than 0.6 seconds. The avatar information can be shifted from left to right, and a display time of approximately 2 seconds, with a duration of less than 0.6 seconds. It should be noted that the implementation principles, methods, and technologies for PC and mobile devices are consistent; the presentation effects differ only due to the different screen sizes.
[0143] In one embodiment, when the page processing method is applied to a scenario where multiple objects collaborate to edit an online document, the page processing method can also be as follows: Figure 7 As shown:
[0144] ① Multiple objects can open an online document at the same time. The computer device can obtain the target version data of the document page of the online document through tsw_ejs (backend direct gateway service) and determine whether the target version data hits the version data stored in the redis cache (that is, the cache space mentioned above). If the target version data hits the version data stored in the cache space (that is, the target version data is cached in the redis cache), the target version data is directly obtained from the redis cache, and the tsw_ejs is used to render the target version data and display the rendered document page.
[0145] If the target version data does not hit the version data stored in the cache space (that is, the target version data is not cached in the redis cache), it means that the target version data does not exist in the cache space. At this time, the asynchronous rendering service (that is, Figure 7 ), obtains updated data through the rendering service, and renders the updated data through SSR to obtain updated version data (i.e., a cache of specific version data), and then stores the updated version data in the redis cache; at this time, the target version data may include the updated version data; then the computer device obtains the target version data from the redis cache through the tsw_ejs, and renders based on the target version data, displays prompt information (such as waiting for loading) during the rendering process, stops outputting prompt information after the rendering is completed, and displays the rendered file page.
[0146] ② When there is online document creation (such as Figure 7 When creating a new document (using the import document and document template in ), the initial version data of the document page of the created online document can be generated, and then the rendering service is called to obtain the updated data (i.e., the initial document data) through oidb_pad (background document data service), and the initial document data is server-side rendered through SSR to obtain the updated version data, and the updated version data is stored in the redis cache, so that subsequent computer devices can directly obtain the updated version data for rendering processing when determining that the version data is consistent, and display the corresponding rendered document page.
[0147] ③When an online document is edited and submitted, the edited and submitted data can be used as updated data, and the rendering service can be called through oidb_collab (background collaborative data service) to obtain the updated data, and the SSR technology is used to perform server-side rendering on the updated data to obtain updated version data, and the updated version data is stored in the redis cache, so that subsequent computer devices can directly obtain the updated version data when they determine that the version data is consistent, and perform rendering processing based on the updated version data and display the corresponding rendered document page.
[0148] See Figure 8 , Figure 8 is a structural diagram of a page processing device provided in an embodiment of the present application; the page processing device may be a computer program (including program code) running in a computer device, for example, the page processing device may be an application software in the computer device; the page processing device may be used to execute Figure 2 and Figure 4 Some or all of the steps in the method embodiment shown. Figure 8 , the page processing device includes the following units:
[0149] An acquisition unit 801 is configured to acquire a document page of an online document to be displayed;
[0150] The processing unit 802 is configured to optimize the document page to be displayed according to the flickering condition if the document page to be displayed flickers;
[0151] The display unit 803 is used to display the document page after optimization processing.
[0152] In one embodiment, when acquiring the document page of the online document to be displayed, the acquiring unit 801 may be specifically configured to:
[0153] Loading the document page of the online document according to the page data of the online document;
[0154] The page data includes any one or more of the following: direct data, style data, resource data, and script data.
[0155] In one embodiment, the processing unit 802 is further configured to:
[0156] Based on the loaded document page, the flashing condition corresponding to the document page to be displayed is checked.
[0157] In one embodiment, when the processing unit 802 checks the flickering condition corresponding to the document page to be displayed based on the loaded document page, it can be specifically configured to:
[0158] Create an inline frame within the loaded document page;
[0159] Check the changes of the loaded document page in the inline frame during the loading process;
[0160] The flash jump situation corresponding to the document page to be displayed is determined based on the change difference.
[0161] In one embodiment, the loading process includes a direct output phase and a stabilization phase; the direct output phase is used to load and present the direct output data of the online document; the stabilization phase is used to present the document page after loading;
[0162] When the processing unit 802 checks the difference in changes of the loaded document page during the loading process in the inline frame, it can be specifically used to:
[0163] Get direct data from online documents;
[0164] Display direct-out data in an inline frame;
[0165] Compare the changes between the page elements of the loaded document page and the page elements presented in the inline frame of the direct-output data.
[0166] In one embodiment, the loading process includes a resource loading phase and a script execution phase; the resource loading phase is used to load the style data and / or resource data of the online document; the script execution phase is used to execute the script data of the online document;
[0167] When the processing unit 802 checks the difference in changes of the loaded document page during the loading process in the inline frame, it can be specifically used to:
[0168] During the loading process, the page change information of the loaded document page during the resource loading stage and the script execution stage is recorded;
[0169] Playback is performed in an inline frame based on recorded page change information;
[0170] Compare the changes between page elements of each frame page presented during playback in the inline frame frame by frame.
[0171] In one embodiment, when determining the flashing condition corresponding to the document page to be displayed based on the change difference, the processing unit 802 may be specifically configured to:
[0172] If the change difference exceeds the preset flash jump range, it is determined that the document page to be displayed has a flash jump, and the change difference is determined as the flash jump situation corresponding to the document page to be displayed.
[0173] In one embodiment, when optimizing the document page to be displayed according to the flickering situation, the processing unit 802 may be specifically configured to:
[0174] modify the attribute of the page element with the flicker according to the flicker condition in the inline frame, so that the change difference is within the preset flicker range; the attribute includes one or more of the following: position, style, size; update the page data of the online document according to the modification;
[0175] The display unit 803 can be specifically configured to:
[0176] render based on the updated page data of the online document, and display the rendered document page.
[0177] In an embodiment, the processing unit 802 can be specifically configured to:
[0178] generate a prompt information according to the flicker condition, the prompt information being used to prompt and replace the rendering process of the document page to be displayed;
[0179] The display unit 803 can be specifically configured to:
[0180] render based on the page data of the online document;
[0181] output the prompt information in the rendering process;
[0182] stop displaying the prompt information and display the rendered document page when the rendering is completed.
[0183] In an embodiment, the obtaining unit 801 can be specifically configured to:
[0184] obtain target version data corresponding to the document page of the online document to be displayed.
[0185] In an embodiment, the online document is generated by N objects for collaborative editing, N is an integer greater than or equal to 2, and the online document includes M version data, each version data corresponding to a version of document page; the M version data is generated based on the creation and each collaborative editing of the online document, and the M version data is stored in a cache space; the processing unit 802 is further configured to:
[0186] determine whether the target version data is the version data already stored in the cache space;
[0187] if not, it is determined that the document page to be displayed has flicker.
[0188] In an embodiment, the processing unit 802 can be specifically configured to:
[0189] Generate prompt information based on the flashing situation, where the prompt information is used to prompt and replace the rendering process of the document page to be displayed;
[0190] When displaying the optimized document page, the display unit 803 may be specifically used to:
[0191] Rendering based on the target version data of the online document;
[0192] During the rendering process, output prompt information;
[0193] When rendering is complete, stop displaying the prompt message and display the rendered document page.
[0194] In an embodiment of the present application, a document page of an online document to be displayed is obtained. If the document page to be displayed has flickering, the document page to be displayed is optimized according to the flickering situation, and the optimized document page is displayed. Targeted optimization is performed according to the flickering situation. This can avoid the problem of flickering of the document page to be displayed during the display process. By displaying the optimized document page, a smooth display of the online document can be achieved, the smoothness of the online document display process is improved, and the display effect of the online document is improved.
[0195] Furthermore, the present invention also provides a schematic diagram of the structure of a computer device. Figure 9 The computer device runs a client; the computer device may include: a processor 901, an input device 902, an output device 903, and a memory 904. The processor 901, input device 902, output device 903, and memory 904 are connected via a bus. The memory 904 is used to store a computer program, which includes program instructions. The processor 901 is used to execute the program instructions stored in the memory 904.
[0196] In the embodiment of the present application, the processor 901 performs the following operations by running the executable program code in the memory 904:
[0197] Obtain the document page of the online document to be displayed;
[0198] If the document page to be displayed has flickering, the document page to be displayed is optimized according to the flickering situation;
[0199] Displays the optimized document page.
[0200] In one embodiment, when the processor 901 obtains the document page of the online document to be displayed, it can be specifically configured to:
[0201] Loading the document page of the online document according to the page data of the online document;
[0202] The page data includes any one or more of the following: direct data, style data, resource data, and script data.
[0203] In one embodiment, the processor 901 is further configured to:
[0204] Based on the loaded document page, the flashing condition corresponding to the document page to be displayed is checked.
[0205] In one embodiment, when the processor 901 checks the flashing condition corresponding to the document page to be displayed based on the loaded document page, it can be specifically configured to:
[0206] Create an inline frame within the loaded document page;
[0207] Check the changes of the loaded document page in the inline frame during the loading process;
[0208] The flash jump situation corresponding to the document page to be displayed is determined based on the change difference.
[0209] In one embodiment, the loading process includes a direct output phase and a stabilization phase; the direct output phase is used to load and present the direct output data of the online document; the stabilization phase is used to present the document page after loading;
[0210] When the processor 901 checks the changes and differences of the loaded document page during the loading process in the inline frame, it can be specifically used to:
[0211] Get direct data from online documents;
[0212] Display direct-out data in an inline frame;
[0213] Compare the changes between the page elements of the loaded document page and the page elements presented in the inline frame of the direct-output data.
[0214] In one embodiment, the loading process includes a resource loading phase and a script execution phase; the resource loading phase is used to load the style data and / or resource data of the online document; the script execution phase is used to execute the script data of the online document;
[0215] When the processor 901 checks the changes and differences of the loaded document page during the loading process in the inline frame, it can be specifically used to:
[0216] During the loading process, the page change information of the loaded document page during the resource loading stage and the script execution stage is recorded;
[0217] Playback is performed in an inline frame based on recorded page change information;
[0218] Compare the changes between page elements of each frame page presented during playback in the inline frame frame by frame.
[0219] In one embodiment, when the processor 901 determines the flashing condition corresponding to the document page to be displayed based on the change difference, it can be specifically configured to:
[0220] If the change difference exceeds the preset flash jump range, it is determined that the document page to be displayed has a flash jump, and the change difference is determined as the flash jump situation corresponding to the document page to be displayed.
[0221] In one embodiment, when optimizing the document page to be displayed according to the flickering situation, the processor 901 may be specifically configured to:
[0222] Modify the properties of the page element with flashing in the inline frame according to the flashing situation so that the change difference is within the preset flashing range; the properties include one or more of the following: position, style, size;
[0223] Update the page data of the online document according to the modification;
[0224] When displaying the optimized document page, the processor 901 may be specifically configured to:
[0225] Rendering is performed based on the updated page data of the online document, and the rendered document page is displayed.
[0226] In one embodiment, when optimizing the document page to be displayed according to the flickering situation, the processor 901 may be specifically configured to:
[0227] Generate prompt information based on the flashing situation, which is used to prompt and replace the rendering process of the document page to be displayed;
[0228] When displaying the optimized document page, the processor 901 may be specifically configured to:
[0229] Rendering based on page data from online documents;
[0230] During the rendering process, output prompt information;
[0231] When rendering is complete, stop displaying the prompt message and display the rendered document page.
[0232] In one embodiment, when the processor 901 obtains the document page of the online document to be displayed, it can be specifically configured to:
[0233] Obtain target version data corresponding to the document page of the online document to be displayed.
[0234] In an embodiment, the online document is generated by collaborative editing of N objects, N being an integer greater than or equal to 2, the online document comprising M version data, each version data corresponding to a version of a document page; the M version data are generated based on creation of the online document and each collaborative editing, and the M version data are stored in a cache space; the processor 901 is further configured to:
[0235] determine whether the target version data is version data already stored in the cache space;
[0236] if not, determine that the document page to be displayed has a flicker.
[0237] In an embodiment, when the processor 901 performs optimization processing on the document page to be displayed according to the flicker condition, the processor 901 can be specifically configured to:
[0238] generate prompt information according to the flicker condition, wherein the prompt information is used to prompt and replace display of the rendering process of the document page to be displayed;
[0239] When the processor 901 displays the document page after optimization processing, the processor 901 can be specifically configured to:
[0240] render based on the target version data of the online document;
[0241] output the prompt information in the rendering process;
[0242] when the rendering is completed, stop displaying the prompt information and display the document page obtained by rendering.
[0243] In the embodiments of the present application, the document page of the online document to be displayed is obtained, and if the document page to be displayed has a flicker, the document page to be displayed is optimized according to the flicker condition, and the document page after optimization processing is displayed. The online document is optimized according to the flicker condition, which can avoid the problem of flicker of the document page to be displayed in the display process. By displaying the document page after optimization processing, smooth display of the online document can be achieved, the smoothness in the display process of the online document is improved, and the display effect of the online document is improved.
[0244] In addition, it should be noted that the embodiments of the present application also provide a computer readable storage medium, and the computer readable storage medium stores a computer program, and the computer program includes program instructions. When the processor executes the above program instructions, the foregoing Figure 2 and Figure 4The method in the corresponding embodiment will therefore not be described in detail here. For technical details not disclosed in the computer-readable storage medium embodiment involved in this application, please refer to the description of the method embodiment of this application. As an example, the program instructions can be deployed on a computer device, or executed on multiple computer devices located in one location, or executed on multiple computer devices distributed in multiple locations and interconnected by a communication network.
[0245] According to one aspect of the present application, a computer program product is provided, the computer program product comprising a computer program stored in a computer-readable storage medium. A processor of a computer device reads the computer program from the computer-readable storage medium and executes the computer program, so that the computer device can perform the above-mentioned Figure 2 and Figure 4 The method in the corresponding embodiment will therefore not be described in detail here.
[0246] Those skilled in the art will appreciate that all or part of the processes in the above-described method embodiments can be implemented by instructing related hardware through a computer program. The program can be stored in a computer-readable storage medium, and when executed, the program can include the processes in the above-described method embodiments. The storage medium can be a magnetic disk, an optical disk, a read-only memory (ROM), or a random access memory (RAM).
[0247] The above disclosure is only a preferred embodiment of the present invention, and certainly cannot be used to limit the scope of the rights of the present invention. Ordinary technicians in this field can understand that all or part of the processes of the above embodiment and equivalent changes made in accordance with the claims of the present invention are still within the scope of the invention.
Claims
1. A page processing method, characterized in that: include: Obtaining a document page of an online document to be displayed, wherein, when the online document is generated by collaborative editing by N objects and the online document includes M version data, each version data corresponding to a version of the document page, obtaining the document page of the online document to be displayed includes obtaining target version data corresponding to the document page of the online document to be displayed, where N is an integer greater than or equal to 2; If the document page to be displayed has flickering, the document page to be displayed is optimized according to the flickering situation; Display the optimized document page; Among them, the M version data are generated based on the creation of the online document and each collaborative editing, and the M version data are stored in the cache space; if the target version data corresponding to the document page of the online document is obtained, the method also includes: judging whether the target version data is the version data stored in the cache space; if not, determining that there is a flash in the document page to be displayed.
2. The method according to claim 1, wherein The step of obtaining the document page of the online document to be displayed includes: Loading a document page of the online document according to the page data of the online document; The page data includes any one or more of the following: direct data, style data, resource data, and script data.
3. The method according to claim 2, wherein The method further comprises: Based on the loaded document page, the flashing condition corresponding to the document page to be displayed is checked.
4. The method according to claim 3, wherein The checking of the flashing condition corresponding to the document page to be displayed based on the loaded document page includes: Create an inline frame within the loaded document page; checking, in the inline frame, changes and differences of the loaded document page during the loading process; The flashing condition corresponding to the document page to be displayed is determined according to the change difference.
5. The method according to claim 4, wherein The loading process includes a direct output phase and a stabilization phase; the direct output phase is used to load and present the direct output data of the online document; the stabilization phase is used to present the loaded document page; The checking, in the inline frame, the difference in changes of the loaded document page during the loading process includes: Obtaining direct output data of the online document; Displaying the direct-out data in the inline frame; Compare the changes between the page elements of the loaded document page and the page elements presented in the inline frame by the direct-output data.
6. The method according to claim 4, wherein The loading process includes a resource loading phase and a script execution phase; the resource loading phase is used to load the style data and / or resource data of the online document; the script execution phase is used to execute the script data of the online document; The checking, in the inline frame, the difference in changes of the loaded document page during the loading process includes: During the loading process, recording page change information of the loaded document page during the resource loading phase and the script execution phase; Performing a playback operation in the inline frame based on the recorded page change information; The changes between the page elements of each frame page presented when the playback operation is performed in the inline frame are compared frame by frame.
7. The method according to claim 5 or 6, wherein: The determining of the flashing condition corresponding to the document page to be displayed according to the change difference includes: If the change difference exceeds the preset flicker range, it is determined that the document page to be displayed has flicker, and the change difference is determined as the flicker situation corresponding to the document page to be displayed.
8. The method according to claim 7, wherein The optimizing process of the document page to be displayed according to the flashing situation includes: Modifying the attributes of the page element with the flashing in the inline frame according to the flashing situation so that the change difference is within the preset flashing range; the attributes include one or more of the following: position, style, and size; updating page data of the online document according to the modification; The display of the optimized document page includes: Rendering is performed based on the updated page data of the online document, and the rendered document page is displayed.
9. The method according to claim 7, wherein The optimizing process of the document page to be displayed according to the flashing situation includes: Generate prompt information according to the flashing situation, and the prompt information is used to prompt and replace the rendering process of the document page to be displayed; The display of the optimized document page includes: Rendering based on the page data of the online document; During the rendering process, outputting the prompt information; When the rendering is completed, the prompt information is stopped from being displayed, and the rendered document page is displayed.
10. The method according to claim 1, wherein If the target version data corresponding to the document page of the online document is obtained, then the document page to be displayed is optimized according to the flashing situation, including: Generate prompt information according to the flashing situation, wherein the prompt information is used to prompt and replace the rendering process of the document page to be displayed; The display of the optimized document page includes: Rendering based on the target version data of the online document; During the rendering process, outputting the prompt information; When the rendering is completed, the prompt information is stopped from being displayed, and the rendered document page is displayed.
11. A page processing device, characterized in that: include: an acquisition unit, configured to acquire a document page of an online document to be displayed, wherein, when the online document is generated by collaborative editing by N objects and the online document includes M version data, each version data corresponding to a version of the document page, the acquisition unit is configured to acquire target version data corresponding to the document page of the online document to be displayed, where N is an integer greater than or equal to 2; a processing unit configured to optimize the document page to be displayed according to the flickering condition if the document page to be displayed flickers; A display unit, used for displaying the optimized document page; Among them, the M version data are generated based on the creation of the online document and each collaborative editing, and the M version data are stored in the cache space; if the target version data corresponding to the document page of the online document is obtained, the processing unit is also used to: determine whether the target version data is the version data stored in the cache space; if not, determine that there is a flash in the document page to be displayed.
12. A computer device, characterized in that: include: a processor suitable for executing a computer program; A computer-readable storage medium, wherein a computer program is stored in the computer-readable storage medium, and when the computer program is executed by the processor, the page processing method according to any one of claims 1 to 10 is executed.
13. A computer-readable storage medium, characterized in that The computer storage medium stores a computer program, and when the computer program is executed by a processor, the page processing method according to any one of claims 1 to 10 is executed.
14. A computer program product, characterized in that The computer program product comprises a computer program, and when the computer program is executed by a processor, the page processing method according to any one of claims 1 to 10 is implemented.
Citation Information
Patent Citations
Page loading method and device and container
CN114253624A