A method, device and electronic equipment for determining completion of page rendering
By constructing an array to detect page content, the problem of inaccurate rendering completion time caused by network request returned data was solved, and the page loading speed was accurately determined.
Patent Information
- Application Number
- CN202210516038.9
- Authority / Receiving Office
- CN · China
- Patent Type
- Patents(China)
- Current Assignee / Owner
- Filing Date
- 2022-05-12
- Publication Date
- 2026-01-20
- Estimated Expiration
- 2042-05-12
AI Technical Summary
In existing technologies, determining the time point when page rendering is completed by returning data from network requests is inaccurate, making it impossible to accurately determine page loading speed.
By constructing an array based on the first and second sides of the target page, the display of the target content is detected. The target identifier is used to fill the corresponding data positions in the array, and the page rendering is determined to be complete if the proportion of the target identifier reaches a preset threshold.
It improves the accuracy of page rendering completion time, reduces the computational load and performance consumption of electronic devices, and accurately determines page loading speed.
Smart Images

Figure CN114925303B_ABST
Abstract
Description
TECHNICAL FIELD
[0001] The present disclosure relates to the technical field of network, and particularly relates to a method and device for determining page rendering completion and electronic equipment. BACKGROUND
[0002] Optimizing the performance of an application (APP) is a very important step in the process of APP development, and among them, accurately determining the loading speed of an APP page has a very obvious influence on the user experience. Accurately determining whether a page is rendered (i.e., accurately determining the time node of page rendering completion) is an important factor in accurately determining the loading time required for page completion. The current time node of page rendering completion is determined by using the corresponding page container callback method in the page loading process, i.e., the time point of receiving the return data of the network request is determined as the time node of page rendering completion.
[0003] In the above method, since the content displayed by the page depends on the return data of the network request, the time node determined by the above method is the time node of the network request return data. In this case, since the return data needs to be processed after being received to display the corresponding content in the page, the page corresponding to the determined time node has not been truly rendered, but only the basic page container has been loaded (without displaying specific content in the page). Therefore, there is a large difference between the determined time node of page rendering completion and the real time node of page rendering completion, so that the time node of page rendering completion cannot be accurately determined, and the loading speed of the page cannot be accurately determined. SUMMARY
[0004] The present disclosure provides a method and device for determining page rendering completion and electronic equipment, which can improve the accuracy of determining the time node of page rendering completion to accurately determine the loading speed of the page. The technical solution of the present disclosure is as follows:
[0005] According to a first aspect of the present disclosure, a method for determining completion of page rendering is provided, which comprises: constructing a first array based on a first side of a target page to be loaded, a data length in the first array matching a number of pixels corresponding to the first side, and a data position in the first array corresponding to a pixel included in the first side of the target page; constructing a second array based on a second side of the target page, a data length in the second array matching a number of pixels corresponding to the second side, and a data position in the second array corresponding to a pixel included in the second side of the target page, the second side being adjacent to the first side; in a case where it is detected that the target content is displayed in the target page, filling the data position corresponding to the pixel where the target content is located in the first array and the second array by a target identifier; and in a case where a proportion of the target identifier included in the first array and the second array is greater than or equal to a preset proportion, determining that the target page is rendered.
[0006] As can be seen from the above, in the process of loading the target page, the first array can be constructed based on the first side of the target page to be loaded, and the second array can be constructed based on the second side of the target page, in the process of constructing the first array and the second array, the data length in the first array constructed matches the number of pixels corresponding to the first side, and the data position in the first array corresponds to the pixel included in the first side of the target page; the data length in the second array matches the number of pixels corresponding to the second side, and the data position in the second array corresponds to the pixel included in the second side of the target page. Through this implementation manner, in a case where it is detected that the target content is displayed in the target page, the data position corresponding to the pixel where the target content is located in the first array and the second array constructed can be filled by the target identifier, so as to determine that the target page is rendered in a case where the proportion of the target identifier included in the first array and the second array is greater than or equal to the preset proportion. Without relying on the returned data of the network request, the time node of the network request returned data is determined as the time point of completion of page rendering, which will not cause a large difference between the determined time node of completion of page rendering and the real time node of completion of page rendering. By constructing two one-dimensional arrays to indicate the rendering of the page, the calculation amount of the electronic device can be reduced, the performance consumption is low, and the accuracy of the time point of determining completion of page rendering can be improved, and the loading speed of the page can be determined more accurately.
[0007] Optionally, the method of "filling the data positions corresponding to the target content in the first array and the second array with the target identifier when it is detected that the target content is displayed in the target page" specifically comprises: detecting the target content displayed in the target page once every preset number of frame refreshes during the loading process of the target page; or detecting the target content displayed in the target page once every preset time length; when it is detected that the position of the target pixel in the target page is filled with the target content, filling the data positions corresponding to the coordinate points of the target pixel in the first array and the second array with the target identifier; the target content comprises at least one of the following: a picture, a video, a text, a control, and a placeholder.
[0008] As can be seen from the above, during the loading process of the target page, the target content displayed in the target page can be detected once every preset number of frame refreshes or once every preset time length; thus, when it is detected that the position of the target pixel in the target page is filled with the target content, the data positions corresponding to the coordinate points of the target pixel in the first array and the second array are filled with the target identifier. Through this implementation manner, the target content displayed in the target page can be detected in real time by means of interval preset number of frame refreshes or interval preset time length, and the position of the corresponding pixel in the target page filled with the target content can be accurately determined through the target identifier filled in the first array and the second array, so that the completion of the rendering of the target page can be determined in real time and accurately.
[0009] Optionally, the method of "detecting the target content displayed in the target page once every preset number of frame refreshes during the loading process of the target page" specifically comprises: when the target page is refreshed for the preset number of times and the time length consumed by the preset number of frame refreshes is greater than or equal to a first preset time length and less than or equal to a second preset time length, detecting the target content displayed in the target page during the loading process of the target page, the first preset time length being less than the second preset time length; and the method further comprises: when the target page is refreshed for the preset number of times and the time length consumed by the preset number of frame refreshes is less than the first preset time length, the target page continues to be refreshed for a first target number of times, and when the total time length consumed by the preset number of frame refreshes and the first target number of frame refreshes is greater than or equal to the first preset time length, the target content displayed in the target page is detected; when the target page is refreshed for a second target number of times and the time length consumed by the second target number of frame refreshes is greater than the second preset time length and the second target number is less than the preset number, the target content displayed in the target page is detected.
[0010] From the above, in the loading process of the target page, the frame refresh number of the target page can be combined with the size relationship between the time length consumed by the frame refresh number of the target page and the first preset time length and the second preset time length, to accurately determine the timing of detecting the target content displayed in the target page. Through this implementation manner, an accurate timing of detecting the target content displayed in the target page is given. By judging the frame refresh number of the target page and the time length consumed by the frame refresh number of the target page, the timing of detecting the target content displayed in the target page can be accurately determined, so that the target content displayed in the target page can be detected in time, the efficiency of detecting the target content displayed in the target page is improved, and the processing resources required for detection can also be saved as much as possible.
[0011] Optionally, the method of "filling the data positions corresponding to the pixels where the target content is located in the first array and the second array by the target identifier in the case where it is detected that the target content is displayed in the target page" specifically comprises: recursively traversing the multiple child views included from the root view corresponding to the target page; and filling the data positions corresponding to the pixels where the target content is located in the first array and the second array by the target identifier in the case where it is detected that the target content is included in the view.
[0012] From the above, the multiple child views included can be recursively traversed from the root view corresponding to the target page, and the data positions corresponding to the pixels where the target content is located in the first array and the second array can be filled by the target identifier in the case where it is detected that the target content is included in the view. Through this implementation manner, a specific detection manner of detecting that the target content is displayed in the target page is given. The target content included in the view is detected step by step by recursively traversing the multiple child views included from the root view, so that the target content displayed in the target page can be avoided to be missed, the accuracy of detecting that the target content is displayed in the target page can be improved, and the target content can be prevented from not being detected in time due to missing.
[0013] Optionally, the method of "determining that the target page is rendered in the case where the proportion of the target identifier included in the first array and the second array is greater than or equal to a preset proportion" specifically comprises: determining a first proportion of the target identifier included in the first array, and determining a second proportion of the target identifier included in the second array; and determining that the target page is rendered in the case where at least one of the first proportion and the second proportion is greater than or equal to the preset proportion.
[0014] From the above, the first proportion of the target identifier included in the first array and the second proportion of the target identifier included in the second array can be determined respectively; and in a case where at least one of the first proportion and the second proportion is greater than or equal to the preset proportion, it is determined that the target page is rendered. Through this implementation manner, multiple judgment manners for determining that the target page is rendered are given, and the diversity of determining that the target page is rendered is improved.
[0015] Optionally, the above method further includes: in a case where it is determined that the proportion of the target identifier is less than the preset proportion after the third preset time period, ending the detection of the target content displayed in the target page, and determining that the target page is rendered.
[0016] From the above, in a case where it is determined that the proportion of the target identifier is less than the preset proportion for a long time, the detection of the target content displayed in the target page can be ended, and it is determined that the target page is rendered. Through this implementation manner, a specific implementation manner for judging that the target page is rendered in a special case, i.e., a case where it is determined that the proportion of the target identifier is less than the preset proportion for a long time, is given, and the accuracy of determining that the target page is rendered is further improved.
[0017] Optionally, the above method further includes: detecting a target display area corresponding to the target content displayed in the target page; determining a third proportion of the target display area in the total area of the target page, and in a case where it is determined that the third proportion is greater than or equal to the preset proportion, determining that the target page is rendered.
[0018] From the above, the target display area corresponding to the target content displayed in the target page can also be detected, and the proportion of the target display area in the total area of the target page is judged, so that in a case where it is determined that the proportion of the target display area in the total area of the target page is greater than or equal to the preset proportion, it is determined that the target page is rendered. Through this implementation manner, a manner for determining whether the target page is rendered by judging the proportion of the target display area in the total area of the target page is given, and the rendering of the target page can be determined more accurately through the two-dimensional array manner.
[0019] Optionally, after the method of determining that the target page is rendered, the method can further include: determining a first time node corresponding to the time when the target page is rendered; determining the loading speed of the target page based on the first time node and a second time node, the second time node being a time node corresponding to the time when the request for loading the target page is sent, and the loading speed being used to reflect the time consumption for loading the target page.
[0020] It can be known from the above that, in the case that the target page rendering is determined to be completed, the first time node corresponding to the completion of the target page rendering can be further determined, and the loading speed of the target page can be determined in combination with the second time node corresponding to the sending of the request for loading the target page, so that the loading speed reflects the time consumption of loading the target page. Through this implementation manner, the loading speed of the target page can be more accurately determined through the time node corresponding to the completion of the target page rendering, and the accuracy of determining the loading speed of the target page is improved.
[0021] According to a second aspect of the present disclosure, a device for determining completion of page rendering is provided, which comprises a construction unit, a filling unit, a determination unit and a detection unit. The construction unit is configured to construct a first array based on a first side of a target page to be loaded, the data length in the first array matches the number of pixels corresponding to the first side, and the data position in the first array corresponds to the pixels included in the first side of the target page. The construction unit is configured to construct a second array based on a second side of the target page, the data length in the second array matches the number of pixels corresponding to the second side, and the data position in the second array corresponds to the pixels included in the second side of the target page, the second side being adjacent to the first side. The filling unit is configured to fill the data position corresponding to the pixel where the target content is located in the first array and the second array with the target identifier when it is detected that the target content is displayed in the target page. The determination unit is configured to determine that the target page rendering is completed when the proportion of the target identifier included in the first array and the second array is greater than or equal to a preset proportion.
[0022] Optionally, the detection unit is configured to detect the target content displayed in the target page once every preset number of frame refreshes in the loading process of the target page, or detect the target content displayed in the target page once every preset time length. The filling unit is configured to fill the data position corresponding to the coordinate point of the target pixel in the first array and the second array with the target identifier when it is detected that the position of the target pixel in the target page is filled with the target content. The target content comprises at least one of the following: a picture, a video, a text, a control and a placeholder.
[0023] Optionally, the detection unit is configured to detect the target content displayed in the target page when the target page undergoes the preset number of frame refreshes and a time length consumed by the preset number of frame refreshes is greater than or equal to a first preset time length and less than or equal to a second preset time length in a loading process of the target page, the first preset time length being less than the second preset time length; the detection unit is configured to detect the target content displayed in the target page when the target page undergoes the preset number of frame refreshes and a time length consumed by the preset number of frame refreshes is less than the first preset time length, the target page continuing to undergo a first target number of frame refreshes, and the target content displayed in the target page being detected when a total time length consumed by the preset number of frame refreshes and the first target number of frame refreshes is greater than or equal to the first preset time length in the loading process of the target page; and the detection unit is configured to detect the target content displayed in the target page when the target page undergoes a second target number of frame refreshes and a time length consumed by the second target number of frame refreshes is greater than the second preset time length and the second target number is less than the preset number.
[0024] Optionally, the detection unit is configured to recursively traverse a plurality of child views included from a root view corresponding to the target page; and the filling unit is configured to fill, when it is detected that the target content is included in the view, the target content in the first array and the second array by means of the target identifier.
[0025] Optionally, the determination unit is configured to determine a first proportion of the target identifier included in the first array and determine a second proportion of the target identifier included in the second array; and the determination unit is configured to determine that the target page is rendered complete when at least one of the first proportion and the second proportion is greater than or equal to a preset proportion.
[0026] Optionally, the determination unit is configured to end detection of the target content displayed in the target page and determine that the target page is rendered complete when it is determined that the proportion of the target identifier is less than the preset proportion after a third preset time length.
[0027] Optionally, the detection unit is configured to detect a target display area corresponding to the target content displayed in the target page; and the determination unit is configured to determine a third proportion of the target display area in a total area of the target page and determine that the target page is rendered complete when the third proportion is greater than or equal to a preset proportion.
[0028] Optionally, the determination unit is configured to determine a first time node corresponding to a time when the target page is determined to be rendered complete; and the determination unit is configured to determine a loading speed of the target page based on the first time node and a second time node, the second time node being a time node corresponding to a time when a request for loading the target page is sent, the loading speed being used to reflect a time length consumed for loading the target page.
[0029] According to a third aspect of the present disclosure, an electronic device is provided, the electronic device comprising:
[0030] a processor; a memory for storing processor-executable instructions; wherein the processor is configured to execute the instructions to implement the method of optionally determining completion of page rendering of any of the first aspect.
[0031] According to a fourth aspect of the present disclosure, a computer-readable storage medium is provided, the computer-readable storage medium having instructions stored thereon, the instructions, when executed by a processor of an electronic device, causing the electronic device to perform the method of optionally determining completion of page rendering of any of the first aspect.
[0032] According to a fifth aspect of the present disclosure, a computer program product is provided, comprising a computer program, the computer program, when executed by a processor, implementing the method of optionally determining completion of page rendering of any of the first aspect.
[0033] According to a sixth aspect of the present disclosure, the present disclosure provides a chip, the chip comprising a processor and a communication interface, the communication interface and the processor being coupled, the processor being configured to run a computer program or instructions to implement the method of optionally determining completion of page rendering of any of the first aspect.
[0034] The technical solutions provided by the present disclosure at least bring the following beneficial effects:
[0035] In the disclosure, in the process of loading a target page, a first array can be constructed based on a first side of the target page to be loaded, and a second array can be constructed based on a second side of the target page. In the process of constructing the first array and the second array, the data length in the constructed first array matches the number of pixels corresponding to the first side, and the data position in the first array corresponds to the pixels included in the first side of the target page. The data length in the second array matches the number of pixels corresponding to the second side, and the data position in the second array corresponds to the pixels included in the second side of the target page. Through this implementation manner, in the case that the target content is displayed in the target page, the data position corresponding to the pixels where the target content is located in the first array and the second array can be filled by the target identifier. In the case that the proportion of the target identifier included in the first array and the second array is greater than or equal to a preset proportion, it is determined that the target page is rendered. Without relying on the return data of the network request, the time node of the return data of the network request is determined as the time point when the page is rendered, which will not cause a large difference between the determined time node when the page is rendered and the real time node when the page is rendered. By constructing two one-dimensional arrays to indicate the rendering of the page, the calculation amount of the electronic device can be reduced, the performance consumption is low, and the accuracy of determining the time point when the page is rendered can be improved, and the loading speed of the page can be accurately determined.
[0036] It should be understood that the foregoing general description and the following detailed description are only exemplary and explanatory, and cannot limit the disclosure. BRIEF DESCRIPTION OF DRAWINGS
[0037] The accompanying drawings incorporated in the specification and forming a part of it illustrate embodiments consistent with the present disclosure and, together with the description, serve to explain the principles of the disclosure without imposing undue limitation on the disclosure.
[0038] Figure 1 is a schematic diagram of a system for determining page rendering completion according to an embodiment of the disclosure;
[0039] Figure 2 is a flowchart of a method for determining page rendering completion according to an embodiment of the disclosure;
[0040] Figure 3 is a coordinate diagram of a method for determining page rendering completion according to an embodiment of the disclosure;
[0041] Figure 4 is a flowchart of another method for determining page rendering completion according to an embodiment of the disclosure;
[0042] Figure 5is a flowchart of still another method for determining completion of page rendering according to an embodiment of the present disclosure;
[0043] Figure 6 is a flowchart of still another method for determining completion of page rendering according to an embodiment of the present disclosure;
[0044] Figure 7 is a flowchart of still another method for determining completion of page rendering according to an embodiment of the present disclosure;
[0045] Figure 8 is a coordinate diagram of another method for determining completion of page rendering according to an embodiment of the present disclosure;
[0046] Figure 9 is a coordinate diagram of still another method for determining completion of page rendering according to an embodiment of the present disclosure;
[0047] Figure 10 is a flowchart of still another method for determining completion of page rendering according to an embodiment of the present disclosure;
[0048] Figure 11 is a flowchart of still another method for determining completion of page rendering according to an embodiment of the present disclosure;
[0049] Figure 12 is a structure diagram of a device for determining completion of page rendering according to an embodiment of the present disclosure;
[0050] Figure 13 is a structure diagram of another device for determining completion of page rendering according to an embodiment of the present disclosure. DETAILED DESCRIPTION
[0051] In order for those skilled in the art to better understand the technical solutions of the present disclosure, the technical solutions in the embodiments of the present disclosure will be described clearly and completely below with reference to the drawings.
[0052] It should be noted that the terms "first", "second", etc. in the specification and claims of the present disclosure and the above-mentioned drawings are used to distinguish similar objects, and do not necessarily have to be used to describe a specific order or sequence. It should be understood that the data thus used can be interchanged under appropriate circumstances, so that the embodiments of the present disclosure described herein can be implemented in an order other than those illustrated or described herein. The implementation described in the following exemplary embodiments does not represent all implementations consistent with the present disclosure. Rather, they are merely examples of devices and methods consistent with some aspects of the present disclosure as detailed in the appended claims.
[0053] It should be noted that the user information (including but not limited to user equipment information, user personal information, user behavior information, etc.) and data involved in the present disclosure are all information and data authorized by the user or authorized by all parties.
[0054] Currently, it is very important to optimize the performance of the application in the process of APP development, and among them, accurately determining the loading speed of the APP page has a very obvious influence on the user experience. Accurately determining whether the page is rendered is an important factor in accurately determining the loading time required for page completion. The current time node for determining the completion of page rendering is determined by using the system callback time node of the corresponding page container in the page loading process when starting rendering, that is, the time point when the returned data corresponding to the network request is received is determined as the time node for determining the completion of page rendering. For example, for the iOS system, the callback method of the page container when the display (rendering) is completed is: -(void)viewDidAppear:(BOOL)animated. In this case, if the conventional page container callback method (i.e. -(void)viewDidAppear:(BOOL)animated) is used, there will be a relatively obvious problem: most App pages that want to show content to users depend on the returned data of network requests, and the method is almost called before the network request returns. Therefore, at this time, the page has not really rendered, but only the basic page container has been loaded; the rendering of the page depending on the network data return cannot really monitor whether the page is rendered, that is, it causes the inconsistency between the data obtained in the monitoring stage and the user experience. Therefore, there is a large difference between the determined time node for determining the completion of page rendering and the real time node for determining the completion of page rendering, so that the time node for determining the completion of page rendering cannot be accurately determined, and the loading speed of the page cannot be accurately determined.
[0055] To address the aforementioned issues, this disclosure provides a method for determining page rendering completion. During the loading of a target page, a first array can be constructed based on a first side of the target page to be loaded, and a second array can be constructed based on a second side of the target page. During the construction of the first and second arrays, the data length in the first array matches the number of pixels corresponding to the first side, and the data positions in the first array correspond to the pixels included in the first side of the target page. Similarly, the data length in the second array matches the number of pixels corresponding to the second side, and the data positions in the second array correspond to the pixels included in the second side of the target page. Through this implementation, when target content is detected on the target page, the data positions corresponding to the pixels where the target content is located in the constructed first and second arrays can be filled with target identifiers. If the proportion of target identifiers included in the first and second arrays is greater than or equal to a preset proportion, the rendering of the target page is determined to be complete. Instead of relying on the returned data from network requests, the time point when the network request returns data is determined as the time point when page rendering is completed. This avoids a significant difference between the determined time point and the actual time point when page rendering is completed. By constructing two one-dimensional arrays to indicate the page rendering status, the computational load on electronic devices can be reduced, performance consumption is lower, and the accuracy of determining the time point when page rendering is completed can be improved, thus accurately determining the page loading speed.
[0056] The content display method provided by the embodiments of this disclosure is illustrated below with reference to the accompanying drawings:
[0057] First, the application scenarios of the embodiments of this disclosure will be introduced. Figure 1 This is a schematic diagram of a system for determining page rendering completion provided in an embodiment of this disclosure, such as... Figure 1 As shown, the system for determining when page rendering is complete may include server 11 and client 12. Figure 1 This specification only provides one client 12 as an example; in specific implementations, there may be more clients. A communication connection can be established between the server 11 and the client 12. The connection between the server 11 and the client 12 can be wired or wireless; this embodiment does not limit the method. After opening any page through the client 12, the rendering (loading) status of the page can be detected in real time based on the solution provided in this disclosure, thereby determining whether the page has been fully rendered based on the content displayed on the page.
[0058] Server 11 is used to interact with client 12 for data information exchange, and returns corresponding data information to client 12 based on the data signaling received from client 12.
[0059] Client 12 is used to display the page and detect the rendering status of the page during the display process. It determines whether the page has been rendered successfully based on the content displayed on the page. When the page needs to be loaded, it interacts with server 11 to obtain the required data information to realize the rendering of the page.
[0060] In one feasible implementation, server 11 can be a single server, a server cluster consisting of multiple servers, or a cloud computing service center. Server 11 may include a processor, memory, and network interfaces, etc.
[0061] In one feasible implementation, client 12 is used to provide voice and / or data connectivity services to a user. Client 12 may have different names, such as UE terminal, terminal unit, terminal station, mobile station, mobile station, remote station, remote terminal, mobile device, wireless communication device, vehicle user equipment, terminal agent, or terminal device, etc.
[0062] Optionally, the client 12 can be various handheld devices, in-vehicle devices, wearable devices, or computers with communication functions, and this disclosure does not limit this in any way. For example, the handheld device can be a smartphone. The in-vehicle device can be an in-vehicle navigation system. The wearable device can be a smart bracelet. The computer can be a personal digital assistant (PDA) computer, a tablet computer, or a laptop computer.
[0063] The method for determining page rendering completion provided in this disclosure can be applied to an electronic device, which can be the aforementioned... Figure 1 The system shown illustrates server 11 and client 12 in a system for determining page rendering completion. Taking the application of the method for determining page rendering completion of this disclosure to a client during business execution as an example, the method for determining page rendering completion provided by the embodiments of this disclosure will be described in detail.
[0064] After introducing the application scenarios and the system for determining page rendering completion of the embodiments of this disclosure, the following will be combined with... Figure 1 The system for determining page rendering completion shown herein will be described in detail, along with the method for determining page rendering completion provided in the embodiments of this disclosure.
[0065] like Figure 2 The flowchart illustrates a method for determining page rendering completion according to an exemplary embodiment, applied to an electronic device, which may be a client (terminal device). The method for determining page rendering completion may include steps S201-S203.
[0066] S201. Construct a first array based on the first side of the target page to be loaded, and construct a second array based on the second side of the target page.
[0067] The electronic device can construct a first array based on a first side, where the length of the data in the first array matches the number of pixels corresponding to the first side, and the data positions in the first array correspond to the pixels included in the first side of the target page. The electronic device can also construct a second array based on a second side, where the length of the data in the second array matches the number of pixels corresponding to the second side, and the data positions in the second array correspond to the pixels included in the second side of the target page. The second side is adjacent to the first side.
[0068] In this embodiment of the disclosure, when an electronic device loads a target page, it can construct a first array based on the first edge of two adjacent edges of the target page to be loaded, and a second array based on the second edge of two adjacent edges. During the construction of the first and second arrays, the data length in the first array must match the number of pixels corresponding to the first edge, and the data length in the second array must match the number of pixels corresponding to the second edge. Therefore, when target content is detected on the target page, the data positions corresponding to the pixels where the target content is located can be directly filled into the first and second arrays using target identifiers. If the proportion of target identifiers included in the first and second arrays is greater than or equal to a preset proportion, the rendering of the target page is determined to be complete.
[0069] Optionally, the electronic device may first construct a target coordinate system based on the first and second adjacent sides in the target page to be loaded, and make the horizontal axis of the constructed target coordinate system in the same direction as the first side, and the vertical axis in the same direction as the second side.
[0070] Optionally, the target page can be any interface that an electronic device can display, such as any of the following: a webpage containing text or images, an application interface, a video playback interface, etc.
[0071] It should be noted that the first and second sides can be any two adjacent sides of the target page. In some cases, the first side (e.g., the long side) and the second side (e.g., the wide side) of the target page may be equal, meaning the target page can be a square.
[0072] Optionally, the first side of the target page can be the top side of the target page, and the second side of the target page can be the left side of the target page. The origin of the target coordinate system constructed based on the first and second sides is the vertex of the top left corner of the target page. The horizontal axis of the target coordinate system extends to the right, and the vertical axis of the target coordinate system extends downward.
[0073] Optionally, the first side of the target page can be the bottom side of the target page, and the second side of the target page can be the left side of the target page. The origin of the target coordinate system constructed based on the first and second sides is the vertex of the bottom left corner of the target page. The horizontal axis of the target coordinate system extends to the right, and the vertical axis of the target coordinate system extends upward.
[0074] For example, such as Figure 3 As shown, a target coordinate system is constructed using the top and left edges of the target page 10 as examples. A first array 11 and a second array 12 are constructed based on the horizontal and vertical axes of the target coordinate system. For example, the top edge of the target page 10 corresponds to 9 pixels (i.e., the horizontal coordinate of the target coordinate system includes 9 coordinate points, and the first array 11 includes 9 data positions), and the left edge corresponds to 12 pixels (i.e., the vertical coordinate of the target coordinate system includes 12 coordinate points, and the second array 12 includes 12 data positions). When the electronic device detects the first content 13, the second content 14, and the third content 15 displayed on the target page, the corresponding data positions in the first array 11 and the second array 12 can be filled (indicated by black filling in the figure). Specifically, the 2nd to 8th data positions in the first array 11 are filled, and the 2nd, 3rd, 7th to 11th data positions in the second array 12 are filled.
[0075] That is, such as Figure 3 As shown, the x-axis of the target coordinate system is constructed with the top edge of the target page 10, and the y-axis of the target coordinate system is constructed with the left edge of the target page 10. A first array 11 is constructed based on the x-axis, and a second array 12 is constructed based on the y-axis.
[0076] It can be understood that after constructing a target coordinate system based on two adjacent edges of the target page, a first array is constructed based on the first edge of the target page, that is, based on the horizontal axis of the target coordinate system; and a second array is constructed based on the second edge of the target page, that is, based on the vertical axis of the target coordinate system.
[0077] It should be noted that when constructing the first and second arrays, it is necessary to obtain the basic parameters of the target page in advance (such as the size information and pixel information of the target page), determine the number of pixels corresponding to the first side and the second side of the target page, so that when constructing the first and second arrays, the data position in the first array can be determined according to the horizontal coordinate of the pixels included in the first side of the target page, and the data position in the second array can be determined according to the horizontal coordinate of the pixels included in the second side of the target page.
[0078] That is, a pixel and a horizontal coordinate point on the first side correspond to a data position in the first array, and a pixel and a vertical coordinate point on the second side correspond to a data position in the second array.
[0079] For example, in combination Figure 3 As shown, the first content 13 corresponds to the second to fourth data positions in the first array 11, and also corresponds to the second and third data positions in the second array 12. Therefore, when the first content 13 is detected, the second to fourth data positions in the first array 11 and the second and third data positions in the second array 12 are filled with the target identifier. The second content 14 corresponds to the sixth and seventh data positions in the first array 11, and also corresponds to the second and third data positions in the second array 12. Therefore, when the first content 13 is detected, the target identifier is used to fill the second to fourth data positions in the first array 11 and the second and third data positions in the second array 12. When the second content 14 is detected, the second and third data positions in the first array 11 and the second and third data positions in the second array 12 are filled with the target identifier; the third content 15 corresponds to the third to eighth data positions in the first array 11 and the seventh to eleventh data positions in the second array 12, so that when the third content 15 is detected, the third and eighth data positions in the first array 11 and the seventh and eleventh data positions in the second array 12 are filled with the target identifier.
[0080] S202. When it is detected that target content is displayed on the target page, the data positions corresponding to the pixels where the target content is located are filled in the first array and the second array by the target identifier.
[0081] It should be noted that the above-mentioned filling of the data position corresponding to the pixel where the target content is located in the first array and the second array with the target identifier can be understood as: filling the data position corresponding to the horizontal coordinate and the vertical coordinate of the pixel where the target content is located in the first array and the second array with the target identifier.
[0082] Optionally, the relevant data information corresponding to the target page mentioned above is obtained by the electronic device from the server. When the electronic device receives the relevant data information corresponding to the target page returned by the server, the electronic device can load the target page based on the received data information.
[0083] Optionally, when the electronic device starts loading the target page, the electronic device can detect the rendering status of the target page in real time, that is, detect the target content displayed on the target page, and when the target content is detected to be displayed on the target page, fill the target identifier in the corresponding data position in the constructed first array and second array.
[0084] S203. If the proportion of the target identifiers included in the first array and the second array is greater than or equal to the preset proportion, the target page rendering is determined to be complete.
[0085] Optionally, after filling the data positions corresponding to the pixels where the target content is located (i.e., the horizontal and vertical coordinates of the pixels) in the first and second arrays with the target identifiers, it is also necessary to determine the proportion of the target identifiers included in the first and second arrays in a timely manner, so as to determine whether the proportion of the target identifiers included in the first and second arrays is greater than or equal to the preset proportion.
[0086] Furthermore, if the proportion of target identifiers included in the first and second arrays is greater than or equal to the preset proportion, it can be determined that the target page rendering is complete, that is, that all the target content to be displayed on the target page has been displayed and the user can browse the target page normally.
[0087] It's important to note that for a typical webpage (such as an app page), it's necessary to define whether the page has truly finished rendering, i.e., whether it's filled with valid views. Here, valid views (i.e., the target content) can be defined as videos, images, text, buttons, controls, selection areas (cells), etc. In other words, valid views are those that can convey display information to the user or generate interaction.
[0088] It's understandable that "page rendering complete" (i.e., page filling) doesn't mean the page is completely full. Rather, it means the effective views fill a certain preset percentage. This is because, according to normal visual design and user experience, it's unnecessary for every pixel of the entire screen (page) to be filled with effective views (i.e., information or interactive capabilities). When the percentage exceeds this preset ratio, the target page is essentially filled with effective views, giving the user the visual effect that the page is full and loaded. This preset ratio can be set differently depending on the business (the displayed page). For example, it can be 60%, 90%, or other values, without limitation.
[0089] The technical solution provided by the above embodiments brings at least the following beneficial effects: During the loading of the target page, a first array can be constructed based on the first side of the target page to be loaded, and a second array can be constructed based on the second side of the target page. During the construction of the first and second arrays, the data length in the first array matches the number of pixels corresponding to the first side, and the data position in the first array corresponds to the pixels included in the first side of the target page; similarly, the data length in the second array matches the number of pixels corresponding to the second side, and the data position in the second array corresponds to the pixels included in the second side of the target page. Through this implementation, when target content is detected on the target page, the data positions corresponding to the pixels where the target content is located in the constructed first and second arrays can be filled with target identifiers. If the proportion of the target identifiers included in the first and second arrays is greater than or equal to a preset proportion, it can be determined that the target page rendering is complete. Instead of relying on the returned data from network requests, the time point when the network request returns data is determined as the time point when page rendering is completed. This avoids a significant difference between the determined time point and the actual time point when page rendering is completed. By constructing two one-dimensional arrays to indicate the page rendering status, the computational load on electronic devices can be reduced, performance consumption is lower, and the accuracy of determining the time point when page rendering is completed can be improved, thus accurately determining the page loading speed.
[0090] In a feasible manner, combining Figure 2 ,like Figure 4 As shown, the method in S202 above may specifically include S301-S302.
[0091] S301. During the loading process of the target page, the target content displayed on the target page is checked once every preset number of frame refreshes; or, the target content displayed on the target page is checked once every preset time interval.
[0092] Optionally, when the electronic device starts loading the target page, the target content displayed on the target page can be detected once every preset number of frame refreshes (the preset number of times is small, such as 3 or 5 times). That is, the target content displayed on the target page needs to be detected multiple times during the loading process.
[0093] It's understandable that during the page loading process, electronic devices need to refresh the page multiple times (i.e., display multiple frames sequentially) depending on the screen's refresh rate, in order to display the corresponding content on the target page. It's also understandable that during the page loading process, each frame refresh adds content to the target page.
[0094] For example, if the refresh rate of an electronic device screen is 60 Hz, the screen can refresh 60 times per second, meaning 60 frames of images are displayed per second. Therefore, during the loading of the target page, when the target page's corresponding frame image is displayed for the third time, the target content displayed on the target page needs to be detected; when the target page's corresponding frame image is displayed for the sixth time, the target content displayed on the target page needs to be detected; and so on, for the ninth, twelfth, and so on, until it is determined that the target page rendering is complete, at which point the detection of the target content displayed on the target page can be stopped.
[0095] Optionally, when the electronic device begins loading the target page, the target content displayed on the target page can be detected once every preset time interval (the preset time interval is relatively short, such as 5 milliseconds or 10 milliseconds, etc.). That is, every preset time interval, the frame image corresponding to the target page currently displayed on the screen is detected until it is determined that the target page has been rendered, and then the detection of the target content displayed on the target page is stopped.
[0096] Specifically, the system detects the target content displayed on the target page once every preset number of frame refreshes or every preset time period, enabling timely and real-time detection of whether a certain pixel position is filled with target content.
[0097] S302. When it is detected that the position of the target pixel in the target page is filled with target content, the data positions corresponding to the coordinates of the target pixel in the first array and the second array are filled with the target identifier.
[0098] The target content includes at least one of the following: image, video, text, control, or placeholder.
[0099] Optionally, each time the target content displayed on the target page is detected, the electronic device can acquire the frame image corresponding to the target page displayed on the screen, and then perform image recognition processing on the frame image to identify the target content included in the frame image and the display position of the target content in the frame image.
[0100] Optionally, after the electronic device determines the target content included in the target page and the corresponding display position of the target content in the frame image, it promptly fills the corresponding data positions in the first array and the second array with the target identifier.
[0101] It should be noted that the placeholder box mentioned above can select a certain area on the target page. Images, videos, text, controls, etc. can be displayed in the placeholder box. When the target page includes a placeholder box, regardless of whether images, videos, text, controls, etc. are displayed in the placeholder box, the area selected by the placeholder box can be considered to include valid content.
[0102] Optionally, in electronic devices (taking iOS as an example), the specific representation of the target content (i.e., the effective view) can be as follows: UI Text View represents text, such as long scrolling text, which can be edited; UI Label can also represent text, such as short sentences, which cannot be edited; UI Text Field represents an input box; UI Button represents buttons, controls, etc.; UI Image View represents an image; UI Table View Cell and UI Collection ViewCell can both represent placeholder boxes.
[0103] Among them, UI Table View Cell and UI Collection View Cell represent placeholder boxes that are generated to fill the page before the electronic device receives network data returned by the server. In this case, the rendering is actually not complete. This specific case can be considered separately, and flags can be used to indicate that the current placeholder box is not filled with real data, but is just a placeholder.
[0104] It should be noted that these two types of placeholder frames are included as valid views to reduce the performance consumption of electronic devices during the calculation process. Specifically, the time consumed for page rendering is shown in Table 1 below, with and without these two types of placeholder frames:
[0105] Table 1
[0106]
[0107] Therefore, using placeholder boxes as valid views can effectively reduce the time spent on detection. If there are special needs, valid views can be defined according to specific business scenarios using a general protocol. Then, during the actual calculation, the specific category of valid views will be obtained from the current business scenario.
[0108] For example, in combination Figure 3As shown, after the electronic device fills the second to eighth data positions in the first array 11 and the second, third, seventh to eleventh data positions in the second array 12, it can be determined that the proportion of the target identifiers included in the first array is 7 / 9 and the proportion of the target identifiers included in the second array is 7 / 12. Assuming that the preset proportion is 1 / 2, it can be determined that the target page rendering is complete.
[0109] The technical solution provided by the above embodiments brings at least the following beneficial effects: During the loading process of the target page, the target content displayed on the target page can be detected once every preset number of frame refreshes; or, the target content displayed on the target page can be detected once every preset time interval. Thus, when the position of the target pixel in the target page is detected to be filled with target content, the data positions corresponding to the coordinates of the target pixel in the first and second arrays are filled with target identifiers. Through this implementation, the target content displayed on the target page can be detected in real time by refreshing frames at preset intervals or at preset time intervals, and the target identifiers filled in the first and second arrays can accurately determine whether the position of the corresponding pixel in the target page is filled with target content, thereby enabling real-time and accurate determination of the rendering completion status of the target page.
[0110] In a feasible manner, combining Figure 4 ,like Figure 5 As shown, the method in S301 above, which "detects the target content displayed on the target page once every preset number of frame refreshes during the loading process of the target page", can specifically include S3011.
[0111] S3011. During the loading process of the target page, when the target page is refreshed by a preset number of frames, and the time consumed by the preset number of frame refreshes is greater than or equal to the first preset time and less than or equal to the second preset time, the target content displayed on the target page is detected.
[0112] The first preset duration is shorter than the second preset duration.
[0113] Optionally, the triggering time for detecting the target content displayed on the target page can be based on frame refresh. The UI of the target page will only change after each frame refresh. Furthermore, considering the performance of electronic devices, it is not necessary to scan for each frame refresh. Instead, the target page can be detected once after a preset number of frame refreshes.
[0114] Furthermore, considering the high refresh rate of electronic devices and the frame loss that occurs during extensive UI rendering, an upper limit (i.e., the second preset duration) and a lower limit (i.e., the first preset duration) for the detection time interval can be set. This allows for further determination of whether the time consumed by the preset number of frame refreshes is greater than or equal to the first preset duration and less than or equal to the second preset duration, provided that the time consumed by the preset number of frame refreshes is greater than or equal to the first preset duration and less than or equal to the second preset duration. Only if the time consumed by the preset number of frame refreshes is greater than or equal to the first preset duration and less than or equal to the second preset duration will the target content displayed on the target page be detected; otherwise, the target content displayed on the target page will not be detected.
[0115] Optionally, the method in S3011 above can be replaced by S3012 or S3013.
[0116] S3012. During the loading process of the target page, when the target page has undergone a preset number of frame refreshes and the time consumed by the preset number of frame refreshes is less than the first preset time, the target page continues to perform a first target number of frame refreshes. When the total time consumed by the preset number of frame refreshes and the first target number of frame refreshes is greater than or equal to the first preset time, the target content displayed on the target page is detected.
[0117] It is understandable that, during the process of refreshing the target page a preset number of times and further determining the relationship between the time consumed by the preset number of frame refreshes and the first preset time and the second preset time, if it is determined that the time difference between the current moment and the last detection is less than the lower limit of the time interval (i.e. the first preset time), then no detection will be performed.
[0118] Furthermore, during the continued frame refresh of the target page, when it is determined that the first target number of frame refreshes has elapsed again, and the time difference between the current moment and the last detection moment (i.e., the total time consumed by the preset number of frame refreshes and the first target number of frame refreshes) is greater than or equal to the first preset time, the target content displayed on the target page is then detected. This ensures that the time interval for detecting the target content displayed on the target page is not too short, thus saving the processing resources required for detection.
[0119] S3013. During the loading process of the target page, when the target page has undergone a second target number of frame refreshes, and the duration consumed by the second target number of frame refreshes is greater than the second preset duration and the second target number is less than the preset number, the target content displayed on the target page is detected.
[0120] It's understandable that during the frame refresh process of the target page, it's necessary to determine the time difference between the current moment and the last detection moment in real time. If the time difference is determined to be greater than the upper limit of the time interval (i.e., the second preset duration), then regardless of whether the number of frame refreshes the target page has undergone at the current moment has reached the preset number, the target content displayed on the target page will be detected. In this way, when the detection interval is determined to be greater than the upper limit, even if the number of frame refreshes of the target page has not reached the preset number, detection will still be performed immediately to avoid the time interval for detecting the target content displayed on the target page being too long, thus preventing the target content from being detected in a timely manner.
[0121] The technical solution provided by the above embodiments brings at least the following beneficial effects: During the loading process of the target page, the timing for detecting the target content displayed on the target page can be accurately determined by combining the number of frame refreshes of the target page and the relationship between the time consumed by the number of frame refreshes and the first preset time and the second preset time. This implementation provides an accurate way to determine the timing for detecting the target content displayed on the target page. By judging the number of frame refreshes of the target page and the time consumed by the number of frame refreshes, the timing for detecting the target content displayed on the target page can be accurately determined, thereby enabling timely detection of the target content displayed on the target page, improving the efficiency of detecting the target content displayed on the target page, and simultaneously saving the processing resources required for detection.
[0122] In a feasible manner, combining Figure 2 ,like Figure 6 As shown, the method in S202 above may specifically include S401-S402.
[0123] S401. Recursively traverse the multiple subviews starting from the root view corresponding to the target page to detect the target content.
[0124] It is understandable that the target page includes a root view and multiple subviews. In the process of detecting the target content displayed on the target page, we can recursively traverse the multiple subviews starting from the root view corresponding to the target page to gradually determine the target content included in each view, so as to avoid missing a view and causing inaccurate detection of the target content.
[0125] For example, taking the iOS system as an example, starting from the root view of the page container, i.e. the view of the view controller, the subviews are recursively traversed. When a valid view is encountered, the area where the valid view is located is filled with the data positions in the first and second arrays. After each traversal, the proportion of the data positions filled with the target identifier in the first and second arrays is calculated. When the proportion reaches the threshold ratio, the target page is considered to be rendered.
[0126] S402. When the view detects that the target content is present, the data positions corresponding to the pixels where the target content is located are filled in the first array and the second array by the target identifier.
[0127] For example, the specific process of recursively traversing multiple subviews starting from the root view corresponding to the target page and detecting whether the view contains the target content is as follows:
[0128]
[0129]
[0130] The technical solution provided by the above embodiments brings at least the following beneficial effects: it can recursively traverse multiple subviews starting from the root view corresponding to the target page; and when the target content is detected in the view, the data positions corresponding to the pixels where the target content is located in the first and second arrays are filled by the target identifier. This implementation provides a specific detection method for detecting target content displayed on a target page. By recursively traversing multiple subviews starting from the root view and gradually detecting the target content included in the view, it avoids missing any target content displayed on the target page, improves the accuracy of detecting target content displayed on the target page, and prevents target content from being missed and not detected in time.
[0131] In a feasible manner, combining Figure 2 ,like Figure 7 As shown, the method in S203 above may specifically include S501-S502.
[0132] S501. Determine the first proportion of target identifiers included in the first array, and determine the second proportion of target identifiers included in the second array.
[0133] S502. If at least one of the first proportion and the second proportion is greater than or equal to the preset proportion, the rendering of the target page is determined to be complete.
[0134] Optionally, after filling the data positions corresponding to the pixels where the target content is located in the first array and the second array with the target identifier, a first proportion of the target identifier included in the first array (e.g., 7 / 9 in the example above) can be determined, and a second proportion of the target identifier included in the second array (e.g., 7 / 12 in the example above) can be determined.
[0135] Furthermore, the size relationship between the first proportion and the second proportion and the preset proportion (e.g., 1 / 2) is determined. If at least one of the first proportion and the second proportion is greater than or equal to the preset proportion, it can be determined that the target page rendering is complete.
[0136] Optionally, after filling the data positions corresponding to the pixels where the target content is located in the first and second arrays with the target identifiers, the total proportion of the target identifiers included in the first and second arrays (i.e., 14 / 21) can be determined, and the size relationship between the total proportion and the preset proportion can be determined. If the total proportion is greater than or equal to the preset proportion, the target page rendering can be determined to be complete.
[0137] It can be understood that determining the total proportion of target identifiers included in the first array and the second array is to determine the ratio between the total number of target identifiers included in the first array and the second array and the total number of data locations included in the first array and the second array.
[0138] The technical solution provided by the above embodiments brings at least the following beneficial effects: a first proportion of the target identifiers included in the first array and a second proportion of the target identifiers included in the second array can be determined respectively; thus, if at least one of the first proportion and the second proportion is greater than or equal to a preset proportion, the rendering of the target page is determined to be complete. This implementation provides multiple methods for determining the completion of target page rendering, improving the diversity of determination methods.
[0139] In one feasible embodiment, the above method may further include S205.
[0140] S205. If, after a third preset time period, the proportion of the target identifier is determined to be less than the preset proportion, the detection of the target content displayed on the target page ends, and the rendering of the target page is determined to be complete.
[0141] Optionally, when the target page contains relatively little target content, during the detection of the target content displayed on the target page, if it cannot be determined that the target page has finished rendering regardless of the number of detections (i.e., the first proportion of the target identifiers in the first array and the second proportion of the target identifiers in the second array are both less than a preset proportion), the detection of the target content displayed on the target page can be stopped when the total detection time (i.e., the total time corresponding to multiple detections performed after the target page starts loading) reaches a third preset time, thus determining that the target page has finished rendering. The third preset time is relatively long compared to the first and second preset times, for example, it can be 5 seconds or 6 seconds.
[0142] It's understandable that in certain business scenarios, such as when the amount of effective content to be displayed is limited, the page may not fill completely even after full rendering. In such cases, a fallback solution can be implemented based on user interaction (page starts loading) and the main thread's idle state exceeding a third preset duration (e.g., 3 seconds). If these conditions are met, relevant performance data is not collected (no further monitoring is performed), as this type of business scenario occurs infrequently and consumes less performance on electronic devices than in a normal page-filling scenario, thus requiring less prolonged monitoring. Normal data collection is sufficient only in scenarios where the page normally fills, thus meeting the requirement for accurate page loading response time assessment.
[0143] For example, such as Figure 8 As shown, page 20 only includes input box 21 and text 22. During the loading of page 20, after the above detection steps, the detection result is: the proportion of target identifiers included in the first array and the second array is less than the preset proportion. Then, when the total detection time reaches the third preset time, it is determined that the page rendering is complete.
[0144] As a further example, when the target content included on the target page is displayed in a special display position, such as... Figure 9 As shown, the coverage of the effective view cannot be accurately reflected. In this case, the detection result is that the proportion of target identifiers included in the first and second arrays is 1. Therefore, it is impossible to accurately determine whether the page has finished rendering by judging the proportion of target identifiers included in the first and second arrays. In this case, a two-dimensional array can be used to accurately determine whether the page has finished rendering. However, since such extreme page conditions rarely occur under normal business conditions, for the sake of electronic device performance, it is not advisable to use a two-dimensional array to determine whether the page has finished rendering. This is because the computational load of determining the target content included in the page using a two-dimensional array w*h is too large, and the time spent on traversal and calculation will increase exponentially. Here, w represents the number of pixels corresponding to the first side, and h represents the number of pixels corresponding to the second side.
[0145] The technical solution provided by the above embodiments brings at least the following beneficial effects: when the proportion of the target identifier is determined to be less than a preset proportion for a long period of time, the detection of the target content displayed on the target page can be terminated, and the rendering of the target page can be determined to be complete. This implementation method provides a specific way to determine the completion of target page rendering in a special case, namely when the proportion of the target identifier is determined to be less than a preset proportion for a long period of time, further improving the accuracy of determining the completion of target page rendering.
[0146] In a feasible manner, combining Figure 2 ,likeFigure 10 As shown, the above method may further include S601-S602.
[0147] S601. If target content is detected to be displayed on the target page, the target display area corresponding to the target content displayed on the target page is detected.
[0148] Optionally, the target display area corresponding to the target content displayed on the target page can be detected in the form of a two-dimensional array to determine whether the page has been rendered successfully.
[0149] S602. Determine the third percentage of the target display area relative to the total area of the target page, and if the third percentage is greater than or equal to the preset percentage, determine that the target page rendering is complete.
[0150] Optionally, by calculating the coverage corresponding to the target content, the proportion of the area of the effective view to the total area of the page can be accurately calculated. Specifically, the ratio of the number of pixels corresponding to the target content to the total number of pixels included in the target page can be calculated to determine the third proportion of the target display area to the total area of the target page.
[0151] It's important to note that the area of overlapping valid views can only be counted as one valid view. Furthermore, the two-dimensional array differs from the combination of the first and second arrays mentioned above. The two-dimensional array contains the number of pixels in the target page, i.e., w*h. The sum of the data in the first and second arrays is w+h. From the perspective of electronic devices, using a two-dimensional array to mark the area corresponding to the target content results in a much larger amount of data than the combination of the first and second arrays. It also involves UI coordinate system transformation. Compared to using a two-dimensional array, the method of marking using the first and second arrays mentioned above involves less data during the monitoring process and does not involve coordinate system transformation.
[0152] The technical solution provided by the above embodiments brings at least the following beneficial effects: It can also detect the target display area corresponding to the target content displayed on the target page and determine the proportion of the target display area to the total area of the target page. Therefore, if the proportion of the target display area to the total area of the target page is greater than or equal to a preset proportion, it can be determined that the target page rendering is complete. This implementation provides a method to determine whether the target page rendering is complete by judging the proportion of the target display area to the total area of the target page. Using a two-dimensional array to judge the rendering status of the target page can more accurately determine whether the target page rendering is complete.
[0153] In a feasible manner, combining Figure 2 ,like Figure 11As shown, S701-S702 may also be included after the method in S203 above.
[0154] S701. Determine the first time point corresponding to the completion of the target page rendering.
[0155] S702. Determine the loading speed of the target page based on the first and second time nodes.
[0156] The second time point is the time point corresponding to when the request to load the target page is sent, and the loading speed is used to reflect the time taken to load the target page.
[0157] Optionally, when loading the target page begins, a second time point corresponding to the time when the request to load the target page is sent can be recorded, and when the target page rendering is completed, the first time point corresponding to the time when the target page rendering is completed can be obtained.
[0158] Therefore, after the target page is rendered, the loading time of the target page can be determined based on the first and second time nodes to obtain the loading speed of the target page.
[0159] The technical solution provided by the above embodiments brings at least the following beneficial effects: When it is determined that the target page rendering is complete, a first time node corresponding to the completion of target page rendering can be further determined, and combined with a second time node corresponding to the sending of the request to load the target page, the loading speed of the target page can be determined, thereby reflecting the time spent loading the target page through the loading speed. Through this implementation method, the loading speed of the target page can be determined more accurately through the time node corresponding to the completion of target page rendering, improving the accuracy of determining the loading speed of the target page.
[0160] As illustrated in the examples above, this disclosure, when a target page is opened on an electronic device, does not require using the display node of the page container as the page rendering completion node. Instead, it obtains the rendering completion node of the page after the network request data has been filled in; this node represents the time point that aligns with the user's visible state. This method allows for a more accurate calculation of when the page coverage reaches a specified threshold, marking it as the page rendering completion state, with lower resource consumption, thus obtaining a more precise page rendering completion node. By aligning the end node of page loading to the time when the content the user is actually expected to see finishes rendering, the page loading statistics match the user's experience. This method provides a calculation method and data basis for whether the page has truly finished rendering. The definition and calculation method for page rendering completion are not only applicable to mobile devices but can be applied to most conventional graphical interfaces. This achieves precise quantification of page rendering completion with lower performance consumption; by aligning the timing of page rendering completion to the time point when the content intended to be displayed to the user has finished rendering, the obtained data on the entire page loading time becomes more valuable.
[0161] It is understood that the above method can be implemented by a device for determining page rendering completion. To achieve the above functions, the device for determining page rendering completion includes hardware structures and / or software modules corresponding to the execution of each function. Those skilled in the art should readily recognize that, based on the modules and algorithm steps of the various examples described in conjunction with the embodiments disclosed herein, the embodiments of this disclosure can be implemented in hardware or a combination of hardware and computer software. Whether a function is executed in hardware or by computer software driving hardware depends on the specific application and design constraints of the technical solution. Those skilled in the art can use different methods to implement the described functions for each specific application, but such implementation should not be considered beyond the scope of the embodiments of this disclosure.
[0162] This disclosure embodiment can divide the aforementioned device for determining page rendering completion into functional modules based on the above method example. For example, each function can be divided into its own functional module, or two or more functions can be integrated into one processing module. The integrated module can be implemented in hardware or as a software functional module. It should be noted that the module division in this disclosure embodiment is illustrative and only represents one logical functional division; in actual implementation, there may be other division methods.
[0163] Figure 12 This is a schematic diagram illustrating the structure of a device for determining the completion of page rendering according to an exemplary embodiment. (Refer to...) Figure 10 The device 100 for determining that page rendering is complete may include: a building unit 1001, a filling unit 1002, a determining unit 1003, and a detection unit 1004.
[0164] Construction unit 1001 is configured to construct a first array based on the first side of the target page to be loaded. The length of the data in the first array matches the number of pixels corresponding to the first side, and the position of the data in the first array corresponds to the pixels included in the first side of the target page. For example, construction unit 1001 can be used to execute... Figure 2 Step 201 in the process.
[0165] Construction unit 1001 is configured to construct a second array based on the second side of the target page. The length of the data in the second array matches the number of pixels corresponding to the second side, and the positions of the data in the second array correspond to the pixels included in the second side of the target page. The second side is adjacent to the first side. For example, construction unit 1001 can be used to perform... Figure 2 Step 201 in the process.
[0166] The filling unit 1002 is configured to, upon detecting that target content is displayed on the target page, fill the data positions corresponding to the pixels where the target content is located in the first and second arrays using the target identifier; for example, the filling unit 1002 can be used to perform... Figure 2 Step 202 in the process.
[0167] Determining unit 1003 is configured to determine that the target page rendering is complete when the proportion of target identifiers included in the first array and the second array is greater than or equal to a preset proportion. For example, determining unit 1003 can be used to perform... Figure 2 Step 203 in the process.
[0168] Optionally, the detection unit 1004 is configured to detect the target content displayed on the target page once every preset number of frame refreshes during the loading process of the target page; or, to detect the target content displayed on the target page once every preset time interval; for example, the detection unit 1004 can be used to perform... Figure 4 The steps in step 301.
[0169] The filling unit 1002 is configured to, when it is detected that the position of a target pixel in the target page is filled with target content, fill the data positions corresponding to the coordinates of the target pixel in the first array and the second array with target identifiers; the target content includes at least one of the following: image, video, text, control, placeholder. For example, the filling unit 1002 can be used to perform... Figure 4 Step 302 in the process.
[0170] Optionally, the detection unit 1004 is configured to, during the loading process of the target page, detect the target content displayed on the target page when the target page has undergone a preset number of frame refreshes, and the duration consumed by the preset number of frame refreshes is greater than or equal to a first preset duration and less than or equal to a second preset duration, wherein the first preset duration is less than the second preset duration; for example, the detection unit 1004 can be used to perform Figure 5 Step 3011 in the process.
[0171] The detection unit 1004 is configured to perform the following actions during the loading process of the target page: when the target page has undergone a preset number of frame refreshes and the time consumed by the preset number of frame refreshes is less than a first preset time, the target page continues to perform a first target number of frame refreshes; when the total time consumed by the preset number of frame refreshes and the first target number of frame refreshes is greater than or equal to the first preset time, the target content displayed on the target page is detected.
[0172] The detection unit 1004 is configured to perform the following operation during the loading process of the target page: when the target page has undergone a second target number of frame refreshes, and the duration consumed by the second target number of frame refreshes is greater than a second preset duration and the second target number of refreshes is less than a preset number of refreshes, the detection unit 1004 detects the target content displayed on the target page.
[0173] Optionally, the detection unit 1004 is configured to recursively traverse multiple subviews starting from the root view corresponding to the target page; for example, the detection unit 1004 can be used to perform... Figure 6 The steps in step 401.
[0174] The fill unit 1002 is configured to, when a target content is detected in the view, fill the data positions corresponding to the pixels where the target content is located in the first and second arrays using the target identifier. For example, the fill unit 1002 can be used to perform... Figure 6 Step 402 in the process.
[0175] Optionally, the determining unit 1003 is configured to determine a first proportion of target identifiers included in the first array and a second proportion of target identifiers included in the second array; for example, the determining unit 1003 may be used to perform... Figure 7 The steps in step 501.
[0176] The determining unit 1003 is configured to determine that the target page rendering is complete if at least one of the first and second proportions is greater than or equal to a preset proportion. For example, the determining unit 1003 can be used to perform... Figure 7 The steps in step 502.
[0177] Optionally, the determining unit 1003 is configured to terminate the detection of the target content displayed on the target page and determine that the target page rendering is complete if the proportion of the target identifier is less than a preset proportion after a third preset time.
[0178] Optionally, the detection unit 1004 is configured to detect the target display area corresponding to the target content displayed on the target page; for example, the determination unit 1003 can be used to perform... Figure 10 The steps in step 601.
[0179] The determining unit 1003 is configured to determine a third percentage of the target display area relative to the total area of the target page, and if the third percentage is greater than or equal to a preset percentage, determine that the target page rendering is complete. For example, the determining unit 1003 can be used to perform... Figure 10 Step 602 in the process.
[0180] Optionally, the determining unit 1003 is configured to determine the first time node corresponding to the completion of rendering of the target page; for example, the determining unit 1003 can be used to execute Figure 11 The steps in step 701.
[0181] The determining unit 1003 is configured to determine the loading speed of the target page based on a first time node and a second time node; the second time node is the time node corresponding to when the request to load the target page is sent, and the loading speed is used to reflect the time taken to load the target page. For example, the determining unit 1003 can be used to execute... Figure 11 Step 702 in the process.
[0182] As described above, the embodiments of this disclosure can divide the electronic device into functional modules according to the above method examples. The integrated modules can be implemented in hardware or as software functional modules. Furthermore, it should be noted that the module division in these embodiments is illustrative and represents only one logical functional division; in actual implementation, other division methods may be used. For example, each function can be divided into its own functional modules, or two or more functions can be integrated into a single processing module.
[0183] Regarding the apparatus for determining the completion of page rendering in the above embodiments, the specific methods by which each module performs its operations have been described in detail in the embodiments related to the method, and will not be elaborated upon here.
[0184] Figure 13 This is a schematic diagram of a device 60 for determining the completion of page rendering, as provided in this disclosure. Figure 13The apparatus 60 for determining page rendering completion may include at least one processor 601 and a memory 603 for storing executable instructions of the processor 601. The processor 601 is configured to execute the instructions in the memory 603 to implement the method for determining page rendering completion in the above embodiments.
[0185] In addition, the device 60 for determining that page rendering is complete may also include a communication bus 602 and at least one communication interface 604.
[0186] The processor 601 may be a GPU, a microprocessor unit, an ASIC, or one or more integrated circuits for controlling the execution of programs according to the present disclosure.
[0187] The communication bus 602 may include a path for transmitting information between the aforementioned components.
[0188] Communication interface 604 uses any transceiver-like device for communicating with other devices or communication networks, such as Ethernet, radio access network (RAN), wireless local area networks (WLAN), etc.
[0189] Memory 603 may be read-only memory (ROM) or other types of static storage devices capable of storing static information and instructions, random access memory (RAM) or other types of dynamic storage devices capable of storing information and instructions, or electrically erasable programmable read-only memory (EEPROM), compact disc read-only memory (CD-ROM) or other optical disc storage, optical disc storage (including compressed optical discs, laser discs, optical discs, digital universal optical discs, Blu-ray discs, etc.), magnetic disk storage media or other magnetic storage devices, or any other medium capable of carrying or storing desired program code in the form of instructions or data structures and accessible by a computer, but not limited thereto. Memory may exist independently and be connected to the processing unit via a bus. Memory may also be integrated with the processing unit as a volatile storage medium within the GPU.
[0190] The memory 603 stores instructions for executing the present invention, and the processor 601 controls the execution of these instructions. The processor 601 executes the instructions stored in the memory 603 to implement the functions of the method disclosed herein.
[0191] In a specific implementation, as one example, the processor 601 may include one or more GPUs, for example... Figure 13 GPU0 and GPU1 in the dataset.
[0192] In a specific implementation, as one example, the device 60 for determining the completion of page rendering may include multiple processors, such as... Figure 13 Processors 601 and 607 are described herein. Each of these processors may be a single-core (CPU) processor or a multi-core (GPU) processor. A processor here may refer to one or more devices, circuits, and / or processing cores used to process data (e.g., computer program instructions).
[0193] In a specific implementation, as one embodiment, the device 60 for determining page rendering completion may further include an output device 605 and an input device 606. The output device 605 communicates with the processor 601 and can display information in various ways. For example, the output device 605 may be a liquid crystal display (LCD), a light-emitting diode (LED) display device, a cathode ray tube (CRT) display device, or a projector, etc. The input device 606 communicates with the processor 601 and can accept user input in various ways. For example, the input device 606 may be a mouse, keyboard, touchscreen device, or sensing device, etc.
[0194] Those skilled in the art will understand that Figure 13 The structure shown does not constitute a limitation on the device 60 for determining the completion of page rendering, and may include more or fewer components than shown, or combine certain components, or use different component arrangements.
[0195] This disclosure also provides a computer-readable storage medium storing instructions that, when executed by a processor of an electronic device, enable the electronic device to perform the method for determining page rendering completion provided in the embodiments of this disclosure described above.
[0196] This disclosure also provides a computer program product containing instructions that, when run on an electronic device, cause the electronic device to execute the method for determining page rendering completion provided in the above-described embodiments of this disclosure.
[0197] This disclosure also provides a communication system, such as... Figure 1As shown, the system includes a server 11 and a client 12. The server 11 and client 12 are respectively used to execute the corresponding steps in the above embodiments of this disclosure, thereby enabling the communication system to solve the technical problems solved by the embodiments of this disclosure and achieve the technical effects achieved by the embodiments of this disclosure, which will not be elaborated further here.
[0198] Other embodiments of this disclosure will readily occur to those skilled in the art upon consideration of the specification and practice of the invention disclosed herein. This disclosure is intended to cover any variations, uses, or adaptations of this disclosure that follow the general principles of this disclosure and include common knowledge or customary techniques in the art not disclosed herein. The specification and examples are to be considered exemplary only, and the true scope and spirit of this disclosure are indicated by the following claims.
[0199] It should be understood that this disclosure is not limited to the precise structures described above and shown in the accompanying drawings, and various modifications and changes can be made without departing from its scope. The scope of this disclosure is limited only by the appended claims.
Claims
1. A method for determining when page rendering is complete, characterized in that, The method includes: A first array is constructed based on the first side of the target page to be loaded. The length of the data in the first array matches the number of pixels corresponding to the first side, and the position of the data in the first array corresponds to the pixels included in the first side of the target page. A second array is constructed based on the second side of the target page. The length of the data in the second array matches the number of pixels corresponding to the second side. The position of the data in the second array corresponds to the pixels included in the second side of the target page. The second side is adjacent to the first side. When target content is detected to be displayed on the target page, the data positions corresponding to the pixels where the target content is located in the first array and the second array are filled with the target identifier; If the proportion of the target identifiers included in the first array and the second array is greater than or equal to a preset proportion, the rendering of the target page is determined to be complete.
2. The method according to claim 1, characterized in that, When target content is detected to be displayed on the target page, the step of filling the data positions corresponding to the pixels where the target content is located in the first array and the second array with the target identifier includes: During the loading process of the target page, the target content displayed on the target page is detected once every preset number of frame refreshes; or, the target content displayed on the target page is detected once every preset time interval. When it is detected that the position of the target pixel in the target page is filled with the target content, the data positions in the first array and the second array corresponding to the coordinates of the target pixel are filled with the target identifier; the target content includes at least one of the following: image, video, text, control, placeholder.
3. The method according to claim 2, characterized in that, During the loading process of the target page, the target content displayed on the target page is detected once every preset number of frame refreshes, including: During the loading process of the target page, when the target page is refreshed by the preset number of frames, and the time consumed by the preset number of frame refreshes is greater than or equal to the first preset time and less than or equal to the second preset time, the target content displayed on the target page is detected, and the first preset time is less than the second preset time. The method further includes: During the loading process of the target page, when the target page has undergone the preset number of frame refreshes and the time consumed by the preset number of frame refreshes is less than the first preset time, the target page continues to undergo the first target number of frame refreshes. When the total time consumed by the preset number of frame refreshes and the first target number of frame refreshes is greater than or equal to the first preset time, the target content displayed on the target page is detected. During the loading process of the target page, when the target page is refreshed by a second target number of frames, and the duration consumed by the second target number of frame refreshes is greater than the second preset duration and the second target number is less than the preset number, the target content displayed on the target page is detected.
4. The method according to claim 1, characterized in that, When target content is detected to be displayed on the target page, the step of filling the data positions corresponding to the pixels where the target content is located in the first array and the second array with the target identifier includes: Recursively traverse the multiple subviews starting from the root view corresponding to the target page; When the target content is detected in the view, the data positions corresponding to the pixels where the target content is located are filled in the first array and the second array by the target identifier.
5. The method according to claim 1, characterized in that, The step of determining that the target page rendering is complete when the proportion of the target identifiers included in the first array and the second array is greater than or equal to a preset proportion includes: Determine a first proportion of the target identifiers included in the first array, and determine a second proportion of the target identifiers included in the second array; If at least one of the first percentage and the second percentage is greater than or equal to the preset percentage, the rendering of the target page is determined to be complete.
6. The method according to any one of claims 1-5, characterized in that, The method further includes: If, after a third preset time period, the proportion of the target identifier is determined to be less than the preset proportion, the detection of the target content displayed on the target page ends, and the rendering of the target page is determined to be complete.
7. The method according to any one of claims 1-5, characterized in that, The method further includes: Detect the target display area corresponding to the target content displayed on the target page; Determine the third percentage of the target display area relative to the total area of the target page, and if the third percentage is greater than or equal to the preset percentage, determine that the rendering of the target page is complete.
8. The method according to any one of claims 1-5, characterized in that, After determining that the target page has been rendered, the method further includes: Determine the first time point corresponding to the completion of rendering the target page; The loading speed of the target page is determined based on the first time node and the second time node; the second time node is the time node corresponding to when the request to load the target page is sent, and the loading speed is used to reflect the time taken to load the target page.
9. An apparatus for determining the completion of page rendering, characterized in that, include: The building unit is configured to perform the construction of a first array based on a first side of the target page to be loaded, wherein the length of the data in the first array matches the number of pixels corresponding to the first side, and the position of the data in the first array corresponds to the pixels included in the first side of the target page; The construction unit is configured to construct a second array based on the second side of the target page, wherein the length of the data in the second array matches the number of pixels corresponding to the second side, the position of the data in the second array corresponds to the pixels included in the second side of the target page, and the second side is adjacent to the first side; The filling unit is configured to, when it is detected that target content is displayed on the target page, fill the data positions corresponding to the pixels where the target content is located in the first array and the second array with a target identifier; The determining unit is configured to determine that the target page rendering is complete when the proportion of the target identifiers included in the first array and the second array is greater than or equal to a preset proportion.
10. The apparatus for determining the completion of page rendering according to claim 9, characterized in that, The detection unit is configured to, during the loading process of the target page, detect the target content displayed on the target page once every preset number of frame refreshes; or, detect the target content displayed on the target page once every preset time interval. The filling unit is configured to, when it is detected that the position of the target pixel in the target page is filled with the target content, fill the data position corresponding to the coordinate point of the target pixel in the first array and the second array with the target identifier; the target content includes at least one of the following: image, video, text, control, placeholder.
11. The apparatus for determining the completion of page rendering according to claim 10, characterized in that, The detection unit is configured to, during the loading process of the target page, when the target page has undergone the preset number of frame refreshes, and the time consumed by the preset number of frame refreshes is greater than or equal to a first preset time and less than or equal to a second preset time, detect the target content displayed on the target page, wherein the first preset time is less than the second preset time. The detection unit is configured to perform the following actions during the loading process of the target page: when the target page has undergone the preset number of frame refreshes and the time consumed by the preset number of frame refreshes is less than the first preset time, the target page continues to perform the first target number of frame refreshes; when the total time consumed by the preset number of frame refreshes and the first target number of frame refreshes is greater than or equal to the first preset time, the target content displayed on the target page is detected. The detection unit is configured to, during the loading process of the target page, detect the target content displayed on the target page when the target page has undergone a second target number of frame refreshes, and the duration consumed by the second target number of frame refreshes is greater than the second preset duration and the second target number is less than the preset number.
12. The apparatus for determining the completion of page rendering according to claim 9, characterized in that, The detection unit is configured to perform a recursive traversal of multiple subviews starting from the root view corresponding to the target page; The filling unit is configured to, when the target content is detected in the view, fill the data position corresponding to the pixel where the target content is located in the first array and the second array with the target identifier.
13. The apparatus for determining the completion of page rendering according to claim 9, characterized in that, The determining unit is configured to determine a first proportion of the target identifiers included in the first array and a second proportion of the target identifiers included in the second array; The determining unit is configured to determine that the target page rendering is complete when at least one of the first percentage and the second percentage is greater than or equal to the preset percentage.
14. The apparatus for determining page rendering completion according to any one of claims 9-13, characterized in that, The determining unit is configured to terminate the detection of the target content displayed on the target page and determine that the target page rendering is complete if the proportion of the target identifier is less than the preset proportion after a third preset time period.
15. The apparatus for determining page rendering completion according to any one of claims 9-13, characterized in that, The detection unit is configured to detect the target display area corresponding to the target content displayed on the target page; The determining unit is configured to determine a third percentage of the target display area relative to the total area of the target page, and to determine that the target page rendering is complete if the third percentage is greater than or equal to the preset percentage.
16. The apparatus for determining page rendering completion according to any one of claims 9-13, characterized in that, The determining unit is configured to determine the first time node corresponding to when the target page rendering is completed; The determining unit is configured to determine the loading speed of the target page based on the first time node and the second time node; the second time node is the time node corresponding to when the request to load the target page is sent, and the loading speed is used to reflect the time taken to load the target page.
17. An electronic device, characterized in that, The electronic device includes: processor; Memory used to store the processor's executable instructions; The processor is configured to execute the instructions to implement the method for determining page rendering completion as described in any one of claims 1-8.
18. A computer-readable storage medium, characterized in that, The computer-readable storage medium stores instructions that, when executed by a processor of an electronic device, enable the electronic device to perform the method for determining page rendering completion as described in any one of claims 1-8.
19. A computer program product, characterized in that, The method includes a computer program that, when executed by a processor, implements the method for determining page rendering completion as described in any one of claims 1-8.