Page first screen generation method and device, equipment and storage medium

Abstract

This invention relates to the field of computer application technology, and discloses a method, apparatus, device, and storage medium for generating the first screen of a webpage. The method includes: during page construction, injecting a pre-set page data and metric collection SDK into a headless browser and waking up the headless browser to perform page pre-rendering; acquiring one or more page performance metrics collected by the SDK during page pre-rendering; determining the page type of the pre-rendered page based on the page performance metrics; determining a first-screen generation strategy based on the page type of the pre-rendered page; and generating the first screen of the webpage based on the first-screen generation strategy. This invention achieves automatic differentiation of page types based on page performance metrics, improving the efficiency of first-screen generation and reducing the time cost of first-screen development.

Description

Technical Field

[0001] This invention relates to the field of computer applications, and in particular to a method, apparatus, device, and storage medium for generating the first screen of a webpage. Background Technology

[0002] Page types are divided into static pages and dynamic pages. Dynamic pages require a longer loading time to complete the initial rendering of the first screen. Traditionally, this rendering wait time is mostly handled by using loading animations, but this results in a poor user experience. Therefore, a skeleton screen is used to optimize the initial rendering. Before the data is fully loaded, a gray placeholder image is used to show the general structure of the first screen. After loading is complete, this image is replaced with the actual page, allowing users to directly perceive the layout and content. This proactively identifies user focus points and allows users to concentrate on areas of interest in advance, thus improving the user experience.

[0003] In existing technologies, adding skeleton screens to static pages can degrade page performance, so it's not feasible to uniformly add skeleton screens to all pages. The common approach is to manually differentiate between static and dynamic pages, and then add skeleton screens to the dynamic pages. The drawbacks of this method are high design and development costs and low efficiency. Summary of the Invention

[0004] The main objective of this invention is to provide a method, apparatus, device, and storage medium for generating the first screen of a page, aiming to solve the technical problem of how to automatically distinguish page types and efficiently generate the first screen of a page.

[0005] The first aspect of this invention provides a method for generating the first screen of a webpage, comprising:

[0006] When building a page, inject a pre-built page data and metrics collection SDK into the headless browser and wake up the headless browser to pre-render the page.

[0007] Obtain one or more page performance metrics collected by the SDK during page pre-rendering;

[0008] Based on the page performance metrics, the page type of the pre-rendered page is determined, wherein the page type includes static pages and dynamic pages;

[0009] Based on the page type of the pre-rendered page, a first-screen generation strategy is determined, and the first screen of the page is generated based on the first-screen generation strategy.

[0010] Optionally, in a first implementation of the first aspect of the present invention, determining the page type of the pre-rendered page based on the page performance metrics includes:

[0011] The page performance metrics are substituted into the preset page performance evaluation formula for calculation to obtain the page performance evaluation value of the pre-rendered page.

[0012] The page type of the pre-rendered page is determined based on the page performance evaluation value and the preset page type judgment rules.

[0013] Optionally, in a second implementation of the first aspect of the present invention, the page performance metrics include: initial page content rendering time and maximum page content rendering time;

[0014] The page performance evaluation formula is: P = YX;

[0015] Where P is the page performance evaluation value; X is the initial page content rendering time of the pre-rendered page; and Y is the maximum page content rendering time of the pre-rendered page.

[0016] Optionally, in a third implementation of the first aspect of the present invention, determining the page type of the pre-rendered page based on the page performance evaluation value and the preset page type judgment rule includes:

[0017] Compare the page performance evaluation value with the preset first performance threshold;

[0018] If the page performance evaluation value is less than or equal to the first performance threshold, and the maximum page content rendering time is less than or equal to the preset second performance threshold, then the page type of the pre-rendered page is determined to be a static page.

[0019] If the page performance evaluation value is greater than the first performance threshold and the maximum page content rendering time is greater than the second performance threshold, then the page type of the pre-rendered page is determined to be a dynamic page, wherein the first performance threshold is less than the second performance threshold.

[0020] Optionally, in a fourth implementation of the first aspect of the present invention, the method for generating the first screen of the page further includes:

[0021] At preset intervals, obtain historical page performance metrics collected within the preset statistical period;

[0022] Cluster analysis was performed on the historical page performance metrics to obtain the performance metrics clusters of static pages and the performance metrics clusters of dynamic pages.

