Webpage performance evaluation method and device, equipment and storage medium
By automatically obtaining and evaluating new page elements in the web page and calculating the maximum content rendering value of the page, the failure problem of web page performance evaluation in single-page application scenarios is solved, and efficient performance evaluation without manual intervention and no front-end framework dependence is achieved, reducing the Evaluation costs and enhance applicability.
Patent Information
- Application Number
- CN202411145178.5
- Authority / Receiving Office
- CN · China
- Patent Type
- Applications(China)
- Current Assignee / Owner
- Filing Date
- 2024-08-20
- Publication Date
- 2024-12-13
AI Technical Summary
The existing web performance evaluation methods fail in single-page application scenarios, and require manual annotation and the intervention of the front-end development framework, resulting in high evaluation costs and poor applicability.
By obtaining new page elements in the target web page, calculating the maximum content rendering value of the page, using the depth-first search algorithm to calculate element scores, automatically evaluate web page performance, generate performance evaluations, and push optimization reports.
Automatic web performance evaluation in single-page application scenarios is realized, which reduces evaluation costs, enhances applicability, and avoids the dependence of manual annotation and front-end development frameworks.
Smart Images

Figure CN119127640A_ABST
Abstract
Description
Technical Field
[0001] The present application relates to the field of data processing technology, and in particular to a web page performance evaluation method, device, equipment and storage medium. Background Art
[0002] LCP (Largest Contentful Paint) was first proposed by Google as a method for evaluating web page performance. It has now been integrated into browsers and can achieve good results for multi-page front-end applications. However, most front-end web pages currently use SPA (single-page application). The default web page performance evaluation method provided by the browser no longer performs statistics when the route is switched, resulting in the loss of evaluation effect.
[0003] At present, there are some web page performance evaluation methods that evaluate the page by marking key positions on the page. This method can also effectively evaluate the page, but there is a problem of huge workload caused by manual annotation. It does not have strong adaptability, and the implementation method is greatly affected by the team and the front-end development framework. Summary of the invention
[0004] The main purpose of this application is to provide a web page performance evaluation method, device, equipment and storage medium, which are designed to be unaffected by the front-end development framework and do not require manual labeling and intervention, thereby reducing the cost of web page performance evaluation and enhancing the applicability of application scenarios.
[0005] To achieve the above objectives, the present application proposes a web page performance evaluation method, the method comprising:
[0006] Get several newly added page elements in the target web page;
[0007] Based on each of the newly added page elements, calculate the page maximum content rendering value corresponding to the target page;
[0008] Based on the page maximum content rendering value, a web page performance evaluation of the target web page is determined.
[0009] In one embodiment, the step of obtaining a plurality of newly added page elements in the target webpage includes:
[0010] Monitoring whether the target web page has any web page changes;
[0011] If yes, get the callback result generated by the web page change;
[0012] Based on the callback result, a number of newly added page elements in the target webpage are determined.
[0013] In one embodiment, the calculating, based on each of the newly added page elements, the page maximum content rendering value corresponding to the target page includes:
[0014] Determine whether the target webpage has been loaded;
[0015] If yes, the page loading time is obtained, and each of the newly added page elements within the page loading time is calculated according to a preset algorithm to obtain an element score corresponding to each of the newly added page elements;
[0016] Statistical analysis is performed on the element scores corresponding to each of the newly added page elements to determine the page maximum content rendering value corresponding to the target page.
[0017] In one embodiment, the preset algorithm includes a depth-first search algorithm;
[0018] The calculating each of the newly added page elements within the page loading time according to a preset algorithm to obtain an element score corresponding to each of the newly added page elements includes:
[0019] According to the depth-first search algorithm, a depth-first traversal is performed on each of the newly added page elements within the page loading time to determine the amount of information and the current level corresponding to each of the newly added page elements;
[0020] The information volume and the current level are calculated to obtain an element score corresponding to each of the newly added page elements.
[0021] In one embodiment, determining whether the target webpage has been loaded includes:
[0022] Obtaining resources and interface call status corresponding to the target webpage;
[0023] If the resource and interface call status does not change within the preset monitoring time, it is determined that the target webpage is loaded; and / or,
[0024] Detecting whether a user interaction occurs on the target webpage;
[0025] If so, it is determined that the target webpage has been loaded.
[0026] In one embodiment, determining the webpage performance evaluation of the target webpage based on the maximum content rendering value of the page includes:
[0027] Matching the maximum content rendering value of the page with a preset web page performance rating level to determine the web page performance rating level of the target web page;
[0028] Obtaining a grade evaluation corresponding to the webpage performance rating grade;
[0029] The web page performance rating grade is associated and combined with the grade evaluation to generate a web page performance evaluation of the target web page.
[0030] In one embodiment, after determining the webpage performance evaluation of the target webpage based on the page maximum content rendering value, the method further includes:
[0031] If the webpage performance evaluation is a negative evaluation, obtaining the negative performance reason;
[0032] Generate a web page optimization report based on the negative performance reasons;
[0033] The webpage optimization report is pushed to the management personnel for the management personnel to view.
[0034] In addition, to achieve the above purpose, the present application also proposes a web page performance evaluation device, the web page performance evaluation device comprising:
[0035] An acquisition module, used to acquire several newly added page elements in a target web page;
[0036] A calculation module, used for calculating the page maximum content rendering value corresponding to the target page based on each of the newly added page elements;
[0037] The determination module is used to determine the web page performance evaluation of the target web page based on the maximum content rendering value of the page.
[0038] In addition, to achieve the above-mentioned purpose, the present application also proposes a web page performance evaluation device, which includes: a memory, a processor, and a computer program stored in the memory and executable on the processor, and the computer program is configured to implement the steps of the web page performance evaluation method described above.
[0039] In addition, to achieve the above objectives, the present application also proposes a storage medium, which is a computer-readable storage medium, and stores a computer program on the storage medium. When the computer program is executed by a processor, the steps of the web page performance evaluation method described above are implemented.
[0040] In addition, to achieve the above-mentioned purpose, the present application also provides a computer program product, which includes a computer program, and when the computer program is executed by a processor, the steps of the web page performance evaluation method described above are implemented.
[0041] The present application provides a web page performance evaluation method, apparatus, device and storage medium. The web page performance evaluation method obtains a number of newly added page elements in a target web page, and then calculates the page maximum content rendering value corresponding to the target page based on each of the newly added page elements, thereby determining the web page performance evaluation of the target web page based on the page maximum content rendering value, thereby evaluating the performance of the web page in a single page (SPA) scenario, and is not affected by the front-end development framework. At the same time, no manual annotation and intervention are required, thereby reducing the cost of web page performance evaluation and enhancing the applicability of application scenarios. BRIEF DESCRIPTION OF THE DRAWINGS
[0042] The accompanying drawings, which are incorporated in and constitute a part of this specification, illustrate embodiments consistent with the present application and, together with the description, serve to explain the principles of the present application.
[0043] In order to more clearly illustrate the embodiments of the present application or the technical solutions in the prior art, the drawings required for use in the embodiments or the description of the prior art will be briefly introduced below. Obviously, for ordinary technicians in this field, other drawings can be obtained based on these drawings without paying any creative labor.
[0044] Figure 1 A flowchart of the first embodiment of the webpage performance evaluation method of the present application is provided;
[0045] Figure 2 A flowchart of the second embodiment of the webpage performance evaluation method of the present application is provided;
[0046] Figure 3 A flowchart of the third embodiment of the webpage performance evaluation method of the present application is provided;
[0047] Figure 4 A flowchart of the fourth embodiment of the webpage performance evaluation method of the present application is provided;
[0048] Figure 5 This is a schematic diagram of the module structure of the web page performance evaluation device according to an embodiment of the present application;
[0049] Figure 6 Schematic diagram of the device structure of the hardware operating environment involved in the web page performance evaluation method in the embodiment of the present application.
[0050] The purpose, features and advantages of this application will be further described in conjunction with the embodiments and with reference to the accompanying drawings. DETAILED DESCRIPTION
[0051] It should be understood that the specific embodiments described herein are only used to explain the technical solutions of the present application and are not used to limit the present application.
[0052] In order to better understand the technical solution of the present application, a detailed description will be given below in conjunction with the accompanying drawings and specific implementation methods.
[0053] It should be noted that the execution subject of this embodiment can be a computing service device with data processing, network communication and program running functions, such as a tablet computer, a personal computer, a mobile phone, etc., or an electronic device capable of realizing the above functions, a big data service platform, a web page performance evaluation system, etc. The following takes the web page performance evaluation system as an example to illustrate this embodiment and the following embodiments.
[0054] Based on this, the present application embodiment provides a web page performance evaluation method, referring to Figure 1 , Figure 1 A flowchart of the first embodiment of the web page performance evaluation method of the present application is provided.
[0055] In this embodiment, the web page performance evaluation method includes steps S11 to S13:
[0056] Step S11, obtaining a number of newly added page elements in the target web page;
[0057] It should be noted that the target webpage refers to the webpage for which webpage performance evaluation is required, including domain name, page elements, etc. The newly added page elements refer to the newly added elements generated after the target webpage is changed, including text, pictures, etc., which are not limited here and can be set according to actual conditions.
[0058] Specifically, it is monitored whether the target webpage has any webpage changes, and if so, a callback result generated by the webpage changes is obtained, so as to determine a number of newly added page elements in the target webpage based on the callback result.
[0059] Step S12, calculating the page maximum content rendering value corresponding to the target page based on each of the newly added page elements;
[0060] It should be noted that the page maximum content rendering value refers to the LCP (Largest Contentful Paint) value, that is, the time when the largest block of content on the web page is drawn. It is a key indicator for evaluating the loading speed of the main content of the web page and represents the web page loading performance.
[0061] Specifically, each of the newly added page elements is calculated according to a preset algorithm to obtain the amount of information and the current level corresponding to each of the newly added page elements, and then based on the amount of information and the current level, the element score corresponding to each of the newly added page elements is calculated, so as to determine the loading completion time of the target web page based on the preset loading completion conditions, and then based on the loading completion time, the element score corresponding to each of the newly added page elements is statistically analyzed to determine the maximum content rendering value of the page corresponding to the target page.
[0062] Step S13: determining a web page performance evaluation of the target web page based on the maximum content rendering value of the page.
[0063] It should be noted that the web page performance evaluation refers to the results of evaluating aspects such as web page loading speed, interactive response speed, and user experience.
[0064] Specifically, determine whether the target web page has been loaded, and if so, obtain the page loading time, and calculate each of the newly added page elements within the page loading time according to a preset algorithm to obtain an element score corresponding to each of the newly added page elements, thereby performing statistical analysis on the element scores corresponding to each of the newly added page elements to determine the page maximum content rendering value corresponding to the target page.
[0065] This embodiment obtains several newly added page elements in the target web page, and then calculates the page maximum content rendering value corresponding to the target page based on each of the newly added page elements, thereby determining the web page performance evaluation of the target web page based on the page maximum content rendering value, thereby achieving performance evaluation of the web page in a single page (SPA) scenario, and is not affected by the front-end development framework. At the same time, no manual annotation and intervention are required, thereby reducing the cost of web page performance evaluation and enhancing the applicability of application scenarios.
[0066] In a feasible implementation manner, the step of obtaining a plurality of newly added page elements in the target web page includes:
[0067] Step S21, monitoring whether the target web page has any web page changes;
[0068] It should be noted that the web page changes refer to real-time updates of web page content, structure, style or interaction methods. The web page changes can be caused by user behavior (such as clicks, inputs), or triggered by dynamic content generation or scheduled updates on the server side, and there is no limitation here.
[0069] Specifically, in one embodiment, the web page performance evaluation system includes a monitoring module and an LCP module, etc. The web page changes of SPA need to be monitored by the popstate event provided by the browser. When the route changes, the old route and the new route are obtained through the monitoring module, and they are assigned to the two variables oldURL and newURL respectively, and then the processed oldURL and newURL are thrown to notify the LCP module through the event. When the LCP module monitors the route change event, it is necessary to clear the historical monitored data and prepare to monitor the new page. It can be monitored through the MutationObserver method provided by the browser, and there is no restriction here. In addition, if it is in the situation of opening the first page, such as logging in to the browser to open a web page, since there is only one route at present, the event will not trigger the situation after the route changes, so it is necessary to make special settings for this situation, such as developing a homepage monitoring module to handle the first situation, and there is no restriction here.
[0070] In addition, in order to facilitate calculation, the URL (Uniform Resource Locator) needs to be specially processed, such as removing the query parameters and domain name in the URL and only retaining the routing part that is valuable to the business.
[0071] Step S22: If yes, obtain the callback result generated by the webpage change;
[0072] It should be noted that the callback result refers to the result of the function call executed by the server or script when the web page changes, including data related to the web page change, such as new element information, page return data, etc., which is not limited here.
[0073] Specifically, if yes, the callback result generated by the web page change is obtained through the server or monitoring module feedback, etc., which is not limited here.
[0074] Additionally, if not, the step of monitoring whether the target webpage has a webpage change continues to be performed until the target webpage has a webpage change.
[0075] Step S23: determining a number of newly added page elements in the target web page based on the callback result.
[0076] Specifically, a number of newly added page elements in the target web page are determined according to the newly added page information in the callback result.
[0077] This embodiment monitors whether there is any web page change on the target web page, and if so, obtains the callback result generated by the web page change, and then determines a number of new page elements in the target web page based on the callback result, thereby monitoring the dynamic changes of the web page in real time, while reducing the need for manual inspection, thereby effectively improving efficiency and providing the latest page change information for data analysis, thereby providing a data basis for further business analysis and decision making.
[0078] Based on this, the present application embodiment provides a web page performance evaluation method, referring to Figure 2 , Figure 2 A flowchart diagram of the second embodiment of the web page performance evaluation method of the present application is provided.
[0079] In a feasible implementation manner, the calculating the page maximum content rendering value corresponding to the target page based on each of the newly added page elements includes:
[0080] Step S31, determining whether the target webpage has been loaded;
[0081] It should be noted that since page change is a continuous process, calculating the LCP value, that is, the maximum content rendering value of the page, requires a deadline. Therefore, it is necessary to first determine whether the target web page has been loaded to determine the page loading time of the target page.
[0082] Specifically, the resource and interface call status corresponding to the target webpage are obtained, and if the resource and interface call status do not change within a preset monitoring time, the target webpage is determined to be loaded. In addition, whether the target webpage has user interaction behavior is detected, and if so, the target webpage is determined to be loaded.
[0083] Step S32: if yes, then obtain the page loading time, and calculate each of the newly added page elements within the page loading time according to a preset algorithm to obtain an element score corresponding to each of the newly added page elements;
[0084] It should be noted that the page loading time refers to the time from when the user requests the webpage to when all the contents in the webpage are completely loaded and presented to the user, that is, the time when the page elements are loaded. The preset algorithm refers to the algorithm pre-set to calculate the amount of information corresponding to each of the newly added page elements and the current level, including the depth-first search algorithm, etc., which is not limited here and can be set according to actual conditions.
[0085] It should be further explained that the element score refers to the evaluation of each element in the page (such as pictures, videos, text, etc.) to quantify their impact or importance on the page loading performance, so as to identify the elements with the greatest impact on page performance and optimize them in a targeted manner.
[0086] Specifically, if so, the page loading time is obtained, and according to the depth-first search algorithm, a depth-first traversal is performed on each of the newly added page elements within the page loading time to determine the amount of information and the current level corresponding to each of the newly added page elements, and then the amount of information and the current level are calculated to obtain the element score corresponding to each of the newly added page elements.
[0087] Step S33: Statistically analyze the element scores corresponding to the newly added page elements to determine the page maximum content rendering value corresponding to the target page.
[0088] Specifically, the time corresponding to the maximum value of the element scores corresponding to the newly added page elements may be recorded as the page maximum content rendering value.
[0089] This embodiment determines whether the target web page has been loaded, and if so, obtains the page loading time, and calculates each of the newly added page elements within the page loading time according to a preset algorithm to obtain an element score corresponding to each of the newly added page elements, thereby performing statistical analysis on the element score corresponding to each of the newly added page elements, and determining the page maximum content rendering value corresponding to the target page, which helps to identify the bottleneck of page performance and implement targeted web page performance evaluation, thereby reducing page response time, helping to improve website performance, and improving user satisfaction. At the same time, it helps to manage the loading and presentation of content, ensure that users always get the best experience, and improve resource utilization efficiency, providing data support for continuous improvement of the website.
[0090] Based on this, the present application embodiment provides a web page performance evaluation method, referring to Figure 3 , Figure 3 A flowchart diagram of the third embodiment of the web page performance evaluation method of the present application is provided.
[0091] In a feasible implementation manner, the preset algorithm includes a depth-first search algorithm; the calculation of each of the newly added page elements within the page loading time according to the preset algorithm to obtain an element score corresponding to each of the newly added page elements includes:
[0092] Step S41, performing a depth-first traversal on each of the newly added page elements within the page loading time according to the depth-first search algorithm, and determining the amount of information and the current level corresponding to each of the newly added page elements;
[0093] It should be noted that the depth-first search algorithm refers to the DFS (Depth-First Search) algorithm, wherein the DFS algorithm can be easily extended to large and complex page structures, thereby adapting to the needs of websites of different sizes and types to improve the applicability of application scenarios. In addition, the amount of information refers to the character length of the newly added page element, that is, calculated based on the length of the newly added data, the more text information it contains, the higher the score.
[0094] It should be further explained that the current level refers to the DOM (Document Object Model) level where the newly added page element is located, wherein the DOM level refers to the tree structure constructed on the Web page. Generally speaking, the deeper the DOM level where the newly added page element is located, the more important the newly added page element is. Therefore, the current level can be used as the weight of the newly added page element for calculation.
[0095] Specifically, according to the depth-first search algorithm, a depth-first traversal is performed on each of the newly added page elements within the page loading time to determine the amount of information and the current level corresponding to each of the newly added page elements at different depths. In addition, if other algorithms can also determine the amount of information and the current level corresponding to each of the newly added page elements, the algorithm can also be used for calculation and determination, which is not limited here and can be set according to actual conditions.
[0096] Step S42, calculating the amount of information and the current level to obtain an element score corresponding to each of the newly added page elements.
[0097] It should be noted that in some embodiments, since most websites (non-image display type) are mainly text-based, images only serve to assist understanding, and therefore the importance of text display is far lower than that of text. At the same time, image loading is an asynchronous process, which greatly increases the complexity of the calculation. Therefore, in order to save computing resources, the calculation process of the element score only considers the case of text, and does not consider the loading of images.
[0098] Specifically, the amount of information and the current level are calculated to obtain the element score corresponding to each of the newly added page elements. For example, the amount of information of each of the newly added page elements at different depths and the current level are multiplied and then summed to obtain the score of a single element.
[0099] This embodiment performs a depth-first traversal on each of the newly added page elements within the page loading time according to the depth-first search algorithm, determines the amount of information and the current level corresponding to each of the newly added page elements, and then calculates the amount of information and the current level to obtain an element score corresponding to each of the newly added page elements. The DFS algorithm can ensure that each node is visited once, thereby comprehensively evaluating the impact of each newly added page element on the overall loading time, thereby improving the accuracy of identifying the elements that have the greatest impact on web page performance, and thereby achieving a web page performance evaluation method that does not require manual labeling and intervention and is independent of the framework used by the front-end.
[0100] In a feasible implementation manner, the determining whether the target webpage has been loaded includes:
[0101] Step S51, obtaining the resources and interface call status corresponding to the target webpage;
[0102] It should be noted that the resource and interface call status refers to the data exchanged and operations performed between the server and the client during the web page change.
[0103] Specifically, the resources and interface call status corresponding to the target webpage may be obtained through a system monitoring tool, such as by using PerformanceObserver for monitoring and acquisition, which is not limited here.
[0104] Step S52, if the resource and interface call status does not change within the preset monitoring time, it is determined that the target webpage is loaded; and / or,
[0105] It should be noted that the preset monitoring time refers to the preset monitoring time for web page resources and interface calls, which can be set according to actual conditions and is not limited here.
[0106] Step S53, detecting whether a user interaction occurs on the target webpage;
[0107] It should be noted that the user interaction behavior refers to the interaction behavior between the user and the target web page, such as click behavior, etc., which is not limited here.
[0108] Specifically, various user interaction events, such as clicks, mouse movements, keyboard input, form submission, etc., can be monitored through tools or methods such as JavaScript. There is no limitation here and it can be set according to actual conditions.
[0109] Step S53: If yes, it is determined that the target webpage is loaded completely.
[0110] This embodiment obtains the resource and interface call status corresponding to the target web page, and then determines that the target web page has been loaded if the resource and interface call status do not change within a preset listening time. In addition, it detects whether the target web page has any user interaction behavior, and if so, it determines that the target web page has been loaded, thereby more accurately judging whether the web page is actually loaded. In addition, by monitoring the resource and interface call status, the bottleneck of resource loading, such as slowly loaded resources or frequently called interfaces, can be discovered and optimized, thereby improving the overall performance of the web page.
[0111] Based on this, the present application embodiment provides a web page performance evaluation method, referring to Figure 4 , Figure 4 A flowchart diagram of the fourth embodiment of the web page performance evaluation method of the present application is provided.
[0112] In a feasible implementation manner, determining the webpage performance evaluation of the target webpage based on the maximum content rendering value of the page includes:
[0113] Step S61, matching the page maximum content rendering value with a preset web page performance rating level to determine the web page performance rating level of the target web page;
[0114] It should be noted that the preset web page performance rating level refers to a series of rating standards set in advance for evaluating web page performance, which can be comprehensively evaluated based on various indicators of web page performance, such as page loading speed, response time, resource optimization degree, user experience, etc. The web page performance rating level may include multiple levels such as excellent, good, average, poor, and bad, and may also be expressed in other forms such as digital form (such as percentage system, etc.), which is not limited here and can be set according to actual conditions.
[0115] Specifically, the maximum content rendering value of the page is matched with the grade rating range in the preset web page performance rating level to determine the web page performance rating level of the target web page. For example, when the grade rating range is less than 2.5s, the web page performance rating level is the best performance; when the grade rating range is 2.5s-4s, the web page performance rating level is medium performance; when the grade rating range is greater than 4s, the web page performance rating level is poor performance, etc., wherein the grade rating range can be set according to actual conditions and is not limited here.
[0116] Step S62, obtaining the grade evaluation corresponding to the web page performance rating grade;
[0117] It should be noted that the grade evaluation refers to the grade evaluation information corresponding to the web page performance scoring level. For example, the excellent grade evaluation is "web page performance meets or exceeds the industry's best standards, and the user experience is excellent", the good grade evaluation is "web page performance is good, meeting most user needs, and there is a small amount of room for optimization", the general grade evaluation is "web page performance basically meets the standards, but there are some obvious problems that need to be improved", the poor grade evaluation is "web page performance is poor, user experience is poor, and there are multiple performance problems that need to be resolved", the bad grade evaluation is "web page performance is extremely poor, seriously affecting user experience, and may lead to user loss", etc., and there is no restriction here.
[0118] Specifically, the grade evaluation corresponding to the web page performance rating level can be obtained by matching with a preset grade evaluation database, which is not limited here and can be set according to actual conditions.
[0119] Step S63: Associating and combining the web page performance rating grade with the grade evaluation to generate a web page performance evaluation of the target web page.
[0120] Specifically, the web page performance rating grade is associated and combined with the rating evaluation to generate a web page performance evaluation of the target web page. In addition, the rating and other information of this web page performance evaluation may also be associated and combined to increase the information richness of the web page performance evaluation, allowing users to obtain more relevant information and make more correct decisions.
[0121] This embodiment determines the web page performance score level of the target web page by matching the maximum content rendering value of the page with a preset web page performance score level, and then obtains the grade evaluation corresponding to the web page performance score level, thereby associating and combining the web page performance score level with the grade evaluation to generate a web page performance evaluation of the target web page, thereby achieving a quantitative evaluation of web page performance, making the evaluation result more objective and standardized, and at the same time, for the web page performance evaluation in a single page (SPA) scenario, it is not affected by the front-end development framework, and no manual labeling and intervention are required, thereby reducing the cost of web page performance evaluation and enhancing the applicability of application scenarios.
[0122] In a feasible implementation manner, after determining the webpage performance evaluation of the target webpage based on the page maximum content rendering value, the method further includes:
[0123] Step S71, if the web page performance evaluation is a negative evaluation, obtaining the negative performance reason;
[0124] It should be noted that the negative evaluation refers to a negative evaluation of the performance of the current web page, such as poor performance, insufficient performance, etc., which is not limited here. In addition, the negative performance reasons include slow page loading speed, delayed response time (such as when performing interactive operations, such as clicking, scrolling, etc., the web page does not respond in time), server stability problems, insufficient resource optimization (such as media resources such as pictures and videos are not optimized, and loading and rendering occupy too much bandwidth and CPU resources), user interface problems (web page layout is not displayed properly in certain screen sizes or browsers, affecting visual effects and usability) and security issues, etc., which are not limited here and can be set according to actual conditions.
[0125] Specifically, if the web page performance evaluation is a negative evaluation, the negative performance reason is obtained, wherein the negative performance reason can be determined by recording the element information that actually affects the LCP when calculating the LCP value. The performance evaluation process in the target web page can also be detected through performance detection tools, so as to obtain the negative performance reason. There is no limitation here and it can be set according to actual conditions.
[0126] Step S72, generating a web page optimization report based on the negative performance reasons;
[0127] It should be noted that the web page optimization report refers to a document that records various optimization measures, implementation processes, results achieved and subsequent improvement suggestions for the target web page set up to address negative performance reasons, including but not limited to basic website diagnosis (such as website access speed, server IP, website BR value, ranking, number and proportion of included items, traffic source, etc.), page aesthetics and user experience diagnosis, site structure diagnosis: diagnosis of navigation structure (header, product, bottom, breadcrumb navigation), optimization suggestions for URL structure (flat or tree structure), internal link structure (connection status of internal links pointing to pages), performance diagnosis (test results of performance indicators such as page loading speed and response time), performance optimization suggestions and measures, suggestions for monitoring website performance and search engine rankings, etc.
[0128] Specifically, the negative performance reasons are input into a web page optimization suggestion generation model to obtain web page optimization suggestions output by the web page optimization suggestion generation model, and then the web page optimization suggestions are associated and combined with information such as the negative performance reasons to generate a web page optimization report.
[0129] The training process of the webpage optimization suggestion generation model is as follows:
[0130] Obtain the historical performance negative reasons and the web page optimization suggestions corresponding to the historical performance negative reasons, and then perform data preprocessing on the historical performance negative reasons and the web page optimization suggestions corresponding to the historical performance negative reasons, such as data cleaning, normalization, etc., so as to input the historical performance negative reasons and the web page optimization suggestions corresponding to the historical performance negative reasons into the initial web page optimization suggestion generation model, obtain the predicted value output by the initial web page optimization suggestion generation model, and then calculate the model loss value based on the predicted value and the sample label using the loss function. In this embodiment, the loss function can be set according to actual needs and is not specifically limited here. After the model loss value is calculated, the training process ends, and the error back propagation algorithm is used to update the model parameters in the initial web page optimization suggestion generation model, and then the next training is carried out. During the training process, it is determined whether the updated initial web page optimization suggestion generation model meets the preset training end condition. If it does, the updated initial web page optimization suggestion generation model is used as the web page optimization suggestion generation model. If it does not meet the condition, the model training continues, wherein the preset training end condition includes loss convergence and reaching the maximum iteration number threshold.
[0131] Step S73: Push the webpage optimization report to the management personnel for the management personnel to view.
[0132] Specifically, the web page optimization report is pushed to the management personnel for the management personnel to view. The push can be performed through APP, mini-programs, web pages, and emails, etc. There is no limitation here and it can be set according to the actual situation.
[0133] In addition, it is confirmed whether to execute the optimization plan in the web page optimization report, and if so, the current target web page is optimized and configured according to the optimization plan, so as to achieve web page optimization.
[0134] In this embodiment, if the web page performance evaluation is a negative evaluation, the negative performance reason is obtained, and then a web page optimization report is generated based on the negative performance reason, and the web page optimization report is pushed to the management personnel for the management personnel to view, and then the key factors affecting the page performance are found according to the performance evaluation, so as to assist the developer to improve the loading experience of the website, thereby improving the operation efficiency of the website, making more efficient use of server and network resources, reducing resource waste, and reducing operating costs. At the same time, improving web page performance helps to improve the ranking of the website in search engine results, thereby increasing traffic and exposure.
[0135] It should be understood that the order of execution of the steps in the above embodiment does not necessarily mean the order of execution. The execution order of each process should be determined by its function and internal logic, and should not constitute any limitation on the implementation process of the embodiment of the present invention.
[0136] This application also provides a web page performance evaluation device, please refer to Figure 5 , the web page performance evaluation device comprises:
[0137] The acquisition module 51 is used to acquire a number of newly added page elements in the target web page;
[0138] A calculation module 52, configured to calculate a page maximum content rendering value corresponding to the target page based on each of the newly added page elements;
[0139] The determination module 53 is used to determine the web page performance evaluation of the target web page based on the maximum content rendering value of the page.
[0140] The web page performance evaluation device is also used for:
[0141] Monitoring whether the target web page has any web page changes;
[0142] If yes, get the callback result generated by the web page change;
[0143] Based on the callback result, a number of newly added page elements in the target webpage are determined.
[0144] The web page performance evaluation device is also used for:
[0145] Determine whether the target webpage has been loaded;
[0146] If yes, the page loading time is obtained, and each of the newly added page elements within the page loading time is calculated according to a preset algorithm to obtain an element score corresponding to each of the newly added page elements;
[0147] Statistical analysis is performed on the element scores corresponding to each of the newly added page elements to determine the page maximum content rendering value corresponding to the target page.
[0148] The web page performance evaluation device is also used for:
[0149] According to the depth-first search algorithm, a depth-first traversal is performed on each of the newly added page elements within the page loading time to determine the amount of information and the current level corresponding to each of the newly added page elements;
[0150] The information volume and the current level are calculated to obtain an element score corresponding to each of the newly added page elements.
[0151] The web page performance evaluation device is also used for:
[0152] Obtaining resources and interface call status corresponding to the target webpage;
[0153] If the resource and interface call status does not change within the preset monitoring time, it is determined that the target webpage is loaded; and / or,
[0154] Detecting whether a user interaction occurs on the target webpage;
[0155] If so, it is determined that the target webpage has been loaded.
[0156] The web page performance evaluation device is also used for:
[0157] Matching the maximum content rendering value of the page with a preset web page performance rating level to determine the web page performance rating level of the target web page;
[0158] Obtaining a grade evaluation corresponding to the webpage performance rating grade;
[0159] The web page performance rating grade is associated and combined with the grade evaluation to generate a web page performance evaluation of the target web page.
[0160] The web page performance evaluation device is also used for:
[0161] If the webpage performance evaluation is a negative evaluation, obtaining the negative performance reason;
[0162] Generate a web page optimization report based on the negative performance reasons;
[0163] The webpage optimization report is pushed to the management personnel for the management personnel to view.
[0164] The web page performance evaluation device provided by the present application adopts the web page performance evaluation method in the above embodiment, and can solve the technical problems in the background technology. Compared with the prior art, the beneficial effects of the web page performance evaluation device provided by the present application are the same as the beneficial effects of the web page performance evaluation method provided by the above embodiment, and other technical features in the web page performance evaluation device are the same as the features disclosed in the above embodiment method, which will not be repeated here.
[0165] The present application provides a web page performance evaluation device, which includes: at least one processor; and a memory communicatively connected to the at least one processor; wherein the memory stores instructions that can be executed by the at least one processor, and the instructions are executed by the at least one processor so that the at least one processor can execute the web page performance evaluation method in the above-mentioned embodiment 1.
[0166] Reference below Figure 6, which shows a schematic diagram of the structure of a web page performance evaluation device suitable for implementing the embodiment of the present application. The web page performance evaluation device in the embodiment of the present application may include but is not limited to mobile terminals such as mobile phones, laptop computers, digital broadcast receivers, PDAs (Personal Digital Assistants), PADs (Portable Application Descriptions), PMPs (Portable Media Players), vehicle-mounted terminals (such as vehicle-mounted navigation terminals), etc., and fixed terminals such as digital TVs, desktop computers, etc. Figure 6 The web page performance evaluation device shown is only an example and should not bring any limitation to the functions and scope of use of the embodiments of the present application.
[0167] like Figure 6 As shown, the web page performance evaluation device may include a processing device 1001 (e.g., a central processing unit, a graphics processor, etc.), which can perform various appropriate actions and processes according to a program stored in a read-only memory (ROM: Read Only Memory) 1002 or a program loaded from a storage device 1003 to a random access memory (RAM: Random Access Memory) 1004. In RAM1004, various programs and data required for the operation of the web page performance evaluation device are also stored. The processing device 1001, ROM1002, and RAM1004 are connected to each other through a bus 1005. An input / output (I / O) interface 1006 is also connected to the bus. Generally, the following systems can be connected to the I / O interface 1006: an input device 1007 including, for example, a touch screen, a touch pad, a keyboard, a mouse, an image sensor, a microphone, an accelerometer, a gyroscope, etc.; an output device 1008 including, for example, a liquid crystal display (LCD: Liquid Crystal Display), a speaker, a vibrator, etc.; a storage device 1003 including, for example, a magnetic tape, a hard disk, etc.; and a communication device 1009. The communication device 1009 can allow the web page performance evaluation device to communicate with other devices wirelessly or by wire to exchange data. Although the figure shows a web page performance evaluation device with various systems, it should be understood that it is not required to implement or have all the systems shown. More or fewer systems can be implemented or have alternatively.
[0168] In particular, according to the embodiments disclosed in the present application, the process described above with reference to the flowchart can be implemented as a computer software program. For example, the embodiments disclosed in the present application include a computer program product, which includes a computer program carried on a computer-readable medium, and the computer program includes a program code for executing the method shown in the flowchart. In such an embodiment, the computer program can be downloaded and installed from a network through a communication device, or installed from a storage device 1003, or installed from a ROM 1002. When the computer program is executed by the processing device 1001, the above-mentioned functions defined in the method of the embodiment disclosed in the present application are executed.
[0169] The web page performance evaluation device provided by the present application adopts the web page performance evaluation method in the above embodiment, and can solve the technical problems in the background technology. Compared with the prior art, the beneficial effects of the web page performance evaluation device provided by the present application are the same as the beneficial effects of the web page performance evaluation method provided by the above embodiment, and other technical features in the web page performance evaluation device are the same as the features disclosed in the method of the previous embodiment, which will not be repeated here.
[0170] It should be understood that the various parts disclosed in this application can be implemented by hardware, software, firmware or a combination thereof. In the description of the above embodiments, specific features, structures, materials or characteristics can be combined in any one or more embodiments or examples in a suitable manner.
[0171] The above is only a specific implementation of the present application, but the protection scope of the present application is not limited thereto. Any person skilled in the art who is familiar with the present technical field can easily think of changes or substitutions within the technical scope disclosed in the present application, which should be included in the protection scope of the present application. Therefore, the protection scope of the present application should be based on the protection scope of the claims.
[0172] The present application provides a computer-readable storage medium having computer-readable program instructions (ie, computer programs) stored thereon, and the computer-readable program instructions are used to execute the web page performance evaluation method in the above-mentioned embodiment.
[0173] The computer-readable storage medium provided in the present application may be, for example, a USB flash drive, but is not limited to electrical, magnetic, optical, electromagnetic, infrared, or semiconductor systems, systems or devices, or any combination of the above. More specific examples of computer-readable storage media may include, but are not limited to: an electrical connection with one or more wires, a portable computer disk, a hard disk, a random access memory (RAM), a read-only memory (ROM), an erasable programmable read-only memory (EPROM or flash memory), an optical fiber, a portable compact disk read-only memory (CD-ROM), an optical storage device, a magnetic storage device, or any suitable combination of the above. In this embodiment, the computer-readable storage medium may be any tangible medium containing or storing a program that can be used by or in combination with an instruction execution system, system or device. The program code contained on the computer-readable storage medium may be transmitted using any appropriate medium, including but not limited to: wires, optical cables, RF (Radio Frequency), etc., or any suitable combination of the above.
[0174] The computer-readable storage medium may be included in the web page performance evaluation device; or may exist independently without being assembled into the web page performance evaluation device.
[0175] The computer-readable storage medium carries one or more programs. When the one or more programs are executed by the web page performance evaluation device, the web page performance evaluation device:
[0176] Get several newly added page elements in the target web page;
[0177] Based on each of the newly added page elements, calculate the page maximum content rendering value corresponding to the target page;
[0178] Based on the page maximum content rendering value, a web page performance evaluation of the target web page is determined.
[0179] Computer program code for performing the operations of the present application may be written in one or more programming languages or a combination thereof, including object-oriented programming languages such as Java, Smalltalk, C++, and conventional procedural programming languages such as "C" or similar programming languages. The program code may be executed entirely on the user's computer, partially on the user's computer, as a separate software package, partially on the user's computer and partially on a remote computer, or entirely on a remote computer or server. In the case of a remote computer, the remote computer may be connected to the user's computer through any type of network, including a local area network (LAN) or a wide area network (WAN), or may be connected to an external computer (e.g., via the Internet using an Internet service provider).
[0180] The flow chart and block diagram in the accompanying drawings illustrate the possible architecture, function and operation of the system, method and computer program product according to various embodiments of the present application. In this regard, each square box in the flow chart or block diagram can represent a module, a program segment or a part of a code, and the module, the program segment or a part of the code contains one or more executable instructions for realizing the specified logical function. It should also be noted that in some alternative implementations, the functions marked in the square box can also occur in a sequence different from that marked in the accompanying drawings. For example, two square boxes represented in succession can actually be executed substantially in parallel, and they can sometimes be executed in the opposite order, depending on the functions involved. It should also be noted that each square box in the block diagram and / or flow chart, and the combination of the square boxes in the block diagram and / or flow chart can be implemented with a dedicated hardware-based system that performs a specified function or operation, or can be implemented with a combination of dedicated hardware and computer instructions.
[0181] The modules involved in the embodiments described in this application may be implemented by software or hardware, wherein the name of the module does not constitute a limitation on the unit itself in some cases.
[0182] The readable storage medium provided in the present application is a computer-readable storage medium, which stores computer-readable program instructions (i.e., computer programs) for executing the above-mentioned web page performance evaluation method, and can solve the technical problems in the background technology. Compared with the prior art, the beneficial effects of the computer-readable storage medium provided in the present application are the same as the beneficial effects of the web page performance evaluation method provided in the above-mentioned embodiment, and will not be repeated here.
[0183] An embodiment of the present application provides a computer program product, including a computer program, which implements the steps of the web page performance evaluation method as described above when the computer program is executed by a processor.
[0184] The computer program product provided in this application can solve the technical problems in the background technology. Compared with the prior art, the beneficial effects of the computer program product provided in the embodiment of this application are the same as the beneficial effects of the web page performance evaluation method provided in the above embodiment, which will not be repeated here.
[0185] The above descriptions are only some embodiments of the present application, and are not intended to limit the patent scope of the present application. All equivalent structural changes made using the contents of the present application specification and drawings under the technical concept of the present application, or direct / indirect applications in other related technical fields are included in the patent protection scope of the present application.
Claims
1. A web page performance evaluation method, characterized in that: include: Get several newly added page elements in the target web page; Based on each of the newly added page elements, calculate the page maximum content rendering value corresponding to the target page; Based on the page maximum content rendering value, a web page performance evaluation of the target web page is determined.
2. The web page performance evaluation method according to claim 1, characterized in that: The step of obtaining several newly added page elements in the target web page includes: Monitoring whether the target web page has any web page changes; If yes, get the callback result generated by the web page change; Based on the callback result, a number of newly added page elements in the target webpage are determined.
3. The web page performance evaluation method according to claim 1, characterized in that: The calculating, based on each of the newly added page elements, a page maximum content rendering value corresponding to the target page includes: Determine whether the target webpage has been loaded; If yes, the page loading time is obtained, and each of the newly added page elements within the page loading time is calculated according to a preset algorithm to obtain an element score corresponding to each of the newly added page elements; Statistical analysis is performed on the element scores corresponding to each of the newly added page elements to determine the page maximum content rendering value corresponding to the target page.
4. The web page performance evaluation method according to claim 3, characterized in that: The preset algorithm includes a depth-first search algorithm; The calculating each of the newly added page elements within the page loading time according to a preset algorithm to obtain an element score corresponding to each of the newly added page elements includes: According to the depth-first search algorithm, a depth-first traversal is performed on each of the newly added page elements within the page loading time to determine the amount of information and the current level corresponding to each of the newly added page elements; The information volume and the current level are calculated to obtain an element score corresponding to each of the newly added page elements.
5. The web page performance evaluation method according to claim 3, characterized in that: The step of determining whether the target webpage has been loaded includes: Obtaining resources and interface call status corresponding to the target webpage; If the resource and interface call status does not change within the preset monitoring time, it is determined that the target webpage is loaded; and / or, Detecting whether a user interaction occurs on the target webpage; If so, it is determined that the target webpage has been loaded.
6. The web page performance evaluation method according to claim 1, characterized in that: The determining the webpage performance evaluation of the target webpage based on the maximum content rendering value of the page includes: Matching the maximum content rendering value of the page with a preset web page performance rating level to determine the web page performance rating level of the target web page; Obtaining a grade evaluation corresponding to the webpage performance rating grade; The web page performance rating grade is associated and combined with the grade evaluation to generate a web page performance evaluation of the target web page.
7. The web page performance evaluation method according to claim 1, characterized in that: After determining the webpage performance evaluation of the target webpage based on the page maximum content rendering value, the method further includes: If the webpage performance evaluation is a negative evaluation, obtaining the negative performance reason; Generate a web page optimization report based on the negative performance reasons; The webpage optimization report is pushed to the management personnel for the management personnel to view.
8. A web page performance evaluation device, characterized in that: include: An acquisition module, used to acquire several newly added page elements in a target web page; A calculation module, used for calculating the page maximum content rendering value corresponding to the target page based on each of the newly added page elements; The determination module is used to determine the web page performance evaluation of the target web page based on the maximum content rendering value of the page.
9. A web page performance evaluation device, characterized in that: The web page performance evaluation device comprises: a memory, a processor, and a computer program stored in the memory and executable on the processor, wherein the computer program is configured to implement the steps of the web page performance evaluation method according to any one of claims 1 to 7.
10. A storage medium, characterized in that: The storage medium is a computer-readable storage medium, and a computer program is stored on the storage medium. When the computer program is executed by a processor, the steps of the web page performance evaluation method according to any one of claims 1 to 7 are implemented.
