Data processing method and device, electronic equipment and computer program product
By rendering and exposure processing of web page resources in the web-side scenario, the problem of poor exposure accuracy of page resources is solved, reducing duplication and missing exposures is achieved, and the accuracy of user experience and data analysis is improved.
Patent Information
- Application Number
- CN202411084206.7
- Authority / Receiving Office
- CN · China
- Patent Type
- Applications(China)
- Current Assignee / Owner
- Filing Date
- 2024-08-07
- Publication Date
- 2024-12-20
AI Technical Summary
In the web-side scenario, the accuracy of page resource exposure is poor, resulting in frequent repeated exposure and lost exposure, affecting the accuracy of user experience and data analysis.
When the web page access request is requested, the local data of the first display resource in the web page is rendered into the second display resource, and the remote rendering is performed after receiving the remote data, and only the third display resource after remote rendering is displayed in the browser window, avoiding Repeat exposure; if remote data is not received, the second display resource after local rendering is displayed to ensure that exposure can still be performed without remote data being received.
Reduce repeated exposure and lost exposure, improve the accuracy of page resource exposure and reporting accuracy, and ensure the correctness of user experience and data analysis.
Smart Images

Figure CN119166253A_ABST
Abstract
Description
Technical Field
[0001] The present application relates to the field of data processing technology, and in particular to a data processing method and device, electronic equipment, and a computer program product. Background Art
[0002] Web refers to website applications that run through browsers, which can be ordinary website applications for PC (Personal Computer) or web applications for mobile terminals, such as H5 web pages or public account web pages. In related technologies, in the Web scenario, data persistence is a very important and effective means to optimize user experience, save resources and maintain the state stability of website applications, but there is a problem of poor accuracy in page resource exposure. Summary of the invention
[0003] The present application provides a data processing method and device, electronic equipment, and computer program product, which can improve the accuracy of page resource exposure.
[0004] In a first aspect, the present application provides a data processing method, the data processing method comprising:
[0005] According to the webpage access request, the local data of the first display resource in the webpage is used to render the first display resource to obtain a rendered second display resource;
[0006] If the remote data of the first display resource is received, the second display resource is rendered using the remote data to obtain a third display resource after remote rendering, and the third display resource is displayed in the browser window of the webpage;
[0007] If no remote data is received, the second display resource is displayed in the browser window.
[0008] In a second aspect, the present application provides a data processing device, the data processing device comprising:
[0009] A rendering module, configured to render the first display resource in the web page using the local data of the first display resource according to the web page access request, to obtain a rendered second display resource;
[0010] A first processing module is configured to, if receiving remote data of the first display resource, render the second display resource using the remote data to obtain a third display resource after remote rendering, and display the third display resource in a browser window of the web page;
[0011] The second processing module is configured to display the second display resource in the browser window if no remote data is received.
[0012] In a third aspect, the present application provides an electronic device, comprising: at least one processor; and a memory communicatively connected to the at least one processor; wherein the memory stores one or more computer programs executable by the at least one processor, and one or more of the computer programs are executed by the at least one processor so that the at least one processor can perform the above-mentioned data processing method.
[0013] In a fourth aspect, the present application provides a computer program product, characterized in that it includes a computer-readable code, or a non-volatile computer-readable storage medium carrying a computer-readable code, and when the computer-readable code runs in a processor of an electronic device, the processor in the electronic device executes the above-mentioned data processing method.
[0014] In the embodiment provided by the present application, according to the web page access request, the local data of the first display resource in the web page is used to render the first display resource. After obtaining the rendered second display resource, the second display resource is not immediately displayed in the browser window of the web page. Instead, if the remote data of the first display resource is received, the remote data is used to render the second display resource to obtain the remotely rendered third display resource, and the third display resource is displayed in the browser window of the web page. The same first display resource is only displayed once in the browser window of the web page after rendering, instead of the same first display resource being displayed twice in the browser window of the web page after local data rendering and remote rendering, thereby reducing the occurrence of repeated exposure and improving the accuracy of page resource exposure. If the remote data is not received, the second display resource is displayed in the browser window, so that exposure can still be performed in the case where the remote data is not received, thereby reducing the occurrence of lost exposure and improving the accuracy of page resource exposure.
[0015] It should be understood that the content described in this section is not intended to identify the key or important features of the embodiments of the present application, nor is it intended to limit the scope of the present application. Other features of the present application will become easily understood through the following description. BRIEF DESCRIPTION OF THE DRAWINGS
[0016] The accompanying drawings are used to provide a further understanding of the present application and constitute a part of the specification. Together with the embodiments of the present application, they are used to explain the present application and do not constitute a limitation of the present application. The above and other features and advantages will become more apparent to those skilled in the art by describing detailed example embodiments with reference to the accompanying drawings. In the accompanying drawings:
[0017] Figure 1 An application scenario diagram of a data processing method and device provided in an embodiment of the present application;
[0018] Figure 2A flowchart of a data processing method provided in an embodiment of the present application;
[0019] Figure 3 A flowchart of a data processing method provided in an embodiment of the present application;
[0020] Figure 4 A timing diagram of a data processing method provided in an embodiment of the present application;
[0021] Figure 5 A block diagram of a data processing device provided in an embodiment of the present application;
[0022] Figure 6 A block diagram of an electronic device provided in an embodiment of the present application. DETAILED DESCRIPTION
[0023] In order to enable those skilled in the art to better understand the technical solution of the present application, the exemplary embodiments of the present application are described below in conjunction with the accompanying drawings, including various details of the embodiments of the present application to facilitate understanding, which should be considered as merely exemplary. Therefore, those of ordinary skill in the art should recognize that various changes and modifications can be made to the embodiments described herein without departing from the scope and spirit of the present application. Similarly, for the sake of clarity and conciseness, the description of well-known functions and structures is omitted in the following description.
[0024] In the absence of conflict, the embodiments of the present application and the features therein may be combined with each other.
[0025] As used herein, the term "and / or" includes any and all combinations of one or more of the associated listed items.
[0026] The terms used herein are only used to describe specific embodiments and are not intended to limit the present application. As used herein, the singular forms "a" and "the" are also intended to include plural forms, unless the context clearly indicates otherwise. It will also be understood that when the terms "including" and / or "made of" are used in this specification, the presence of the features, wholes, steps, operations, elements and / or components is specified, but the presence or addition of one or more other features, wholes, steps, operations, elements, components and / or groups thereof is not excluded. "Connected" or "connected" and similar words are not limited to physical or mechanical connections, but may include electrical connections, whether direct or indirect.
[0027] Unless otherwise defined, all terms (including technical and scientific terms) used herein have the same meaning as commonly understood by those of ordinary skill in the art. It will also be understood that terms such as those defined in commonly used dictionaries should be interpreted as having a meaning consistent with their meaning in the context of the relevant art and this application, and will not be interpreted as having an idealized or overly formal meaning unless explicitly defined herein.
[0028] The following is an explanation of the technical terms mentioned in this application:
[0029] Vue.js (Vue for short): is a JavaScript framework for building user interfaces.
[0030] Vuex: is a state management mode developed specifically for Vue.js applications. It uses centralized storage to manage the status of all components of the application and uses corresponding rules to ensure that the status changes in a predictable way.
[0031] Home screen: refers to the first display content seen when the browser loads the page.
[0032] Page home screen resources: refers to the various resources in the home screen of the page.
[0033] Resources: include a single element or a combination of multiple elements. A single element can be a button, a piece of text, or a picture, etc. A combination of multiple elements can be a combination of elements with independent functions, such as limited-time flash sales, 9.9 special sales, pop-ups, banners, notification bars, headline carousels, search hot words, rankings, bubbles, etc. It can also be the entire page, which is usually defined according to different businesses.
[0034] Rendering: The process by which the browser parses and combines data in a certain style and finally draws the page that the user sees.
[0035] Exposure: A resource is displayed within the scope of the user's browser window. Exposure is a description of the display behavior of a resource.
[0036] Reporting: Sending the exposure of a resource to the server so that the data can be analyzed later.
[0037] Interface: refers to API (Application Programming Interface). The server uses API to implement specific functions. The terminal device calls the server's API, and the client does not need to understand the internal implementation details of the API.
[0038] In the process of implementing the present invention, the inventors analyzed the relevant technologies and found that in the Web scenario, data persistence is a very important and effective means to optimize user experience, save resources and maintain the state stability of website applications. The general process is as follows:
[0039] First, by integrating plug-ins such as Vuex-persistedstate (Vuex persistence plug-in), developers can easily realize the automatic saving and restoration of data in the Vuex store (Vuex warehouse) in the browser's localStorage (local storage) or sessionStorage (session storage), that is, persistent data, that is, local data; then, after Vue is initialized, the local data of the resource can be used to drive page rendering immediately, and the JS thread initiates a network request to start obtaining the remote data of the resource; finally, after obtaining the remote data, compare the remote data with the persistent data. If the resource has been updated, render the resource again to ensure that users can see real-time content.
[0040] In an exemplary embodiment, scenarios such as Vue, vuex-persistedstate, and Vuex can be replaced with any front-end similar related technologies such as React (a JavaScript library for building user interfaces), Solidjs (a JavaScript library for building user interfaces), etc.
[0041] In an exemplary embodiment, localStorage and sessionStorage can be replaced by any front-end storage technology such as indexDB (a Web API for storing larger data structures in the browser, and providing indexing functions for high-performance search), webSQL (a structured relational database on the client browser side), etc.
[0042] In an exemplary embodiment, the JS thread may also be replaced by a TS thread.
[0043] The above solutions ensure the efficiency and stability of website applications, but will bring great difficulties to the exposure of page resources (especially the first screen resources of the page). Usually there are the following situations:
[0044] Case 1
[0045] For the same resource, exposure will be executed after rendering is completed using persistent data. Persistent data is local data. After the network request pulls the remote data, if the remote data and the persistent data are different, exposure will be executed again after rendering is completed using the remote data again.
[0046] Exposure is a description of the display behavior of a resource. When a user opens a page, it is one action rather than multiple actions. At this time, a resource should be exposed only once, that is, the opening action ultimately displays the resource that the user sees, because the user's subsequent behavior is also based on this resource. This is the correct result when analyzing user behavior data.
[0047] In case 1, an opening action occurs, and the same resource is exposed twice, that is, repeated exposure, which may cause problems in the subsequent data analysis of user behavior.
[0048] Case 2
[0049] To avoid the problem of repeated exposure in situation 1, you can violently ignore the behavior of rendering with persistent data, that is, do not expose after rendering with persistent data is completed, and only perform exposure after rendering with remote data is completed again.
[0050] However, this approach can result in lost impressions due to network delays, server errors, etc.
[0051] Therefore, the inventors have found through analysis that the related art has the problem of poor accuracy in exposing page resources.
[0052] In order to solve the problem of poor accuracy in exposure of page resources, the embodiments of the present disclosure provide a data processing method and device, an electronic device, and a computer program product.
[0053] Figure 1 A diagram schematically illustrates an application scenario of a data processing method and device provided in an embodiment of the present application.
[0054] like Figure 1 As shown, the application scenario of the embodiment of the present application may include a terminal device 101, a network 103 and a server 102. The network 103 is used to provide a medium for a communication link between the terminal device 101 and the server 102. The network 103 may include various connection types, such as wired, wireless communication links or optical fiber cables, etc.
[0055] The user can use the terminal device 101 to interact with the server 102 through the network 103 to receive or send messages, etc. Various communication client applications can be installed on the terminal device 101, such as shopping applications, web browser applications, search applications, instant messaging tools, email clients, social platform software, etc. (only as examples).
[0056] The terminal device 101 may be any electronic device having a display screen and supporting web browsing, including but not limited to a smart phone, a tablet computer, a laptop computer, a desktop computer, and the like.
[0057] The server 102 may be a server that provides various services, such as a background management server (only as an example) that provides support for websites browsed by users using the terminal device 101. The background management server may analyze and process received data such as user requests, and feed back processing results (such as web pages, information, or data obtained or generated according to user requests) to the terminal device.
[0058] It should be noted that the data processing method and apparatus provided in the embodiment of the present application are executed by the terminal device 101.
[0059] It should be understood that Figure 1 The number of terminal devices, networks and servers in the embodiment is only for illustration. Any number of terminal devices, networks and servers may be provided according to implementation requirements.
[0060] Figure 2 A flowchart of a data processing method provided in an embodiment of the present application. Figure 2 , the method comprising:
[0061] Step 201 : according to a webpage access request, local data of a first display resource in a webpage is used to render the first display resource to obtain a rendered second display resource.
[0062] In an exemplary embodiment, the first display resource includes a single element or a combination of multiple elements. A single element can be a button, a piece of text, or a picture, etc. A combination of multiple elements can be a combination of elements with independent functions, such as limited-time flash sales, 9.9 special sales, pop-ups, banners, notification bars, headline carousels, search hot words, rankings, bubbles, etc., or a whole page, which is usually defined according to different businesses.
[0063] Rendering refers to the process in which the browser parses and combines data according to a certain style and finally draws the page that the user sees.
[0064] According to the web page access request, the local data of the first display resource in the web page is rendered on the first display resource to obtain the rendered second display resource, which can shorten the screen opening time and improve the user experience.
[0065] Step 202: If remote data of a first display resource is received, the second display resource is rendered using the remote data to obtain a third display resource after remote rendering, and the third display resource is displayed in a browser window of a web page.
[0066] Step 203: If no remote data is received, display the second display resource in the browser window.
[0067] In the embodiment provided by the present application, according to the web page access request, the local data of the first display resource in the web page is used to render the first display resource. After obtaining the rendered second display resource, the second display resource is not immediately displayed in the browser window of the web page. Instead, if the remote data of the first display resource is received, the remote data is used to render the second display resource to obtain the remotely rendered third display resource, and the third display resource is displayed in the browser window of the web page. The same first display resource is only displayed once in the browser window of the web page after rendering, instead of the same first display resource being displayed twice in the browser window of the web page after local data rendering and remote rendering, thereby reducing the occurrence of repeated exposure and improving the accuracy of page resource exposure. If the remote data is not received, the second display resource is displayed in the browser window, so that exposure can still be performed in the case where the remote data is not received, thereby reducing the occurrence of lost exposure and improving the accuracy of page resource exposure.
[0068] In some embodiments, after step 202, the data processing method further includes: sending the exposure type of the third display resource to the server, wherein the exposure type of the third display resource is remote exposure.
[0069] After step 203, the data processing method further includes: sending the exposure type of the second display resource to the server, wherein the exposure type of the second display resource is cache exposure.
[0070] After rendering, the same first display resource is only displayed once in the browser window of the web page, and the exposure type of the same first display resource is only sent to the server once after rendering, instead of sending the exposure type to the server twice after the local data rendering and remote rendering of the same first display resource, which reduces the occurrence of repeated reporting. In addition, the exposure type of the third display resource is marked as remote exposure, so that data can be better played back during subsequent data analysis, which improves the accuracy of page resource reporting.
[0071] If no remote data is received, the second display resource is displayed in the browser window, and the exposure type of the second display resource is sent to the server, wherein the exposure type of the second display resource is cache exposure, so that even if no remote data is received, reporting can still be performed, reducing the occurrence of lost reporting and improving the accuracy of page resource reporting. In addition, the exposure type of the second display resource is marked as cache exposure, so that data can be better played back during subsequent data analysis, improving the accuracy of page home screen resource reporting.
[0072] There is also a situation three in the related art:
[0073] Due to the long return time of network requests, users interact with resources or leave the page before the remote data of certain resources is returned. At this time, the resource exposure uses local data, but the server log data shows that the data sent to the terminal device is remote data. When performing funnel analysis and conversion analysis, the entire link will have data inconsistency errors and cannot be restored / analyzed.
[0074] For example, suppose there is a resource called "membership card". Clicking the card will redirect you to http:xxx.com, and you need to carry the resource id of the member card. Assume that the resource id of the local data of the member card is 1, and the resource id of the remote data of the member card is 2, that is, the click should jump to http:xxx.com? id=2. At this time, because the network request takes a long time to return, the webpage first renders the "membership card" with cache. At this time, the user clicks, jumps and carries the id=1 parameter, that is, http:xxx.com? id=1. At the same time, after receiving the request, the server prints the log of this request, and the id sent to the user's device is 2. When doing conversion analysis later, according to the server log, it is found that the sent id is 2, but the resource exposure report and jump parameters are both 1, resulting in the inability to restore the scene.
[0075] In the third situation in the related art, that is, when the resource reported data, the data carried by the subsequent behavior and the server log data are inconsistent, resulting in data errors and inability to restore / analyze, the exposure type of the second display resource is marked as cache exposure in this application, so it can be clearly known that local data is used in this exposure. Therefore, this analysis data can be discarded or marked as a special situation, which can effectively restore the scene.
[0076] In an exemplary embodiment, the data analysis includes at least one of funnel analysis and conversion analysis.
[0077] In an exemplary embodiment, after step 202, the data processing method further includes: sending the exposure characteristics of the third display resource to the server.
[0078] After step 203, the data processing method further includes: sending the exposure characteristics of the second display resource to the server.
[0079] In an exemplary embodiment, the exposure characteristics include a user ID (or a device ID of a terminal device), a resource name, a title of a page to which the resource belongs, a location of the resource in the page, and a time when the resource is exposed.
[0080] In some embodiments, after step 201, the data processing method further includes:
[0081] The exposure function and exposure type of the second display resource are marked with a resource identifier and stored in the first preset container, wherein the exposure function is used to display the resource in a browser window of a web page.
[0082] After obtaining the remotely rendered third display resource in step 202, the data processing method further includes:
[0083] In a case where the resource identifier of the third display resource exists in the first preset container, replacing the exposure type corresponding to the resource identifier of the third display resource in the first preset container with remote exposure;
[0084] When the resource identifier of the third display resource does not exist in the first preset container, the exposure function and exposure type of the third display resource are marked with the resource identifier and stored in the first preset container.
[0085] In an exemplary embodiment, the resource identifier of a first display resource, the resource identifier of a second display resource obtained by rendering the same first display resource using local data, and the resource identifier of a third display resource obtained by first rendering the same first display resource using local data and then using remote data are the same.
[0086] In some embodiments, after step 201, the data processing method further includes:
[0087] The exposure feature of the second display resource is marked with a resource identifier and stored in the first preset container.
[0088] After obtaining the remotely rendered third display resource in step 202, the data processing method further includes:
[0089] In a case where the resource identifier of the third display resource exists in the first preset container, the exposure characteristic corresponding to the resource identifier of the third display resource in the first preset container is replaced with the exposure characteristic of the third display resource;
[0090] When the resource identifier of the third display resource does not exist in the first preset container, the exposure feature of the third display resource is marked with the resource identifier and stored in the first preset container.
[0091] In an exemplary embodiment, the exposure characteristics include a user ID (or a device ID of a terminal device), a resource name, a title of a page to which the resource belongs, a location of the resource in the page, and a time when the resource is exposed.
[0092] In an exemplary embodiment, different resource identifiers correspond to the same exposure function, which is used to display the resource in the browser window of the web page. The exposure function corresponding to the resource identifier is stored in the first preset container to indicate that the resource corresponding to the resource identifier needs to be displayed in the browser window of the web page. The exposure types corresponding to different resource identifiers may be the same or different. Different resource identifiers correspond to different exposure features.
[0093] In an exemplary embodiment, the first preset container may be a queue (List). As required, the first preset container may also be in other forms, which is not limited in the present application.
[0094] From the definition of resources, we can know that a web page usually contains many resources. When a user opens a website address and the page is loaded, the user sees the first screen content of this web page, that is, multiple resources. Any resource displayed to the user, that is, any resource exposure, needs to be reported to facilitate subsequent data analysis. Therefore, there are multiple resources exposed and reported at the same time.
[0095] The exposure function and exposure type corresponding to each resource identifier are stored in the first preset container, so that it is convenient to read the exposure functions corresponding to multiple resource identifiers from the first preset container, execute the exposure functions on multiple display resources, display the multiple display resources in the browser window, and expose multiple display resources in the home screen of the web page at the same time. Moreover, it is convenient to read the exposure types corresponding to multiple resource identifiers from the first preset container and report them to the server, so that the exposure types of multiple display resources in the home screen of the web page can be reported at the same time.
[0096] In the case where the resource identifier of the third display resource exists in the first preset container, since the exposure function is unchanged, it is only necessary to replace the exposure type corresponding to the resource identifier of the third display resource in the first preset container with remote exposure, thereby reducing the occurrence of multiple exposure types found for the same resource identifier in the first preset container, improving the accuracy of the exposure type read from the first preset container, and thus improving the accuracy of the exposure report of the first screen resource of the page. In the case where the resource identifier of the third display resource does not exist in the first preset container, the exposure function and exposure type corresponding to the resource identifier of the third display resource do not exist in the first preset container. Therefore, it is necessary to mark the exposure function and exposure type of the third display resource with the resource identifier and store them in the first preset container, thereby reducing the occurrence of lost exposure reports, and thus improving the accuracy of the exposure report of the first screen resource of the page.
[0097] In some embodiments, displaying the second display resource in the browser window in step 203 includes:
[0098] An exposure function corresponding to the resource identifier of the second display resource is read from the first preset container; the exposure function is executed on the second display resource to display the second display resource in a browser window of the web page.
[0099] Displaying the third display resource in the browser window of the webpage in step 202 includes:
[0100] An exposure function corresponding to the resource identifier of the third display resource is read from the first preset container; the exposure function is executed on the third display resource to display the third display resource in a browser window of the web page.
[0101] In some embodiments, before sending the exposure type of the second display resource to the server, the data processing method further includes:
[0102] The exposure type corresponding to the resource identifier of the second display resource is read from the first preset container.
[0103] Before sending the exposure type of the third display resource to the server, the data processing method further includes:
[0104] An exposure type corresponding to the resource identifier of the third display resource is read from the first preset container.
[0105] In some embodiments, before sending the exposure feature of the second display resource to the server, the data processing method further includes:
[0106] The exposure feature corresponding to the resource identifier of the second display resource is read from the first preset container.
[0107] Before sending the exposure feature of the third display resource to the server, the data processing method further includes:
[0108] The exposure feature corresponding to the resource identifier of the third display resource is read from the first preset container.
[0109] In some embodiments, before the second display resource is displayed in the browser window in step 203, the data processing method further includes: determining that a remote data acquisition response sent by the server is not received.
[0110] The data processing method further includes: if a remote data acquisition response sent by the server is received, and the remote data acquisition response does not carry remote data, deleting the exposure function and exposure type of the first display resource from the first preset container.
[0111] Failure to receive a remote data acquisition response from the server indicates that the remote data acquisition request has failed or timed out, which may be due to network delays or server errors.
[0112] If a remote data acquisition response is received from the server, and the remote data acquisition response does not carry remote data, it indicates that the server no longer returns the remote data of the first display resource to the terminal device. The purpose is to no longer render the first display resource and display it in the browser window of the web page. It may be that the remote data acquisition request interface of a first display resource in the server is offline, and the remote data of the first display resource is no longer returned to the terminal device. It may also be that the rendering switch or condition in the server has changed. For example, after the flash sale time ends, the server no longer returns the data corresponding to the resource "Limited Time Flash Sale Card". The original intention is to no longer display the resource "Limited Time Flash Sale Card".
[0113] If a remote data acquisition response is received from the server and the remote data acquisition response does not carry remote data, the exposure function and exposure type of the first display resource are deleted from the first preset container, and the user no longer exposes and reports the first display resource corresponding to the remote data acquisition request when opening the page, thereby reducing the exposure and reporting of the exposure type after rendering the first display resource due to the existence of persistent cache, resulting in the occurrence of erroneous exposure reporting.
[0114] An incorrect exposure report means that the information reported for a resource is different from the information displayed to the user. For example, suppose there is a resource called a "limited-time flash sale card". The products, prices, and images to be rendered for the flash sale are provided by the server, and the terminal device initiates a request to obtain them. After the flash sale period ends, the server no longer returns the resource, intending to no longer display the "limited-time flash sale card". At this time, when the user opens the page, the exposure report of the "limited-time flash sale card" resource should no longer be made. However, due to the existence of persistent cache, the web page will still use local data for rendering and exposure reporting, and this report is considered an incorrect exposure report.
[0115] In some embodiments, the data processing method further includes:
[0116] Marking the network request completion status of each first display resource in the webpage with a resource identifier and storing it in a second preset container, where the initial value of the network request completion status is incomplete;
[0117] Sending a remote data acquisition request to the server, wherein the remote data acquisition request is used to acquire remote data of the first display resource;
[0118] The network request completion status of the first display resource corresponding to the remote data acquisition request is replaced from incomplete to completed.
[0119] In an exemplary embodiment, the remote data may be the latest remote data. The server may store multiple remote data of the first display resource and the storage time corresponding to each remote data, calculate the difference between the current time and the storage time, and take the remote data corresponding to the storage time with the smallest difference as the latest remote data.
[0120] Replacing the network request completion status of the first display resource corresponding to the remote data acquisition request from incomplete to completed can reduce the situation where multiple remote data acquisition requests are sent to the same first display resource, that is, repeated requests occur.
[0121] In some embodiments, before the third display resource is displayed in the browser window of the webpage in step 202, the data processing method further includes: determining that the network request completion status of the first display resource in the second preset container meets a preset condition;
[0122] Before displaying the second display resource in the browser window in step 203, the data processing method further includes: determining whether the network request completion status of the first display resource in the second preset container meets a preset condition.
[0123] In an exemplary embodiment, the second preset container may be a set (Map). As required, the second preset container may also be other containers, such as an object, a Set (an associative container containing sorted objects), etc. This application does not limit this.
[0124] When it is determined that the network request completion status of the first display resource in the second preset container meets the preset conditions, the third display resource is displayed in the browser window of the web page, and the second display resource is displayed in the browser window, so that multiple first display resources in the first screen of the web page can be exposed at the same time.
[0125] In some embodiments, determining that the network request completion status of the first display resource in the second preset container meets a preset condition may be implemented in a variety of ways, including but not limited to the following ways:
[0126] Method 1
[0127] It is monitored that the network request completion status of all first display resources in the webpage is completed.
[0128] When it is monitored that the network request completion status of all the first display resources in the web page is completed, the third display resource is displayed in the browser window of the web page, and the second display resource is displayed in the browser window, so that all the first display resources in the first screen of the web page can be exposed at the same time.
[0129] Method 2
[0130] It is monitored that the network request completion status of some first display resources in the webpage is completed, the network request completion status of some first display resources is incomplete, and an event of a user leaving the current page is monitored.
[0131] It is monitored that the network request completion status of some first display resources in the web page is completed, and the network request completion status of some first display resources is incomplete, and the user leaves the current page event, indicating that the solution is not executed and the user leaves the page early. In this case, the first display resources can still be exposed, thereby improving the security and stability of the exposure of the first screen resources of the page.
[0132] In an exemplary embodiment, monitoring the network request completion status of each first display resource in a web page can be achieved by using the ES6 Proxy object to proxy the native collection (Map) object so as to monitor the state change in real time. The Proxy in ES6 is a special object used to create a proxy object. The state monitoring implemented by the Proxy can be replaced by any observer mode implementation.
[0133] In some embodiments, Figure 3 A flowchart of a data processing method provided in an embodiment of the present application. Figure 3 , the method comprising:
[0134] Step 301: Create a first preset container.
[0135] The first preset container is used to mark with a resource identifier and store the exposure function and exposure type of each first display resource in the webpage. The exposure function is used to display the resource in the browser window of the webpage, and the exposure type includes remote exposure and cache exposure.
[0136] Step 302: Create a second preset container.
[0137] The second preset container is used to mark with a resource identifier and store the network request completion status of each first display resource in the webpage, and the initial value of the network request completion status is incomplete.
[0138] Step 303, according to the web page access request, render the first display resource with the local data of the first display resource in the web page to obtain a rendered second display resource, mark the exposure function and exposure type of the second display resource with a resource identifier, store them in the first preset container, and set the exposure type to cache exposure.
[0139] Step 304: Send a remote data acquisition request to the server.
[0140] The remote data acquisition request is used to acquire remote data of the first display resource.
[0141] Step 305: If remote data of a first display resource is received, the second display resource is rendered using the remote data to obtain a third display resource after remote rendering. If a resource identifier of the third display resource exists in the first preset container, the exposure type corresponding to the resource identifier of the third display resource in the first preset container is replaced with remote exposure. If a resource identifier of the third display resource does not exist in the first preset container, the exposure function and exposure type of the third display resource are marked with the resource identifier and stored in the first preset container. The network request completion status of the first display resource corresponding to the remote data acquisition request in the second preset container is replaced from incomplete to completed.
[0142] Step 306: If the remote data acquisition response sent by the server is not received, the network request completion status of the first display resource corresponding to the remote data acquisition request in the second preset container is replaced from incomplete to completed.
[0143] Step 307, if a remote data acquisition response is received from the server and the remote data acquisition response does not carry remote data, the exposure function and exposure type of the first display resource are deleted from the first preset container, and the network request completion status of the first display resource corresponding to the remote data acquisition request in the second preset container is replaced from incomplete to completed.
[0144] Step 308, when it is determined that the network request completion status of the first display resource in the second preset container meets the preset conditions, read the exposure function and exposure type corresponding to the resource identifier of the first display resource from the first preset container, execute the exposure function on the rendered first display resource, display the rendered first display resource in the browser window of the web page, and send the exposure type of the rendered first display resource to the server.
[0145] The rendered first display resource includes the second display resource and the third display resource. Determining that the network request completion status of the first display resource in the second preset container meets the preset condition includes: monitoring that the network request completion status of all the first display resources in the webpage is completed, or monitoring that the network request completion status of some of the first display resources in the webpage is completed, and the network request completion status of some of the first display resources is not completed, and monitoring the user leaving the current page event.
[0146] In an exemplary embodiment, Figure 4 A timing diagram of a data processing method provided in an embodiment of the present application. Figure 4In the process, the user opens the page, the GUI (Graphical User Interface) thread loads the html (HyperText Markup Language) file, the JS (JavaScript, a programming language) thread reads the cached data of resource No. 1 (cached data is local data), the JS thread uses the cached data of resource No. 1 for rendering, and sends the rendered result to the GUI thread. The JS thread notifies the exposure module to expose, and the exposure module adds the exposure function of resource No. 1 to the queue. The exposure function of resource No. 1 is marked with the resource unique identifier (No. 1) and the exposure type (cached exposure); the JS thread reads the cached data of resource No. 2, the JS thread uses the cached data of resource No. 2 for rendering, and sends the rendered result to the GUI thread. The JS thread notifies the exposure module to expose, and the exposure module adds the exposure function of resource No. 2 to the queue. The exposure function of resource No. 2 is marked with the resource unique identifier (No. 1) and the exposure type (cached exposure). The source unique identifier (No. 2) and exposure type (cached exposure) are marked; the JS thread reads the cached data of resource No. 3, the JS thread uses the cached data of resource No. 3 for rendering, and sends the rendered result to the GUI thread. The JS thread notifies the exposure module to expose, and the exposure module adds the exposure function of resource No. 3 to the queue. The exposure function of resource No. 3 is marked with the resource unique identifier (No. 3) and exposure type (cached exposure); the JS thread reads the cached data of resource No. 4, the JS thread uses the cached data of resource No. 4 for rendering, and sends the rendered result to the GUI thread. The JS thread notifies the exposure module to expose, and the exposure module adds the exposure function of resource No. 4 to the queue. The exposure function of resource No. 4 is marked with the resource unique identifier (No. 4) and exposure type (cached exposure).
[0147] The network thread initiates a network request for resource No. 1, and the network thread sends the remote data of resource No. 1 to the JS thread. The JS thread compares the remote data of resource No. 1 with the cached data, and the comparison result is that the remote data of resource No. 1 is consistent with the cached data; the network thread initiates a network request for resource No. 2, and the network thread sends the remote data of resource No. 2 to the JS thread. The JS thread compares the remote data of resource No. 2 with the cached data, and the comparison result is that the remote data of resource No. 2 is inconsistent with the cached data. The JS thread re-renders resource No. 2 according to the remote data of resource No. 2, and sends the rendered result to the GUI thread. The JS thread notifies the exposure module to expose, and the exposure module updates the exposure function of resource No. 2 to the queue. The exposure function of resource No. 2 is marked with the resource unique identifier (No. 2) and the exposure type (remote exposure); the network thread initiates a network request for resource No. 3. The network request of the source, the network thread sends the remote data of resource No. 3 to the JS thread, the JS thread compares the remote data of resource No. 3 with the cached data, the comparison result is that the remote data of resource No. 3 and the cached data are inconsistent, the JS thread re-renders resource No. 3 according to the remote data of resource No. 3, and sends the rendered result to the GUI thread, the JS thread notifies the exposure module to expose, the exposure module updates the exposure function of resource No. 3 to the queue, and the exposure function of resource No. 3 is marked with the resource unique identifier (No. 3) and the exposure type (remote exposure); the network thread initiates a network request for resource No. 4, the network thread sends the remote data of resource No. 4 to the JS thread, the JS thread compares the remote data of resource No. 4 with the cached data, the comparison result is that the remote data of resource No. 4 and the cached data are consistent; the JS thread consumes the queue task and executes the exposure report. The operations performed by the GUI thread, JS thread, and network thread are the browser rendering process.
[0148] It can be understood that the above-mentioned various method embodiments mentioned in this application can be combined with each other to form a combined embodiment without violating the principle logic. Due to space limitations, this application will not go into details. Those skilled in the art can understand that in the above-mentioned method of the specific implementation method, the specific execution order of each step should be determined by its function and possible internal logic.
[0149] In addition, the present application also provides a data processing device, an electronic device, and a computer program product, all of which can be used to implement any data processing method provided by the present application. The corresponding technical solutions and descriptions are referred to in the corresponding records of the method part and will not be repeated here.
[0150] Figure 5 A block diagram of a data processing device provided in an embodiment of the present application.
[0151] Reference Figure 5 , an embodiment of the present application provides a data processing device, the data processing device comprising:
[0152] A rendering module 501 is used to render the first display resource in the web page using the local data of the first display resource according to the web page access request to obtain a rendered second display resource;
[0153] A first processing module 502 is configured to, if receiving remote data of the first display resource, render the second display resource using the remote data to obtain a third display resource after remote rendering, and display the third display resource in the browser window of the web page;
[0154] The second processing module 503 is configured to display the second display resource in the browser window if no remote data is received.
[0155] Each module in the above data processing device can be implemented in whole or in part by software, hardware or a combination thereof. Each module can be embedded in or independent of a processor in a computer device in the form of hardware, or can be stored in a memory in a computer device in the form of software, so that the processor can call and execute operations corresponding to each module.
[0156] Figure 6 A block diagram of an electronic device provided in an embodiment of the present application.
[0157] Reference Figure 6 An embodiment of the present application provides an electronic device, which includes: at least one processor 601; at least one memory 602, and one or more I / O interfaces 603, connected between the processor 601 and the memory 602; wherein the memory 602 stores one or more computer programs that can be executed by at least one processor 601, and the one or more computer programs are executed by at least one processor 601 so that the at least one processor 601 can execute the above-mentioned data processing method.
[0158] Each module in the above electronic device can be implemented in whole or in part by software, hardware, or a combination thereof. Each module can be embedded in or independent of a processor in a computer device in the form of hardware, or can be stored in a memory in a computer device in the form of software, so that the processor can call and execute operations corresponding to each module.
[0159] The embodiment of the present application also provides a computer-readable storage medium on which a computer program is stored, wherein the computer program implements the above-mentioned data processing method when executed by a processor. The computer-readable storage medium may be a volatile or non-volatile computer-readable storage medium.
[0160] An embodiment of the present application also provides a computer program product, including a computer-readable code, or a non-volatile computer-readable storage medium carrying the computer-readable code. When the computer-readable code runs in a processor of an electronic device, the processor in the electronic device executes the above-mentioned data processing method.
[0161] It will be appreciated by those skilled in the art that all or some of the steps, systems, and functional modules / units in the methods disclosed above may be implemented as software, firmware, hardware, and appropriate combinations thereof. In a hardware implementation, the division between the functional modules / units mentioned in the above description does not necessarily correspond to the division of physical components; for example, a physical component may have multiple functions, or a function or step may be performed by several physical components in cooperation. Some or all physical components may be implemented as software executed by a processor, such as a central processing unit, a digital signal processor, or a microprocessor, or may be implemented as hardware, or may be implemented as an integrated circuit, such as an application-specific integrated circuit. Such software may be distributed on a computer-readable storage medium, which may include a computer storage medium (or a non-transitory medium) and a communication medium (or a temporary medium).
[0162] As is known to those of ordinary skill in the art, the term computer storage media includes volatile and nonvolatile, removable and non-removable media implemented in any method or technology for storing information (such as computer-readable program instructions, data structures, program modules or other data). Computer storage media include, but are not limited to, random access memory (RAM), read-only memory (ROM), erasable programmable read-only memory (EPROM), static random access memory (SRAM), flash memory or other memory technology, portable compact disk read-only memory (CD-ROM), digital versatile disk (DVD) or other optical disk storage, magnetic cassettes, magnetic tapes, magnetic disk storage or other magnetic storage devices, or any other medium that can be used to store desired information and can be accessed by a computer. In addition, it is known to those of ordinary skill in the art that communication media typically contain computer-readable program instructions, data structures, program modules or other data in a modulated data signal such as a carrier wave or other transmission mechanism, and may include any information delivery medium.
[0163] The computer-readable program instructions described herein can be downloaded from a computer-readable storage medium to each computing / processing device, or downloaded to an external computer or external storage device via a network, such as the Internet, a local area network, a wide area network, and / or a wireless network. The network can include copper transmission cables, optical fiber transmissions, wireless transmissions, routers, firewalls, switches, gateway computers, and / or edge servers. The network adapter card or network interface in each computing / processing device receives the computer-readable program instructions from the network and forwards the computer-readable program instructions for storage in the computer-readable storage medium in each computing / processing device.
[0164] The computer program instructions for performing the operation of the present application can be assembler instructions, instruction set architecture (ISA) instructions, machine instructions, machine-related instructions, microcode, firmware instructions, state setting data, or source code or object code written in any combination of one or more programming languages, including object-oriented programming languages, such as Smalltalk, C++, etc., and conventional procedural programming languages, such as "C" language or similar programming languages. Computer-readable program instructions can be executed completely on a user's computer, partially on a user's computer, executed as an independent software package, partially on a user's computer, partially on a remote computer, or completely on a remote computer or server. In the case of a remote computer, the remote computer can be connected to the user's computer through any type of network, including a local area network (LAN) or a wide area network (WAN), or can be connected to an external computer (for example, using an Internet service provider to connect through the Internet). In some embodiments, by using the state information of a computer-readable program instruction to personalize an electronic circuit, such as a programmable logic circuit, a field programmable gate array (FPGA) or a programmable logic array (PLA), the electronic circuit can execute a computer-readable program instruction, thereby realizing various aspects of the present application.
[0165] The computer program product described herein may be implemented in hardware, software, or a combination thereof. In one optional embodiment, the computer program product is embodied as a computer storage medium, and in another optional embodiment, the computer program product is embodied as a software product, such as a software development kit (SDK), etc.
[0166] Various aspects of the present application are described herein with reference to the flowcharts and / or block diagrams of the methods, devices (systems) and computer program products according to the embodiments of the present application. It should be understood that each box in the flowchart and / or block diagram and the combination of each box in the flowchart and / or block diagram can be implemented by computer-readable program instructions.
[0167] These computer-readable program instructions can be provided to a processor of a general-purpose computer, a special-purpose computer, or other programmable data processing device, thereby producing a machine, so that when these instructions are executed by the processor of the computer or other programmable data processing device, a device that implements the functions / actions specified in one or more boxes in the flowchart and / or block diagram is generated. These computer-readable program instructions can also be stored in a computer-readable storage medium, and these instructions cause the computer, programmable data processing device, and / or other equipment to work in a specific manner, so that the computer-readable medium storing the instructions includes a manufactured product, which includes instructions for implementing various aspects of the functions / actions specified in one or more boxes in the flowchart and / or block diagram.
[0168] Computer-readable program instructions may also be loaded onto a computer, other programmable data processing apparatus, or other device so that a series of operating steps are performed on the computer, other programmable data processing apparatus, or other device to produce a computer-implemented process, thereby causing the instructions executed on the computer, other programmable data processing apparatus, or other device to implement the functions / actions specified in one or more boxes in the flowchart and / or block diagram.
[0169] The flow chart and block diagram in the accompanying drawings show the possible architecture, function and operation of the system, method and computer program product according to multiple embodiments of the present application. In this regard, each square box in the flow chart or block diagram can represent a part of a module, program segment or instruction, and a part of the module, program segment or instruction includes one or more executable instructions for realizing the logical function of the specification. In some alternative implementations, the function marked in the square box can also occur in a sequence different from that marked in the accompanying drawings. For example, two continuous square boxes can actually be executed substantially in parallel, and they can also be executed in the opposite order sometimes, depending on the function involved. It should also be noted that each square box in the block diagram and / or flow chart, and the combination of the square boxes in the block diagram and / or flow chart can be realized by a dedicated hardware-based system that performs the function or action of the specification, or can be realized by a combination of special-purpose hardware and computer instructions.
[0170] Example embodiments have been disclosed herein, and although specific terms are employed, they are used and should be interpreted only in a general illustrative sense and not for limiting purposes. In some instances, it will be apparent to those skilled in the art that, unless otherwise expressly noted, features, characteristics, and / or elements described in conjunction with a particular embodiment may be used alone or in combination with features, characteristics, and / or elements described in conjunction with other embodiments. Therefore, those skilled in the art will appreciate that various changes in form and detail may be made without departing from the scope of the present application as set forth in the appended claims.
Claims
1. A data processing method, characterized in that: include: According to the webpage access request, the local data of the first display resource in the webpage is used to render the first display resource to obtain a rendered second display resource; If the remote data of the first display resource is received, the second display resource is rendered using the remote data to obtain a third display resource after remote rendering, and the third display resource is displayed in the browser window of the webpage; If no remote data is received, the second display resource is displayed in the browser window.
2. The data processing method according to claim 1, characterized in that: After displaying the third display resource in the browser window of the webpage, the method further includes: sending the exposure type of the third display resource to the server, wherein the exposure type of the third display resource is remote exposure; After displaying the second display resource in the browser window, the method further includes: The exposure type of the second display resource is sent to the server, wherein the exposure type of the second display resource is cache exposure.
3. The data processing method according to claim 2, characterized in that: After obtaining the rendered second display resource, the method further includes: marking the exposure function and exposure type of the second display resource with a resource identifier and storing them in a first preset container, wherein the exposure function is used to make the resource displayed in the browser window of the webpage; After obtaining the remotely rendered third display resource, the method further includes: In a case where the resource identifier of the third display resource exists in the first preset container, replacing the exposure type corresponding to the resource identifier of the third display resource in the first preset container with remote exposure; When the resource identifier of the third display resource does not exist in the first preset container, the exposure function and exposure type of the third display resource are marked with the resource identifier and stored in the first preset container.
4. The data processing method according to claim 3, characterized in that: The method further includes: displaying the second display resource before the browser window; Determining that a remote data acquisition response sent by the server is not received; The method further comprises: If a remote data acquisition response sent by the server is received, and the remote data acquisition response does not carry remote data, the exposure function and exposure type of the first display resource are deleted from the first preset container.
5. The data processing method according to claim 1, characterized in that: The method further comprises: Marking the network request completion status of each first display resource in the webpage with a resource identifier and storing the result in a second preset container, wherein the initial value of the network request completion status is incomplete; Sending a remote data acquisition request to a server, wherein the remote data acquisition request is used to acquire remote data of the first display resource; The network request completion status of the first display resource corresponding to the remote data acquisition request is replaced from incomplete to completed.
6. The data processing method according to claim 5, characterized in that: The method further comprises: displaying the third display resource before the browser window of the webpage; Determining that a network request completion status of the first display resource in the second preset container meets a preset condition; The method further includes: displaying the second display resource before the browser window; It is determined that a network request completion status of the first display resource in the second preset container meets a preset condition.
7. The data processing method according to claim 6, characterized in that: The determining that the network request completion status of the first display resource in the second preset container meets a preset condition includes: It is monitored that the network request completion status of all first display resources in the webpage is completed.
8. The data processing method according to claim 6, characterized in that: The determining that the network request completion status of the first display resource in the second preset container meets a preset condition includes: It is monitored that the network request completion status of some first display resources in the webpage is completed, the network request completion status of some first display resources is incomplete, and an event of a user leaving the current page is monitored.
9. A data processing device, characterized in that: include: A rendering module, configured to render the first display resource in the web page using the local data of the first display resource according to the web page access request, to obtain a rendered second display resource; A first processing module is configured to, if receiving remote data of the first display resource, render the second display resource using the remote data to obtain a third display resource after remote rendering, and display the third display resource in a browser window of the web page; The second processing module is configured to display the second display resource in the browser window if no remote data is received.
10. An electronic device, characterized in that: include: at least one processor; as well as a memory communicatively connected to the at least one processor; wherein, The memory stores one or more computer programs executable by the at least one processor, and the one or more computer programs are executed by the at least one processor to enable the at least one processor to perform the data processing method according to any one of claims 1 to 8.
11. A computer program product, characterized in that The invention comprises a computer-readable code, or a non-volatile computer-readable storage medium carrying the computer-readable code. When the computer-readable code runs in a processor of an electronic device, the processor in the electronic device executes the data processing method as described in any one of claims 1 to 8.