[0023] The performance metrics of each page in the static and dynamic pages are clustered and statistically analyzed to obtain the third and fourth performance thresholds.

[0024] The first performance threshold and the second performance threshold are updated respectively using the third performance threshold and the fourth performance threshold.

[0025] Optionally, in a fifth implementation of the first aspect of the present invention, determining the first-screen generation strategy based on the page type of the pre-rendered page, and generating the first screen of the page based on the first-screen generation strategy, includes:

[0026] If the page type of the pre-rendered page is a static page, then the first screen of the page will be generated using pre-rendering technology.

[0027] The pre-rendered page result of the headless browser is retained, and the pre-rendered page result is used as the first screen of the page.

[0028] Optionally, in a sixth implementation of the first aspect of the present invention, determining the first-screen generation strategy based on the page type of the pre-rendered page, and generating the first screen of the page based on the first-screen generation strategy, includes:

[0029] If the page type of the pre-rendered page is a dynamic page, then the first screen of the page will be generated using skeleton screen technology.

[0030] Based on the page data, a skeleton screen is generated using a preset skeleton screen generation tool, and the skeleton screen is used as the first screen of the page.

[0031] A second aspect of the present invention provides a page first screen generation apparatus, comprising:

[0032] The pre-rendering module is used to inject pre-set page data and metric collection SDKs into the headless browser when building the page, and wake up the headless browser to perform page pre-rendering.

[0033] The metrics collection module is used to obtain one or more page performance metrics collected by the SDK during page pre-rendering;

[0034] The page identification module is used to determine the page type of the pre-rendered page based on the page performance indicators, wherein the page type includes static pages and dynamic pages;

[0035] The first screen generation module is used to determine the first screen generation strategy based on the page type of the pre-rendered page, and generate the first screen of the page based on the first screen generation strategy.

[0036] Optionally, in a first implementation of the second aspect of the present invention, the page discrimination module further includes:

[0037] The performance evaluation unit is used to substitute the page performance indicators into the preset page performance evaluation formula for calculation to obtain the page performance evaluation value of the pre-rendered page.

[0038] The type determination unit is used to determine the page type of the pre-rendered page based on the page performance evaluation value and the preset page type determination rules.

[0039] Optionally, in a second implementation of the second aspect of the present invention, the page performance metrics include: initial page content rendering time and maximum page content rendering time;

[0040] The page performance evaluation formula is: P = YX;

[0041] Where P is the page performance evaluation value; X is the initial page content rendering time of the pre-rendered page; and Y is the maximum page content rendering time of the pre-rendered page.

[0042] Optionally, in a third implementation of the second aspect of the present invention, the type determination unit is used for:

[0043] Compare the page performance evaluation value with the preset first performance threshold;

[0044] If the page performance evaluation value is less than or equal to the first performance threshold, and the maximum page content rendering time is less than or equal to the preset second performance threshold, then the page type of the pre-rendered page is determined to be a static page.

[0045] If the page performance evaluation value is greater than the first performance threshold and the maximum page content rendering time is greater than the second performance threshold, then the page type of the pre-rendered page is determined to be a dynamic page, wherein the first performance threshold is less than the second performance threshold.

[0046] Optionally, in a fourth implementation of the second aspect of the present invention, the method for generating the first screen of the page further includes:

[0047] At preset intervals, obtain historical page performance metrics collected within the preset statistical period;

[0048] Cluster analysis was performed on the historical page performance metrics to obtain the performance metrics clusters of static pages and the performance metrics clusters of dynamic pages.

[0049] The performance metrics of each page in the static and dynamic pages are clustered and statistically analyzed to obtain the third and fourth performance thresholds.

[0050] The first performance threshold and the second performance threshold are updated respectively using the third performance threshold and the fourth performance threshold.

[0051] Optionally, in a fifth implementation of the second aspect of the present invention, the first-screen generation module includes a static first-screen generation unit, specifically used for:

[0052] If the page type of the pre-rendered page is a static page, then the first screen of the page will be generated using pre-rendering technology.

[0053] The pre-rendered page result of the headless browser is retained, and the pre-rendered page result is used as the first screen of the page.

[0054] Optionally, in a sixth implementation of the second aspect of the present invention, the first-screen generation module includes a dynamic first-screen generation unit, specifically used for:

[0055] If the page type of the pre-rendered page is a dynamic page, then the first screen of the page will be generated using skeleton screen technology.

[0056] Based on the page data, a skeleton screen is generated using a preset skeleton screen generation tool, and the skeleton screen is used as the first screen of the page.

[0057] A third aspect of the present invention provides an electronic device, comprising: a memory and at least one processor, wherein the memory stores instructions; the at least one processor invokes the instructions in the memory to cause the electronic device to execute the above-described page first screen generation method.

[0058] A fourth aspect of the present invention provides a computer-readable storage medium storing instructions that, when executed on a computer, cause the computer to perform the above-described page first screen generation method.

[0059] The technical solution provided by this invention first injects page data and a metrics collection SDK into a headless browser. During pre-rendering, various page performance metrics are collected. Then, using a page evaluation formula and page type judgment rules obtained from pre-statistical analysis of page performance metrics of multiple pages, the performance metrics of the pre-rendered page are evaluated, and the page type is determined. Based on the page type, a corresponding first screen is generated. This first screen generation method automatically distinguishes page types based on page performance metrics, improving the efficiency of first screen generation and reducing the time cost of first screen development. Attached Figure Description

[0060] Figure 1 This is a schematic diagram of an embodiment of the page first screen generation method in this invention;

[0061] Figure 2 This is a schematic diagram of another embodiment of the page first screen generation method in this invention;

[0062] Figure 3 This is a schematic diagram of one embodiment of the page first screen generation device in this invention;

[0063] Figure 4 This is a schematic diagram of another embodiment of the page first screen generation device in this invention;

[0064] Figure 5This is a schematic diagram of one embodiment of the page first screen generation device in this invention. Detailed Implementation

[0065] This invention provides a method, apparatus, device, and storage medium for generating the first screen of a page. Based on the statistical analysis results of page performance indicators, this invention obtains page type judgment rules, solving the technical problem of how to automatically distinguish page types and efficiently generate the first screen of a page, thus facilitating technicians to efficiently optimize the loading of the first screen of a page.

[0066] The terms “first,” “second,” “third,” “fourth,” etc. (if present) in the specification, claims, and accompanying drawings of this invention are used to distinguish similar objects and are not necessarily used to describe a specific order or sequence. It should be understood that such data can be interchanged where appropriate so that the embodiments described herein can be implemented in orders other than those illustrated or described herein. Furthermore, the terms “comprising” or “having,” and any variations thereof, are intended to cover a non-exclusive inclusion; for example, a process, method, system, product, or apparatus that comprises a series of steps or units is not necessarily limited to those steps or units explicitly listed, but may include other steps or units not explicitly listed or inherent to such processes, methods, products, or apparatus.

[0067] For ease of understanding, the specific process of the embodiments of the present invention is described below. Please refer to [link / reference]. Figure 1 One embodiment of the page first screen generation method in this invention includes:

[0068] 101. When building a page, inject a pre-built page data and metrics collection SDK into the headless browser and wake up the headless browser to pre-render the page;

[0069] It is understood that the executing entity of this invention can be a page first screen generation device, a terminal, or a server; no specific limitation is made here. This embodiment of the invention will be described using a server as the executing entity as an example.

[0070] In this embodiment, the headless browser is a browser or browser emulation name without a recognizable graphical interface. The test cases are automated and tested using a command-line interface. It is capable of rendering pages, including page layout, colors, fonts, and other style elements.

[0071] In this embodiment, the page data is not limited, and includes, but is not limited to, cookies, page paths, page search parameters, etc.

[0072] In this embodiment, SDK (Software Development Kit) refers to a collection of related documents, examples, and tools that assist in the development of a certain type of software. Metrics collection SDK is an SDK tool with metrics collection functionality.

[0073] In this embodiment, page pre-rendering refers to rendering the constructed page to obtain the constructed page, but the first screen of the pre-rendered result is not the first screen of the final page.

[0074] In this embodiment, the page being constructed is not limited; it can be a new page or an existing page that has been reconstructed, and step 101 is performed during the construction process.

[0075] 102. Obtain one or more page performance metrics collected by the SDK during page pre-rendering;

[0076] In this embodiment, the headless browser provides an interface to call the metrics collection SDK, collect page performance metrics data exhibited during page pre-rendering, and record them.

[0077] In this embodiment, page performance metrics refer to those used to measure user experience and page performance. Page performance metrics are not limited to any one type, but include, but are not limited to, initial content rendering time and maximum content rendering time.

[0078] 103. Based on the page performance metrics, determine the page type of the pre-rendered page, wherein the page type includes static pages and dynamic pages;

[0079] In this embodiment, a static page refers to a page that has no backend database, contains no program, and is not interactive. The content of a static page is relatively stable, the process does not require a database connection, and the rendering speed of a static page is faster than that of a dynamic page.

[0080] In this embodiment, a dynamic page refers to a page that differs from a static webpage. It is generated through programming using various high-level programming languages ​​and database technologies to achieve effective, dynamic, and interactive management of page content and style. Dynamic webpages are generally based on database technology, and the server only returns a complete webpage when requested by a user. Dynamic pages render slower than static pages, are more prone to page offsets, and are less stable.

[0081] 104. Based on the page type of the pre-rendered page, determine the first screen generation strategy, and generate the first screen of the page based on the first screen generation strategy.

[0082] In this embodiment, the first screen refers to the first screen of the page. Due to the limited screen size of the terminal, one screen cannot display all the content of the page. Multiple screens are needed to display a page. The first screen is called the first screen. Users can use the scroll bar to view the content of other screens of the page.

[0083] This invention provides a method for generating the first screen of a webpage. This method first injects page data and a metrics collection SDK into a headless browser, collecting various page performance metrics during pre-rendering. Then, the page performance metrics are used to determine the page type, and a corresponding first screen is generated for that page type. This first screen generation method automatically distinguishes page types based on performance metrics, improving the efficiency of first screen generation and reducing the time cost of first screen development.

[0084] Please see Figure 2 Another embodiment of the page first screen generation method in this invention includes:

[0085] 201. When building the page, inject the pre-built page data and metric collection SDK into the headless browser and wake up the headless browser to pre-render the page;

[0086] 202. Obtain one or more page performance metrics collected by the SDK during page pre-rendering;

[0087] 203. Substitute the page performance indicators into the preset page performance evaluation formula to calculate the page performance evaluation value of the pre-rendered page.

[0088] Optionally, in one embodiment, the page performance metrics in step 203 above further include: the time taken to render the first page content and the maximum time taken to render the page content;

[0089] The page performance evaluation formula is: P = YX;

[0090] Where P is the page performance evaluation value; X is the initial page content rendering time of the pre-rendered page; and Y is the maximum page content rendering time of the pre-rendered page.

[0091] In this embodiment, the initial page content rendering time refers to the time from when the page starts loading until any content on the page is rendered; the maximum page content rendering time refers to the time from when the page starts loading until the largest text block or image element on the page is rendered.

[0092] In this embodiment, there are no restrictions on page performance metrics, including but not limited to the time taken to render the first page content, the maximum time taken to render the maximum page content, and the time taken to complete the first interaction. The type of page can be determined by a combination of multiple page performance metrics.

[0093] In this embodiment, the page performance evaluation value refers to the time taken for the pre-rendered page to complete the rendering of the maximum page content from the first rendering of the page content. It reflects the overall rendering performance of the page. Combined with other page performance indicators, the page type to which the page belongs can be inferred according to the page type judgment rules.

[0094] 204. Determine the page type of the pre-rendered page based on the page performance evaluation value and the preset page type judgment rules;

[0095] In this embodiment, the page type refers to static pages and dynamic pages, and the page type determination rule is formulated based on the page performance indicators of static pages and dynamic pages.

[0096] Optionally, in one embodiment, step 204 above further includes:

[0097] Compare the page performance evaluation value with the preset first performance threshold;

[0098] If the page performance evaluation value is less than or equal to the first performance threshold, and the maximum page content rendering time is less than or equal to the preset second performance threshold, then the page type of the pre-rendered page is determined to be a static page.

[0099] If the page performance evaluation value is greater than the first performance threshold and the maximum page content rendering time is greater than the second performance threshold, then the page type of the pre-rendered page is determined to be a dynamic page, wherein the first performance threshold is less than the second performance threshold.

[0100] In this optional implementation, the first performance threshold is determined based on the data range of the difference between two page performance metrics: the maximum page content rendering time and the initial page content rendering time. Since the rendering time is shorter when the page is static, the page type is more likely to be static when the page performance evaluation value is less than the first performance threshold.

[0101] In this optional embodiment, the second performance threshold is a threshold determined based on the statistical range of the maximum page content rendering time. Since the maximum page content rendering time is shorter and within a certain range when the page is static, while it is longer for dynamic pages, the page type is more likely to be a static page when the page performance evaluation value is less than the second performance threshold.

[0102] Optionally, in one embodiment, the method for generating the first screen of a page further includes:

[0103] At preset intervals, obtain historical page performance metrics collected within the preset statistical period;

[0104] Cluster analysis was performed on the historical page performance metrics to obtain the performance metrics clusters of static pages and the performance metrics clusters of dynamic pages.

[0105] The performance metrics of each page in the static and dynamic pages are clustered and statistically analyzed to obtain the third and fourth performance thresholds.

[0106] The first performance threshold and the second performance threshold are updated respectively using the third performance threshold and the fourth performance threshold.

[0107] In this optional embodiment, the preset interval is the time interval for updating performance indicator data. The interval is not limited to one day, one week, or one month.

[0108] In this optional embodiment, the preset statistical duration refers to the time period for collecting historical page performance indicators, and all page performance indicators collected within this time period are obtained, including but not limited to one hour, one day, one week, and one month.

[0109] In this optional embodiment, cluster analysis is a statistical analysis technique that divides research objects into relatively homogeneous clusters. Objects within a cluster are similar to each other, while objects in different clusters are different or have low correlation.

[0110] In this optional embodiment, statistics refer to taking the average value of the index values ​​of the page performance index clusters to determine the center of the fluctuation range of the page performance index values ​​of static pages or dynamic pages, and then calculating the square root of the sum of the squares of the differences between each historical page performance index and the average value as the fluctuation range of the page performance index value, thereby determining the threshold of the page performance index of static pages or the threshold of the page performance index of dynamic pages.

[0111] In this optional embodiment, the third performance threshold is a threshold value representing the difference between two page performance metrics: the maximum page content rendering time and the initial page content rendering time for a static page; the fourth performance threshold is a threshold value representing the maximum page content rendering time for a static page. Other page performance metrics, such as visual stability metrics, can also be calculated to assist in the judgment.

[0112] 205. Based on the page type of the pre-rendered page, determine the first screen generation strategy, and generate the first screen of the page based on the first screen generation strategy.

[0113] Optionally, in one embodiment, step 205 further includes:

[0114] If the page type of the pre-rendered page is a static page, then the first screen of the page will be generated using pre-rendering technology.

[0115] The pre-rendered page result of the headless browser is retained, and the pre-rendered page result is used as the first screen of the page.

[0116] In this optional embodiment, the pre-rendering technology refers to pre-rendering the page using a headless browser. This pre-rendering of static pages does not require inserting a skeleton screen, and the generated pre-rendered result is used as the first screen of the page.

[0117] Optionally, in one embodiment, step 205 further includes:

[0118] If the page type of the pre-rendered page is a dynamic page, then the first screen of the page will be generated using skeleton screen technology.

[0119] Based on the page data, a skeleton screen is generated using a preset skeleton screen generation tool, and the skeleton screen is used as the first screen of the page.

[0120] In this optional embodiment, the skeleton screen is used to display the general structure of the page to the user before the page content is fully loaded and rendered. The skeleton screen is then replaced by the rendered content, providing a visual transition effect and reducing user anxiety while waiting for rendering. The skeleton screen technology is not limited, and includes, but is not limited to, using images as the skeleton screen, manually designing and maintaining the skeleton screen code, or generating the skeleton screen using a third-party skeleton screen generation tool.

[0121] This invention describes a method for determining page type and generating a corresponding first screen based on page performance metrics. It utilizes a page evaluation formula and page type determination rules derived from pre-analyzing page performance metrics of multiple pages to evaluate each page performance metric of a pre-rendered page and determine the page type. Based on the page type, a corresponding first screen is generated. This first screen generation method achieves efficient statistics, evaluation, and analysis of multiple page performance metrics. The combined use of multiple performance metrics for page type determination makes the differentiation of page types more accurate, improves the efficiency of first screen generation, and reduces the time cost of first screen development.

[0122] The page first screen generation method in the embodiments of the present invention has been described above. The page first screen generation apparatus in the embodiments of the present invention is described below. Please refer to [link / reference]. Figure 3 One embodiment of the page first screen generation device in this invention includes:

[0123] The pre-rendering module 301 is used to inject pre-set page data and metric collection SDK into the headless browser when building the page, and wake up the headless browser to perform page pre-rendering.

[0124] The metrics collection module 302 is used to obtain one or more page performance metrics collected by the SDK during page pre-rendering;

[0125] The page discrimination module 303 is used to determine the page type of the pre-rendered page based on the page performance indicators, wherein the page type includes static pages and dynamic pages;

[0126] The first screen generation module 304 is used to determine the first screen generation strategy based on the page type of the pre-rendered page, and generate the first screen of the page based on the first screen generation strategy.

[0127] This invention discloses a page first-screen generation device. The method first injects page data and a metrics collection SDK into a headless browser, collecting various page performance metrics during pre-rendering. Then, the page performance metrics are used to determine the page type, and a corresponding first screen is generated for that page type. This page first-screen generation method automatically distinguishes page types based on performance metrics, improving the efficiency of first-screen generation and reducing the time cost of first-screen development.

[0128] Please see Figure 4 Another embodiment of the page first screen generation device in this invention includes:

[0129] The pre-rendering module 301 is used to inject pre-set page data and metric collection SDK into the headless browser when building the page, and wake up the headless browser to perform page pre-rendering.

[0130] The metrics collection module 302 is used to obtain one or more page performance metrics collected by the SDK during page pre-rendering;

[0131] The page discrimination module 303 is used to determine the page type of the pre-rendered page based on the page performance indicators, wherein the page type includes static pages and dynamic pages;

[0132] The first screen generation module 304 is used to determine the first screen generation strategy based on the page type of the pre-rendered page, and generate the first screen of the page based on the first screen generation strategy.

[0133] Optionally, the page performance metrics include: initial page content rendering time and maximum page content rendering time;

[0134] The page performance evaluation formula is: P = YX;

[0135] Where P is the page performance evaluation value; X is the initial page content rendering time of the pre-rendered page; and Y is the maximum page content rendering time of the pre-rendered page.

[0136] Optionally, the page determination module 303 also includes:

[0137] The performance evaluation unit 3031 is used to substitute the page performance indicators into the preset page performance evaluation formula for calculation to obtain the page performance evaluation value of the pre-rendered page.

[0138] The type determination unit 3032 is used to determine the page type of the pre-rendered page based on the page performance evaluation value and the preset page type determination rules.

[0139] Optionally, the type determination unit 3032 is specifically used to compare the page performance evaluation value with the size of a preset first performance threshold;

[0140] If the page performance evaluation value is less than or equal to the first performance threshold, and the maximum page content rendering time is less than or equal to the preset second performance threshold, then the page type of the pre-rendered page is determined to be a static page.

[0141] If the page performance evaluation value is greater than the first performance threshold and the maximum page content rendering time is greater than the second performance threshold, then the page type of the pre-rendered page is determined to be a dynamic page, wherein the first performance threshold is less than the second performance threshold.

[0142] Optionally, the page first screen generation device also includes a statistical analysis module 300, specifically used for:

[0143] At preset intervals, obtain historical page performance metrics collected within the preset statistical period;

[0144] Cluster analysis was performed on the historical page performance metrics to obtain the performance metrics clusters of static pages and the performance metrics clusters of dynamic pages.

[0145] The performance metrics of each page in the static and dynamic pages are clustered and statistically analyzed to obtain the third and fourth performance thresholds.

[0146] The first performance threshold and the second performance threshold are updated respectively using the third performance threshold and the fourth performance threshold.

[0147] Optionally, the first screen generation module 304 also includes:

[0148] The static first screen generation unit 3041 is used to determine that the first screen of the page is generated using pre-rendering technology if the page type of the pre-rendered page is a static page.

[0149] The pre-rendered page result of the headless browser is retained, and the pre-rendered page result is used as the first screen of the page;

[0150] The dynamic first screen generation unit 3042 is used to determine that the first screen of the page is generated using skeleton screen technology if the page type of the pre-rendered page is a dynamic page.

[0151] Based on the page data, a skeleton screen is generated using a preset skeleton screen generation tool, and the skeleton screen is used as the first screen of the page.

[0152] This invention provides a first-screen generation device that determines page type based on page performance metrics. It utilizes page evaluation formulas and page type determination rules derived from pre-analyzing page performance metrics of multiple pages to evaluate various page performance metrics of a pre-rendered page and determine the page type. Based on the page type, a corresponding first screen is generated. This first-screen generation method achieves efficient statistics, evaluation, and analysis of multiple page performance metrics. The combined use of multiple performance metrics for page type determination makes the differentiation of page types more accurate, improves the efficiency of first-screen generation, and reduces the time cost of first-screen development.

[0153] above Figure 3 and Figure 4 The page first screen generation device in this embodiment of the invention will be described in detail from the perspective of modular functional entities. The electronic device in this embodiment of the invention will be described in detail from the perspective of hardware processing.

[0154] Figure 5 This is a schematic diagram of the structure of an electronic device 500 provided in an embodiment of the present invention. The electronic device 500 can vary significantly due to differences in configuration or performance, and may include one or more central processing units (CPUs) 510 (e.g., one or more processors) and a memory 520, and one or more storage media 530 (e.g., one or more mass storage devices) for storing application programs 533 or data 532. The memory 520 and storage media 530 can be temporary or persistent storage. The program stored in the storage media 530 may include one or more modules (not shown in the diagram), each module including a series of instruction operations on the electronic device 500. Furthermore, the processor 510 may be configured to communicate with the storage media 530 and execute the series of instruction operations in the storage media 530 on the electronic device 500.

[0155] Electronic device 500 may also include one or more power supplies 540, one or more wired or wireless network interfaces 550, one or more input / output interfaces 560, and / or one or more operating systems 531, such as Windows Server, Mac OS X, Unix, Linux, FreeBSD, etc. Those skilled in the art will understand that... Figure 5 The illustrated electronic device structure does not constitute a limitation on the electronic device and may include more or fewer components than illustrated, or combine certain components, or have different component arrangements.

[0156] The present invention also provides an electronic device, the electronic device including a memory and a processor, the memory storing computer-readable instructions, which, when executed by the processor, cause the processor to perform the steps of the page first screen generation method in the above embodiments.

[0157] The present invention also provides a computer-readable storage medium, which can be a non-volatile computer-readable storage medium or a volatile computer-readable storage medium, wherein the computer-readable storage medium stores instructions that, when the instructions are executed on a computer, cause the computer to perform the steps of the page first screen generation method.

[0158] Those skilled in the art will clearly understand that, for the sake of convenience and brevity, the specific working processes of the systems, devices, and units described above can be referred to the corresponding processes in the foregoing method embodiments, and will not be repeated here.

[0159] If the integrated unit is implemented as a software functional unit and sold or used as an independent product, it can be stored in a computer-readable storage medium. Based on this understanding, the technical solution of the present invention, in essence, or the part that contributes to the prior art, or all or part of the technical solution, can be embodied in the form of a software product. This computer software product is stored in a storage medium and includes several instructions to cause a computer device (which may be a personal computer, server, or network device, etc.) to execute all or part of the steps of the methods described in the various embodiments of the present invention. The aforementioned storage medium includes various media capable of storing program code, such as USB flash drives, portable hard drives, read-only memory (ROM), random access memory (RAM), magnetic disks, or optical disks.

[0160] The above-described embodiments are only used to illustrate the technical solutions of the present invention, and are not intended to limit it. Although the present invention has been described in detail with reference to the foregoing embodiments, those skilled in the art should understand that modifications can still be made to the technical solutions described in the foregoing embodiments, or equivalent substitutions can be made to some of the technical features. Such modifications or substitutions do not cause the essence of the corresponding technical solutions to deviate from the spirit and scope of the technical solutions of the embodiments of the present invention.

Claims

1. A method for generating the first screen of a webpage, characterized in that, The method for generating the first screen of the page includes: When building a page, inject a pre-built page data and metrics collection SDK into the headless browser and wake up the headless browser to pre-render the page. Obtain one or more page performance metrics collected by the SDK during page pre-rendering; Based on the page performance metrics, the page type of the pre-rendered page is determined, wherein the page type includes static pages and dynamic pages; the determination of the page type of the pre-rendered page based on the page performance metrics includes: substituting the page performance metrics into a preset page performance evaluation formula for calculation to obtain the page performance evaluation value of the pre-rendered page; and determining the page type of the pre-rendered page according to the page performance evaluation value and the preset page type judgment rules. Based on the page type of the pre-rendered page, a first-screen generation strategy is determined, and the first screen of the page is generated based on the first-screen generation strategy.

2. The method for generating the first screen of a page according to claim 1, characterized in that, The page performance metrics include: initial page content rendering time and maximum page content rendering time; The page performance evaluation formula is: P=YX; Where P is the page performance evaluation value; X is the initial page content rendering time of the pre-rendered page; and Y is the maximum page content rendering time of the pre-rendered page.

3. The method for generating the first screen of a page according to claim 2, characterized in that, The step of determining the page type of the pre-rendered page based on the page performance evaluation value and the preset page type judgment rule includes: Compare the page performance evaluation value with the preset first performance threshold; If the page performance evaluation value is less than or equal to the first performance threshold, and the maximum page content rendering time is less than or equal to the preset second performance threshold, then the page type of the pre-rendered page is determined to be a static page. If the page performance evaluation value is greater than the first performance threshold and the maximum page content rendering time is greater than the second performance threshold, then the page type of the pre-rendered page is determined to be a dynamic page, wherein the first performance threshold is less than the second performance threshold.

4. The method for generating the first screen of a page according to claim 3, characterized in that, The method for generating the first screen of a page also includes: At preset intervals, obtain historical page performance metrics collected within the preset statistical period; Cluster analysis was performed on the historical page performance metrics to obtain the performance metrics clusters of static pages and the performance metrics clusters of dynamic pages. The performance metrics of each page in the static and dynamic pages are clustered and statistically analyzed to obtain the third and fourth performance thresholds. The first performance threshold and the second performance threshold are updated respectively using the third performance threshold and the fourth performance threshold.

5. The method for generating the first screen of a page according to claim 1, characterized in that, The step of determining the first-screen generation strategy based on the page type of the pre-rendered page, and generating the first screen of the page based on the first-screen generation strategy, includes: If the page type of the pre-rendered page is a static page, then the first screen of the page will be generated using pre-rendering technology. The pre-rendered page result of the headless browser is retained, and the pre-rendered page result is used as the first screen of the page.

6. The method for generating the first screen of a page according to any one of claims 1-5, characterized in that, The step of determining the first-screen generation strategy based on the page type of the pre-rendered page, and generating the first screen of the page based on the first-screen generation strategy, includes: If the page type of the pre-rendered page is a dynamic page, then the first screen of the page will be generated using skeleton screen technology. Based on the page data, a skeleton screen is generated using a preset skeleton screen generation tool, and the skeleton screen is used as the first screen of the page.

7. A device for generating the first screen of a webpage, characterized in that, The page first screen generation device includes: The pre-rendering module is used to inject pre-set page data and metric collection SDKs into the headless browser when building the page, and wake up the headless browser to perform page pre-rendering. The metrics collection module is used to obtain one or more page performance metrics collected by the SDK during page pre-rendering; The page identification module is used to determine the page type of the pre-rendered page based on the page performance indicators, wherein the page type includes static pages and dynamic pages; The first screen generation module is used to determine the first screen generation strategy based on the page type of the pre-rendered page, and generate the first screen of the page based on the first screen generation strategy. The page discrimination module further includes: The performance evaluation unit is used to substitute the page performance indicators into the preset page performance evaluation formula for calculation to obtain the page performance evaluation value of the pre-rendered page. The type determination unit is used to determine the page type of the pre-rendered page based on the page performance evaluation value and the preset page type determination rules.

8. An electronic device, characterized in that, The electronic device includes: a memory and at least one processor, wherein the memory stores instructions: The at least one processor invokes the instructions in the memory to cause the first-screen generation device to execute the page first-screen generation method as described in any one of claims 1-6.

9. A computer-readable storage medium storing instructions thereon, characterized in that, When the instruction is executed by the processor, it implements the page first screen generation method as described in any one of claims 1-6.

Images