Page static product generation method and device, equipment and medium

Abstract

The invention belongs to the field of research and development, and relates to a page static product generation method which comprises the following steps: when a software project code version is released, generating a corresponding version number and sending the version number to a static middle table; when a user requests a software page through a browser, the static product is requested from the static medium table according to the version number. And if the static product of the corresponding version does not exist in the static middle table, the browser displays the rendered dynamic data as a first screen. When it is detected that the first-screen content is displayed completely and the user does not operate, the system automatically captures the first-screen content to generate a screenshot. The first screen screenshot can be used as a static product corresponding to the version number to be uploaded to a static middle table so as to be used by subsequent requests. The invention further provides a device, equipment and a medium. In addition, the invention also relates to a block chain technology, and the version number can be stored in a block chain. The method can be applied to platform pages of financial insurance, medical health management and the like, and efficient staticizing of the dynamic data page can be achieved.

Description

Technical Field

[0001] This application relates to the field of R & D technology, and particularly to a method, apparatus, device and medium for generating page static artifacts. Background Art

[0002] In the trend of user interface customization, dynamic data rendering technology has stood out and become the mainstream choice for page generation methods. This technology is characterized by its high flexibility and adaptability, and can accurately capture and meet the personalized needs of different users, bringing an unprecedented improvement to the user experience. For example, in the field of financial and insurance business, dynamic data rendering technology also demonstrates its powerful advantages. It can ensure the instant update of market dynamics, allowing users to keep abreast of the latest market information at any time. At the same time, the accurate reflection of user account information and the real-time presentation of transaction details also provide strong guarantees for the accuracy and timeliness of financial data. This makes financial transactions more transparent and fair, enhancing users' trust in financial platforms.

[0003] However, while dynamic data rendering technology brings many advantages, it also faces the challenge of achieving page staticization. Page staticization is crucial for improving page loading speed, optimizing search engine rankings, and reducing server load. To address this challenge, Server-Side Rendering (SSR) technology has emerged and become the most mainstream solution. By pre-generating page content on the server, SSR technology effectively improves the loading efficiency of pages and their friendliness to search engines. However, in high-concurrency access scenarios such as the financial and insurance business fields, the application of SSR technology has brought certain problems. Since the server needs to pre-generate a large amount of page content, this exacerbates the server's burden and may lead to performance bottlenecks. Once the server load increases sharply, the stability and availability of the service may be severely affected, which in turn has an adverse impact on user experience and business operations. Therefore, how to effectively staticize dynamic data pages without increasing the server's burden and properly solve the trade-off problem between dynamic rendering and staticization is an urgent problem to be solved. Summary of the Invention

[0004] The purpose of the embodiments of this application is to propose a method, apparatus, device and medium for generating page static artifacts, so as to achieve the efficient staticization of dynamic data pages without increasing the server's burden and properly handle the balance problem between dynamic rendering and staticization.

[0005] In the first aspect, a method for generating page static artifacts is provided, and the following technical solution is adopted:

[0006] When the code version of a software project is released, a version number corresponding to the code version is generated and sent to the static middle platform; when a user initiates a page request for the software project through a browser, a static product is requested from the static middle platform based on the version number; if the static middle platform does not have a static product corresponding to the version number, the rendered dynamic data is displayed on the browser page as the first screen content; when it is detected that the first screen content display is completed and the user has not operated the page, the first screen content is captured and a first screen screenshot is generated; the first screen screenshot is uploaded to the static middle platform as the static product corresponding to the version number for use when requesting static products.

[0007] In the second aspect, a device for generating static page products is provided, which adopts the following technical solution:

[0008] The version number generation module is used to generate the version number corresponding to the code version when the code version of the software project is released, and send the version number to the static middle platform;

[0009] The request module is used to request static products from the static middleware according to the version number when the user initiates a page request for the software project through the browser;

[0010] The display module is used to display the rendered dynamic data as the first screen content on the browser page if there is no static product corresponding to the version number in the static middle platform;

[0011] A module is used to capture the first screen content and generate a first screen screenshot when it is detected that the first screen content has been displayed and the user has not operated the page;

[0012] The upload module is used to upload the first screen screenshot as the static product corresponding to the version number to the static middle platform for use when requesting static products.

[0013] In a third aspect, a computer device is provided, including a memory and a processor, wherein the memory stores computer-readable instructions, and when the processor executes the computer-readable instructions, the steps of the method for generating static page products as described above are implemented.

[0014] In a fourth aspect, a computer-readable storage medium is provided, which stores computer-readable instructions. The computer-readable instructions can be executed by at least one processor to enable the at least one processor to perform the steps of the above-mentioned method for generating a static page product.

[0015] In the solution implemented by the above-mentioned method, device, equipment and medium for generating page static artifacts, by skillfully combining version control and the static middleware, the efficient staticization of dynamic data pages is effectively achieved. When a new version of a software project is released, the version number is immediately generated and sent to the static middleware, providing a basis for the subsequent management and invocation of static artifacts. When a user accesses a page, the system first attempts to obtain a static artifact that matches the version number from the static middleware. This mechanism greatly improves the page loading speed and optimizes the user experience. If the static artifact does not exist, the system flexibly displays the first-screen content rendered with dynamic data, and when the user does not operate the page, it intelligently captures a screenshot of the first screen and uploads it to the static middleware as a static artifact. This process not only avoids the server burden caused by pre-generating a large number of static artifacts but also ensures the timeliness and accuracy of static artifacts. This solution not only fully utilizes the flexibility of dynamic data rendering but also effectively achieves the staticization of pages, properly solving the trade-off problem between dynamic rendering and staticization. Especially in high-concurrency access scenarios, it significantly improves the stability and availability of the service. Brief Description of the Drawings

[0016] To more clearly illustrate the solution in this application, the following will give a brief introduction to the drawings required for the description of the embodiments of this application. Obviously, the drawings below are some embodiments of this application. For those of ordinary skill in the art, without creative efforts, other drawings can also be obtained based on these drawings.

[0017] Figure 1 is an exemplary system architecture diagram to which this application can be applied;

[0018] Figure 2 is a schematic flowchart of a method for generating page static artifacts provided by this application;

[0019] Figure 3 is a schematic structural diagram of a device for generating page static artifacts provided by this application;

[0020] Figure 4 is a schematic structural diagram of a computer device provided by this application. Detailed Embodiments

[0021] Unless otherwise defined, all technical and scientific terms used herein have the same meaning as commonly understood by one of ordinary skill in the technical field to which this application belongs; the terms used in the specification of this application are only for the purpose of describing specific embodiments and are not intended to limit this application; the terms "including" and "having" and any variations thereof in the specification and claims of this application and the above drawings are intended to cover non-exclusive inclusion. The terms "first", "second", etc. in the specification and claims of this application or the above drawings are used to distinguish different objects and not to describe a specific order.

[0022] Reference herein to "embodiments" means that a particular feature, structure, or characteristic described in connection with the embodiments can be included in at least one embodiment of the application. The phrase appears in various places in the specification and is not necessarily referring to the same embodiment, nor is it an independent or alternative embodiment mutually exclusive of other embodiments. Those skilled in the art will explicitly and implicitly understand that the embodiments described herein can be combined with other embodiments.

[0023] To enable those skilled in the technical field to better understand the solutions of this application, the technical solutions in the embodiments of this application will be clearly and completely described below with reference to the accompanying drawings.

[0024] As Figure 1 shown, the system architecture 100 may include a terminal device 101, a network 102, and a server 103. The terminal device 101 may be a laptop computer 1011, a tablet computer 1012, or a mobile phone 1013. The network 102 is used to provide a medium for a communication link between the terminal device 101 and the server 103. The network 102 may include various connection types, such as wired, wireless communication links, or fiber optic cables, etc.

[0025] A user may use the terminal device 101 to interact with the server 103 via the network 102 to receive or send messages, etc. Various communication client applications may be installed on the terminal device 101, such as a web browser application, a shopping application, a search application, an instant messaging tool, an email client, a social platform software, etc.

[0026] The terminal device 101 can be various electronic devices with a display screen and supporting web browsing. In addition to the laptop 1011, tablet 1012, or mobile phone 1013, the terminal device 101 can also be an e-book reader, an MP3 player (Moving Picture Experts Group Audio Layer III), an MP4 (Moving Picture Experts Group Audio Layer IV) player, a laptop computer, a desktop computer, and the like.

[0027] The server 103 can be a server that provides various services. For example, it can be a background server that supports the pages displayed on the terminal device 101.

[0028] It should be noted that the page static artifact generation method provided by the embodiments of the present application is generally executed by the server. Correspondingly, the page static artifact generation device is generally set in the server.

[0029] It should be understood that Figure 1 the numbers of the terminal devices, networks, and servers in

[0030] Continuing to refer to Figure 2 , a flowchart of an embodiment of the page static artifact generation method according to the present application is shown. The page static artifact generation method includes the following steps:

[0031] Step S201: When the code version of a software project is released, generate a version number corresponding to the code version and send the version number to the static middleware platform.

[0032] Wherein, a software project refers to the general term of a series of computer software systems developed, tested, deployed, and maintained according to specific requirements and goals. It usually includes resources such as source code, documents, and configuration files for implementing specific functions or services. For example, a non-vehicle insurance platform constitutes a software project, which integrates a software system with a series of functions such as policy management, premium calculation, customer information management, claim settlement processing, and market analysis. Another example is an online medical diagnosis and treatment platform, which is a software project that includes a software system for functions such as patient information display, medical report generation, and online interaction.

[0033] Among them, the code version refers to a set of codes in a specific state after a series of modifications, updates or optimizations during the development of a software project. Each code version represents the implementation status of a software project at a certain point in time. A corresponding version number is generated for each code version released. For example, during the software development process, the development team may release different versions of code such as v1.0 and v2.0 to reflect the iteration and upgrade of software functions.

[0034] The version number is an identifier used to uniquely identify the code version, usually consisting of numbers, letters, or a combination of them. The version number is used to distinguish different code versions for easy management and tracking. For example, the version number "v1.2.3" represents the code of the first major version, the second minor version, and the third revision of a software project.

[0035] Among them, the static middle platform refers to a service platform for storing, managing and providing static products (such as page screenshots, pre-rendered pages, etc.). As an intermediate layer, it connects the front-end application and the back-end service to improve the page loading speed and user experience. For example, the static middle platform can store page screenshots with different version numbers. When the front-end application requests, the static middle platform provides the corresponding static products according to the version number.

[0036] Step S202, when the user initiates a page request for the software project through the browser, the static product is requested from the static middleware according to the version number.

[0037] A page request refers to a request initiated by a user to a server through a browser or other client to obtain page content. A page request may include information such as a URL, a request header, and request parameters. For example, when a user enters the URL of a non-auto insurance platform in a browser and presses the Enter key, the browser will initiate a page request to the server to obtain the insurance details page content corresponding to the URL.

[0038] Among them, static artifacts refer to static resources such as page content or screenshots stored in the static middle platform. They do not require dynamic rendering by the server and can be directly provided to users to improve page loading speed. For example, a screenshot of the homepage of an e-commerce website, a financial insurance platform (such as a vehicle insurance platform, a non-vehicle insurance platform, etc.), or a medical health management platform can be used as a static artifact. When a user requests the homepage, the server can directly provide the screenshot without dynamically rendering the homepage content.

[0039] Step S203: If there is no static product corresponding to the version number in the static middle platform, the rendered dynamic data is displayed on the browser page as the first screen content.

[0040] Among them, the rendered dynamic data refers to the page content dynamically generated by the server based on user requests and real-time data. After this content is rendered on the server side, it is sent to the user's browser for display. For example, when a user logs in to an online non-vehicle insurance platform or a healthcare management platform, the server will dynamically generate the user's home page content based on the user information and platform data, and this content is the rendered dynamic data.

[0041] Among them, the first-screen content refers to the content area that users first see when opening a page. The first-screen content is crucial for the user experience and the page loading speed. For example, on a news website, the first-screen content may include the website's logo, navigation bar, headline news titles, and pictures, etc.

[0042] Step S204, when it is detected that the first-screen content is completely displayed and the user has not operated the page, capture the first-screen content to generate a first-screen screenshot.

[0043] In one embodiment, it is possible to detect whether the first-screen content is fully loaded and displayed in the user's browser through technical means (such as browser event listening, page loading monitoring, etc.). For example, when a user opens a web page of a non-vehicle insurance platform, the browser can detect that the first-screen content is completely displayed by listening to the DOMContentLoaded event.

[0044] Among them, the user not operating the page refers to the state where no interactive operations such as clicking, inputting, or scrolling are performed after the page is loaded. This state is usually used to determine whether the page is stable for subsequent processing (such as capturing the first-screen screenshot).

[0045] Among them, capturing refers to the process of obtaining the image or data of a page or a part of the page through technical means (such as screenshot tools, browser APIs, etc.). It is used to generate static artifacts. For example, when the system detects that the first-screen content is completely displayed and the user has not operated the page, it can capture the screenshot of the first-screen content as a static artifact.

[0046] Among them, the first-screen screenshot refers to the image file generated after capturing the first-screen content. For example, in a non-vehicle insurance platform, the system can capture the first-screen content of the home page of the non-vehicle insurance platform to generate a screenshot, and provide this screenshot as a static artifact to users subsequently.

[0047] Step S205, upload the first-screen screenshot to the static middleware as the static artifact corresponding to the version number for use when requesting static artifacts.

[0048] In one embodiment, the captured first screen screenshot is associated with the corresponding version number and uploaded to the static middle station for storage and management. When other users request a page with the same version number, the static middle station can provide the screenshot as a static product. For example: When the system captures a first screen screenshot of version v1.2.3, it will upload the screenshot to the static middle station and associate it with the version number v1.2.3. When other users request a page of version v1.2.3, the static middle station will provide the screenshot as a static product.

[0049] The embodiment of the present application can effectively realize the efficient staticization of dynamic data pages by cleverly combining version control and static middle platform. When a software project releases a new version, the version number is generated and sent to the static middle platform in real time, which provides a basis for the management and call of subsequent static products. When a user accesses a page, he first tries to obtain a static product that matches the version number from the static middle platform. This mechanism greatly improves the page loading speed and optimizes the user experience. If the static product does not exist, the first screen content of the dynamic data rendering is flexibly displayed, and when the user does not operate the page, the first screen screenshot is intelligently captured and uploaded to the static middle platform as a static product. This process not only avoids the server burden caused by pre-generating a large number of static products, but also ensures the real-time and accuracy of static products. This solution not only makes full use of the flexibility of dynamic data rendering, but also effectively realizes the staticization of the page, properly solves the trade-off between dynamic rendering and staticization, especially in high concurrent access scenarios, significantly improving the stability and availability of the service.

[0050] In some optional implementations of this embodiment, step S202, when a user initiates a page request for a software project through a browser, a static product is requested from a static middleware according to a version number, specifically including the following steps:

[0051] The version number is embedded in the code of the code version; when the user initiates a page request for the software project through the browser, the version number is parsed from the code of the code version; based on the parsed version number, the static product is requested from the static middleware.

[0052] Embedding refers to the process of inserting the version number into the code of the code version. For example, embedding version number information in the code of a software project so that different versions of the code can be identified and tracked in subsequent processes.

[0053] Parsing refers to the process of extracting, identifying and understanding the version number embedded in the code. For example, when a user requests a page, the system can parse the version number information from the code version so as to request the corresponding static artifact from the static middleware according to the version number.

[0054] In one example, in the field of financial insurance, take an online non-auto insurance platform as an example. When the code version of the platform is released, the system will automatically generate a unique version number and embed this version number into the code of the non-auto insurance platform. When a user accesses the non-auto insurance platform through a browser to view the insurance details, the browser will parse the version number and request a static artifact (such as a screenshot of the insurance details page) with the corresponding version number from the static middle station. If the static artifact exists in the static middle station, it will be displayed directly to the user, greatly improving the page loading speed and user experience.

[0055] In one example, in the field of medical and health management, take an online medical consultation platform as an example. When the code version of the platform is released, the system will automatically generate a unique version number and embed this version number into the platform's code. Specifically, the version number can be embedded in the meta tag of an HTML page, or as part of a JavaScript variable. In this way, when a user accesses the platform through a browser, the browser's script will first parse out the version number embedded in the code. After parsing the version number, the browser will initiate a request to the static middle station, requesting the static artifact corresponding to the version number. If the static middle station has a static artifact with this version number (such as a pre-rendered screenshot of the homepage), it will be returned directly to the browser for display. In this way, users can quickly see the first screen content of the page without waiting for the server to dynamically render.

[0056] The embodiment of the present application provides accurate identification for subsequent static product requests by embedding the version number into the code of the code version. When a user initiates a page request for a software project through a browser, the system can quickly parse the embedded version number from the code, realize the automatic extraction of version information, and do not require manual intervention, greatly improving efficiency. Based on the parsed version number, the system can accurately request the corresponding version of the static product from the static middle station. The consistency of the page content requested by the user and the code version is ensured, avoiding display errors or data confusion caused by version mismatch. At the same time, providing static products through the static middle station effectively reduces the dynamic rendering burden of the server, especially in high-concurrency access scenarios, such as medical emergencies or financial market fluctuations, which can significantly improve the loading speed of the page and ensure the stability and availability of the service.

[0057] In some optional implementations of this embodiment, in step S204, when it is detected that the display of the first screen content is completed and the user has not operated the page, the first screen content is captured, and before the first screen screenshot is generated, the following steps are specifically included:

[0058] Calculate the height of the elements within the viewport of the page; obtain a preset height threshold, and compare the height of the elements within the viewport with the height threshold; if the height of the elements within the viewport reaches the height threshold, it is determined that the display of the first-screen content is completed; if no mouse event, keyboard event, or scroll event is detected, it is determined that the user has not operated the page.

[0059] Among them, the height of the elements within the viewport refers to the vertical dimension of the web page elements displayed within the browser viewport (i.e., the visible area). This height value represents the height range of the page content that the user can directly see under the current viewport. It is used to determine whether the display of the first-screen content of the page is complete and is an important basis for judging whether the first-screen content has been loaded completely. For example, in a news website, the height of the elements within the viewport may include the height of the title, lead, and part of the body content.

[0060] Among them, the height threshold is a preset value used as the boundary for judging whether the height of the elements within the viewport reaches the complete display standard. This threshold represents the minimum height required for the first-screen content of the page to be considered loaded completely. During the web page loading process, when the height of the elements within the viewport reaches or exceeds this threshold, it can be determined that the first-screen content has been displayed completely. For example, the height threshold can be set to 80% of the browser viewport height to ensure that the user can see enough page content.

[0061] Among them, the mouse event refers to the event triggered when the user operates the mouse on the web page, such as click, double-click, move, hover, etc. These events represent the user's mouse interaction behavior.

[0062] Among them, the keyboard event refers to the event triggered when the user operates the keyboard on the web page, such as key press, key release, etc.

[0063] Among them, the scroll event refers to the event triggered when the user performs a scroll operation on the web page, such as when the scroll bar of a form or page is moved.

[0064] In one example, when the code version of a software project is released, the system generates a corresponding version number and sends it to the static middle station. When a user initiates a page request for the software project through a browser, the system first requests the corresponding static artifact from the static middle station according to the version number. If the static middle station does not have a static artifact corresponding to the version number, the browser will render and display the dynamic data as the first screen content. Next, the system starts to calculate the height of the elements in the page viewport. This calculation process is usually implemented through front-end technologies such as JavaScript. By traversing all elements in the viewport and accumulating their height values, the total height of the elements in the viewport is obtained. At the same time, the system pre-sets a height threshold, which is set according to the actual situation of the page design and user experience requirements. For example, in a news website, the height threshold can be set to the minimum height required to fully display the news title, introduction and part of the text content. The system compares the calculated height of the elements in the viewport with the preset height threshold. If the height of the elements in the viewport reaches or exceeds the height threshold, it is determined that the first screen content has been fully displayed. In addition, the system also monitors user interaction events, including mouse events, keyboard events, and scrolling events. If these events are not monitored within a certain period of time, it is determined that the user has not operated the page. For example, the system can set a timer. If no user interaction event is received before the timer times out, it is considered that the user has not operated the page. Through the implementation of the above solution, the system can accurately determine whether the content of the first screen is displayed completely and whether the user has operated the page.

[0065] The embodiment of the present application can accurately judge the completion status of the first screen content display by calculating the height of the elements in the viewport of the page and comparing it with the preset height threshold. This process fully takes into account the diversity of page layouts and the differences in user devices, ensuring that the loading status of the first screen content can be accurately identified in different environments. At the same time, combined with the monitoring of user mouse events, keyboard events, and scrolling events, the system can intelligently determine whether the user has operated the page, thereby avoiding the erroneous generation of first screen screenshots when the user is interacting with the page. This design not only improves the accuracy of static processing, but also optimizes the user experience, ensuring that the generation of static products does not interfere with the normal operation of the user.

[0066] In some optional implementations of this embodiment, step S204, capturing the first screen content to generate a first screen screenshot, specifically includes the following steps:

[0067] Call the webpage screenshot library, use the webpage screenshot library, select specific elements in the first screen content; render the specific elements into a canvas, and generate a first screen screenshot from the canvas.

[0068] Among them, the web page screenshot library is a library or toolkit that provides web page screenshot functions. It contains a series of APIs or functions for capturing web page content, which is used to achieve automated screenshots of web page content. For example, in a scenario of logging in to a non-vehicle insurance platform, the web page screenshot library can be used to capture the current state of the web page as a static artifact corresponding to the code version of the non-vehicle insurance platform at this time, which is used in subsequent page requests to optimize the loading speed and user experience.

[0069] Among them, specific elements refer to elements in the web page that need to be specially processed or captured, such as a specific DIV block, image, or table, etc., which are used to achieve precise web page screenshots or content extraction.

[0070] Among them, the Canvas is an area for drawing graphics on the web page. It provides a two-dimensional drawing context that allows programs to draw various shapes, images, and texts on the canvas through scripting languages such as JavaScript. It is used to render specific elements as images for generating the first-screen screenshot.

[0071] In one example, the web page screenshot library is called, and using the functions of the web page screenshot library, specific elements in the first-screen content are selected. These specific elements can include the page title, main image, key text information, etc., which constitute the core part of the first-screen content. By precisely selecting these elements, the system can ensure the accuracy and integrity of the screenshot. Subsequently, the system renders the selected specific elements as a canvas. Specifically, the elements can be extracted from the DOM tree of the web page and redrawn according to their layout and style in the page. The rendered canvas contains the visual representation of the first-screen content and can be used to generate a screenshot. Finally, the system generates the first-screen screenshot from the canvas and uploads it as a static artifact corresponding to the version number to the static middleware platform. In this way, when other users request the same version of the page subsequently, the system can directly obtain the screenshot from the static middleware platform, thereby improving the page loading speed and response efficiency.

[0072] The embodiments of this application can achieve precise capture of the first-screen content by calling the web page screenshot library, significantly improving the efficiency and accuracy of page staticization. Specifically, the web page screenshot library provides powerful functions that allow the system to select specific elements in the first-screen content for screenshotting, rather than simply capturing the entire page, thus avoiding unnecessary resource waste. After selecting the specific elements, the system renders them as a canvas, which ensures that the visual effect of the screenshot is consistent with the original page, improving the authenticity and usability of the screenshot. Finally, the first-screen screenshot generated from the canvas can be effectively stored and reused as a static artifact. This design not only reduces the burden on the server and avoids performance bottlenecks in high-concurrency access scenarios but also improves the page loading speed and user experience.

[0073] In some optional implementations of this embodiment, in step S202, when a user initiates a page request for a software project through a browser, after requesting a static product from the static middleware according to the version number, the following steps are specifically included:

[0074] If there is a static product corresponding to the version number in the static middle platform, the static product is obtained from the static middle platform; the static product is displayed on the browser page as the first screen content.

[0075] In one example, when a user initiates a page request for a software project through a browser, the system will first initiate a request for a static product to the static middle station based on the version number information in the request. In this process, the system will query whether there is a static product corresponding to the version number in the static middle station. If the static middle station does have a static product corresponding to the version number, the system will obtain the static product from the static middle station. This acquisition process involves retrieving static files that match the version number from the storage system of the static middle station. After obtaining the static product, the system will display the static product as the first screen content in the browser page. This ensures that users can quickly see the main content of the page without waiting for the server to dynamically render the page. The page loading speed and response efficiency are significantly improved. For example, taking a non-auto insurance platform as an example, when the non-auto insurance platform releases a new version, the system will generate the corresponding version number and send the version number to the static middle station. When a user visits the website, the system will obtain the corresponding static product from the static middle station according to the version number and quickly display it in the browser. This method not only improves the user's browsing experience, but also reduces the burden on the server.

[0076] The embodiment of the present application can effectively realize the static processing of dynamic data pages by judging whether there is a static product corresponding to the requested version number in the static middle station, and determine the acquisition and display method of the page content accordingly, while taking into account the optimization of the server load. Specifically, when there is a static product with a corresponding version number in the static middle station, the system directly obtains these pre-generated page contents from the static middle station without the need for real-time dynamic rendering by the server. The computing pressure of the server is greatly reduced, especially in high-concurrency access scenarios, such as medical emergencies or periods of financial market fluctuations, which can effectively avoid the occurrence of server performance bottlenecks and ensure the stability and availability of the service. At the same time, displaying the static product as the first screen content in the browser significantly improves the loading speed of the page and optimizes the user experience.

[0077] In some optional implementations of this embodiment, after the step of "displaying the static product as the first screen content on the browser page", the following steps are specifically included:

[0078] Get the dynamic data of the page and render the dynamic data; after the dynamic data is rendered, replace the static product of the first screen content with the rendered dynamic data.

[0079] The dynamic data of a page refers to the data that is generated or changed in real time during the operation of a software project based on user interaction, system status changes, or external data source updates. It is dynamically acquired and processed by the server when a user requests a page. The dynamic data of a page represents the real-time information and content of the page.

[0080] In one example, if there is a static artifact corresponding to the version number in the static middle station, the static artifact will be obtained from the static middle station. The static artifact may include resources such as HTML files, CSS style sheets, JavaScript scripts, and images. After obtaining the static artifact, the system will quickly display these static contents as the first screen content in the browser page to ensure that users can quickly see the main structure and basic information of the page, such as insurance product lists, navigation bars, promotional banners, etc. Subsequently, the system will start to obtain dynamic data of the page. These dynamic data can come from databases, external APIs, or user interactions. After obtaining the dynamic data, the system will render it and generate page content containing the latest data. For example, taking the non-auto insurance platform as an example, the first screen content can display a static version list of insurance products. After the system obtains dynamic data such as the user's personal information, insurance history, risk assessment results, etc., it will render these data to generate an insurance product list containing information such as user personalized insurance recommendations, real-time premium calculations, and customized insurance plans. After the dynamic data rendering is completed, the system will replace the static products in the first screen content with the rendered dynamic data, so that users can see the most accurate and real-time insurance information, improving user experience and decision-making efficiency.

[0081] The embodiment of the present application immediately obtains the dynamic data of the page and renders it after the first screen content is displayed. In this process, the server does not need to generate the entire page immediately when the user requests it, thereby reducing the burden on the server. After the dynamic data rendering is completed, the static product of the first screen is replaced with the rendered dynamic data, ensuring the real-time and accuracy of the page information.

[0082] In some optional implementations of this embodiment, in step S205, when the user initiates a page request for the software project through a browser, after requesting the static product from the static middleware according to the version number, the following steps are specifically included:

[0083] If the static product fails to load or the dynamic data of the page has been rendered but the static product has not been loaded, the rendered dynamic data will be displayed.

[0084] In one example, during the development and operation of a software project, whenever a code version is released, the system automatically generates a unique version number and synchronizes this version number to the static middleware platform. As the center for storing and managing static artifacts, the static middleware platform is responsible for providing the corresponding page static content based on the version number. When a user initiates a page request for the software project through a browser, the system first requests the corresponding static artifact from the static middleware platform according to the version number in the request. However, in the actual network environment, due to various reasons (such as network latency, static middleware platform failure, etc.), the loading of the static artifact may fail. In addition, there is also a situation where the dynamic data of the page has been rendered, but the static artifact has not been fully loaded. For the above two situations, the following processing strategies can be adopted: If the static artifact loading fails or the dynamic data has been rendered while the static artifact has not been loaded completely, the system directly displays the rendered dynamic data. For example, taking a non-vehicle insurance platform as an example, when a user requests the insurance product details page, the system first attempts to load the static artifacts of this page (such as insurance product pictures, description information, terms content, etc.). If the static artifact loading fails or the loading speed is too slow, and the system's backend has already rendered the dynamic data such as the real-time price of the insurance product, the insurable range, and personalized recommendations for the user according to the user request, the system will immediately display this rendered dynamic data without waiting for the static artifact to be loaded. Through the above solution, the system effectively improves the page response speed and user experience. Even in the case of poor network conditions or static middleware platform failures, users can quickly see the main content of the page, especially those dynamic data with high real-time requirements. At the same time, this design also reduces the system's dependence on static artifacts and improves the system's robustness and availability.

[0085] The embodiments of this application can effectively solve the trade-off problem between dynamic data rendering and page staticization through ingenious design, especially when there are abnormalities in the loading of static artifacts. When a user initiates a page request, the system requests the corresponding static artifact from the static middleware platform according to the version number. If the static artifact loading fails, or the dynamic data of the page has been rendered while the static artifact has not been fully loaded, the system flexibly displays the rendered dynamic data. This avoids page latency caused by waiting for the static artifact to be loaded and ensures that users can quickly see the latest page content. At the same time, this design also reduces the burden on the server because the server does not need to regenerate the page content when the static artifact loading fails.

[0086] It should be emphasized that to further ensure the above version number, first-screen screenshot, and dynamic data, the above version number, first-screen screenshot, and dynamic data can also be stored in a node of a blockchain.

[0087] The blockchain referred to in this application is a new application mode of computer technologies such as distributed data storage, peer-to-peer transmission, consensus mechanism, and encryption algorithms. Blockchain, in essence, is a decentralized database, a series of data blocks generated by using cryptographic methods. Each data block contains information about a batch of network transactions, which is used to verify the validity of the information (anti-counterfeiting) and generate the next block. The blockchain can include the blockchain underlying platform, the platform product service layer, and the application service layer, etc.

[0088] Those of ordinary skill in the art can understand that all or part of the processes in the methods of the above embodiments can be completed by instructing relevant hardware through computer-readable instructions. These computer-readable instructions can be stored in a computer-readable storage medium. When the program is executed, it can include the processes of the embodiments of the above methods. Among them, the aforementioned storage medium can be a non-volatile storage medium such as a magnetic disk, an optical disc, a Read-Only Memory (ROM), etc., or a Random Access Memory (RAM), etc.

[0089] It should be understood that although the steps in the flowchart of the accompanying drawings are shown in sequence according to the arrows, these steps are not necessarily executed in the order indicated by the arrows. Unless there is a clear indication in this article, the execution of these steps has no strict order limit, and they can be executed in other orders. Moreover, at least a part of the steps in the flowchart of the accompanying drawings can include multiple sub-steps or multiple stages. These sub-steps or stages are not necessarily executed at the same moment, but can be executed at different moments, and their execution order is not necessarily sequential, but can be executed alternately or in turn with at least a part of other steps or sub-steps or stages of other steps.

[0090] Further reference Figure 3 to Figure 2 As an implementation of the method shown above, this application provides an embodiment of a page static artifact generation device. This device embodiment corresponds to the method embodiment shown Figure 2 above, and this device can be specifically applied to various electronic devices.

[0091] As Figure 3 shown, the page static artifact generation device 400 of this embodiment includes: a generation module 401, a request module 402, a display module 403, a capture module 404, and an upload module 405. Among them:

[0092] The generation module 401 is used to generate a version number corresponding to the code version when the code version of the software project is released, and send the version number to the static middle platform;

[0093] Request module 402, used to request static artifacts from the static middleware according to the version number when a user initiates a page request for a software project through a browser;

[0094] Display module 403 is used to display the rendered dynamic data as the first screen content on the browser page if there is no static product corresponding to the version number in the static middle platform;

[0095] The capture module 404 is used to capture the first screen content and generate a first screen screenshot when it is detected that the first screen content display is completed and the user does not operate the page;

[0096] The upload module 405 is used to upload the first screen screenshot as a static product corresponding to the version number to the static middle platform for use when requesting the static product.

[0097] The embodiment of the present application can effectively realize the efficient staticization of dynamic data pages by cleverly combining version control and static middle platform. When a software project releases a new version, the version number is generated and sent to the static middle platform in real time, which provides a basis for the management and call of subsequent static products. When a user accesses a page, he first tries to obtain a static product that matches the version number from the static middle platform. This mechanism greatly improves the page loading speed and optimizes the user experience. If the static product does not exist, the first screen content of the dynamic data rendering is flexibly displayed, and when the user does not operate the page, the first screen screenshot is intelligently captured and uploaded to the static middle platform as a static product. This process not only avoids the server burden caused by pre-generating a large number of static products, but also ensures the real-time and accuracy of static products. This solution not only makes full use of the flexibility of dynamic data rendering, but also effectively realizes the staticization of the page, properly solves the trade-off between dynamic rendering and staticization, especially in high concurrent access scenarios, significantly improving the stability and availability of the service.

[0098] In one embodiment, the request module 402 includes:

[0099] Embed submodules to embed version numbers into the code of the code version;

[0100] The parsing submodule is used to parse the version number from the code of the code version when the user initiates a page request for the software project through the browser;

[0101] The request submodule is used to request static artifacts from the static middleware according to the parsed version number.

[0102] The embodiment of the present application provides accurate identification for subsequent static product requests by embedding the version number into the code of the code version. When a user initiates a page request for a software project through a browser, the system can quickly parse the embedded version number from the code, realize the automatic extraction of version information, and do not require manual intervention, greatly improving efficiency. Based on the parsed version number, the system can accurately request the corresponding version of the static product from the static middle station. The consistency of the page content requested by the user and the code version is ensured, avoiding display errors or data confusion caused by version mismatch. At the same time, providing static products through the static middle station effectively reduces the dynamic rendering burden of the server, especially in high-concurrency access scenarios, such as medical emergencies or financial market fluctuations, which can significantly improve the loading speed of the page and ensure the stability and availability of the service.

[0103] In one embodiment, the capture module 404 includes:

[0104] The calling submodule is used to call the webpage screenshot library, use the webpage screenshot library, and select specific elements in the first screen content;

[0105] The rendering submodule is used to render specific elements into a canvas and generate the first screenshot from the canvas.

[0106] The embodiment of the present application can realize the accurate capture of the first screen content by calling the web page screenshot library, which significantly improves the efficiency and accuracy of page staticization. Specifically, the web page screenshot library provides powerful functions, allowing the system to select specific elements in the first screen content for screenshots, rather than simply capturing the entire page, thereby avoiding unnecessary waste of resources. After selecting a specific element, the system renders it as a canvas. This process ensures that the visual effect of the screenshot is consistent with the original page, improving the authenticity and usability of the screenshot. Finally, the first screen screenshot generated from the canvas can be effectively stored and reused as a static product. This design not only reduces the burden on the server and avoids performance bottlenecks in high-concurrency access scenarios, but also improves the page loading speed and user experience.

[0107] In one embodiment, the static page product generating device 400 further includes:

[0108] The calculation module is used to calculate the height of the elements within the viewport of the page;

[0109] A comparison module is used to obtain a preset height threshold and compare the height of the element in the viewport with the height threshold;

[0110] The first determination module is used to determine that the display of the first screen content is completed if the height of the element in the viewport reaches the height threshold;

[0111] A second determination module, configured to determine that the user has not operated the page if no mouse event, keyboard event, or scrolling event is monitored.

[0112] In an embodiment of the present application, by calculating the height of the elements within the viewport of the page and comparing it with a preset height threshold, an accurate determination of the completion status of the first-screen content display is achieved. This process fully considers the diversity of page layouts and the differences in user devices, ensuring accurate identification of the loading status of the first-screen content in different environments. At the same time, by combining the monitoring of the user's mouse events, keyboard events, and scrolling events, the system can intelligently determine whether the user has operated the page, thus avoiding the incorrect generation of the first-screen screenshot when the user is interacting with the page. This design not only improves the accuracy of static processing but also optimizes the user experience, ensuring that the generation of static artifacts does not interfere with the normal operation of the user.

[0113] In an embodiment, the page static artifact generation device 400 further includes:

[0114] A first acquisition module, configured to obtain the static artifact from the static middleware if there is a static artifact corresponding to the version number in the static middleware;

[0115] A content display module, configured to display the static artifact in the browser page as the first-screen content.

[0116] In an embodiment of the present application, by determining whether there is a static artifact corresponding to the requested version number in the static middleware and accordingly deciding the acquisition and display methods of the page content, the static processing of the dynamic data page is effectively realized, while also taking into account the optimization of the server load. Specifically, when there is a static artifact corresponding to the version number in the static middleware, the system directly obtains these pre-generated page contents from the static middleware without the need for the server to perform real-time dynamic rendering. This greatly reduces the computational pressure on the server, especially in high-concurrency access scenarios such as medical emergencies or financial market fluctuations, effectively avoiding the occurrence of server performance bottlenecks and ensuring the stability and availability of the service. At the same time, displaying the static artifact as the first-screen content in the browser significantly improves the page loading speed and optimizes the user experience.

[0117] In an embodiment, the page static artifact generation device 400 further includes:

[0118] A second acquisition module, configured to obtain the dynamic data of the page and render the dynamic data;

[0119] A replacement module, configured to replace the static artifact of the first-screen content with the rendered dynamic data after the dynamic data rendering is completed.

[0120] After the first-screen content is displayed in the embodiment of the present application, the dynamic data of the page is immediately obtained and rendered. In this process, the server does not need to generate the entire page immediately when the user requests, thus reducing the burden on the server. After the dynamic data rendering is completed, the static artifacts of the first screen are replaced with the rendered dynamic data, ensuring the real-time and accuracy of the page information.

[0121] In one embodiment, the page static artifact generation device 400 further includes:

[0122] A data display module, configured to display the rendered dynamic data if the static artifact fails to load or the dynamic data of the page has been rendered but the static artifact has not been loaded yet.

[0123] The embodiment of the present application can effectively solve the trade-off problem between dynamic data rendering and page staticization through ingenious design, especially when the static artifact loading is abnormal. When the user initiates a page request, the system requests the corresponding static artifact from the static middle platform according to the version number. If the static artifact fails to load, or the dynamic data of the page has been rendered but the static artifact has not been loaded yet, the system flexibly displays the rendered dynamic data. This avoids page latency caused by waiting for the static artifact to load and ensures that users can quickly see the latest page content. At the same time, this design also reduces the burden on the server because the server does not need to regenerate the page content when the static artifact fails to load.

[0124] To solve the above technical problems, the embodiment of the present application also provides a computer device. For details, please refer to Figure 4 , Figure 4 which is the basic structural block diagram of the computer device in this embodiment.

[0125] The computer device 6 includes a memory 61, a processor 62, and a network interface 63 that are communicatively connected to each other through a system bus. It should be noted that only the computer device 6 with a memory 61, a processor 62, and a network interface 63 is shown in the figure, but it should be understood that it is not required to implement all the shown components, and more or fewer components can be alternatively implemented. Among them, those skilled in the art of the present technology can understand that a computer device here is a device that can automatically perform numerical calculations and / or information processing according to pre-set or stored instructions, and its hardware includes but is not limited to microprocessors, application specific integrated circuits (ASICs), field-programmable gate arrays (FPGAs), digital signal processors (DSPs), embedded devices, etc.

[0126] The computer device can be a computing device such as a desktop computer, a notebook, a palm computer, and a cloud server. The computer device can interact with the user through a keyboard, a mouse, a remote control, a touchpad, or a voice control device.

[0127] The memory 61 includes at least one type of readable storage medium, and the readable storage medium includes flash memory, a hard disk, a multimedia card, a card-type memory (such as an SD or DX memory, etc.), a random access memory (RAM), a static random access memory (SRAM), a read-only memory (ROM), an electrically erasable programmable read-only memory (EEPROM), a programmable read-only memory (PROM), a magnetic memory, a magnetic disk, an optical disk, etc. In some embodiments, the memory 61 can be an internal storage unit of the computer device 6, such as the hard disk or memory of the computer device 6. In other embodiments, the memory 61 can also be an external storage device of the computer device 6, such as a plug-in hard disk, a SmartMedia Card (SMC), a Secure Digital (SD) card, a Flash Card, etc. equipped on the computer device 6. Of course, the memory 61 can also include both the internal storage unit and the external storage device of the computer device 6. In this embodiment, the memory 61 is generally used to store the operating system and various application software installed on the computer device 6, such as computer-readable instructions of the page static artifact generation method. In addition, the memory 61 can also be used to temporarily store various data that have been output or will be output.

[0128] In some embodiments, the processor 62 can be a central processing unit (CPU), a controller, a microcontroller, a microprocessor, or other data processing chips. The processor 62 is generally used to control the overall operation of the computer device 6. In this embodiment, the processor 62 is used to run the computer-readable instructions stored in the memory 61 or process data, such as running the computer-readable instructions of the page static artifact generation method.

[0129] The network interface 63 can include a wireless network interface or a wired network interface, and the network interface 63 is generally used to establish a communication connection between the computer device 6 and other electronic devices.

[0130] Embodiments of the present application can effectively achieve the efficient staticization of dynamic data pages by cleverly combining version control and a static middleware platform. When a new version of a software project is released, a version number is immediately generated and sent to the static middleware platform, providing a basis for the subsequent management and invocation of static artifacts. When a user accesses a page, the system first attempts to obtain a static artifact that matches the version number from the static middleware platform. This mechanism greatly improves the page loading speed and optimizes the user experience. If the static artifact does not exist, the system flexibly displays the first-screen content rendered by dynamic data, and when the user does not operate the page, it intelligently captures a screenshot of the first screen and uploads it to the static middleware platform as a static artifact. This process not only avoids the server burden caused by pre-generating a large number of static artifacts but also ensures the timeliness and accuracy of the static artifacts. This solution not only makes full use of the flexibility of dynamic data rendering but also effectively realizes the staticization of the page, properly solving the trade-off problem between dynamic rendering and staticization. Especially in high-concurrency access scenarios, it significantly improves the stability and availability of the service.

[0131] The present application also provides another implementation manner, that is, to provide a computer-readable storage medium storing computer-readable instructions that can be executed by at least one processor, so that at least one processor executes the steps of the page static artifact generation method as described above.

[0132] Embodiments of the present application can effectively achieve the efficient staticization of dynamic data pages by cleverly combining version control and a static middleware platform. When a new version of a software project is released, a version number is immediately generated and sent to the static middleware platform, providing a basis for the subsequent management and invocation of static artifacts. When a user accesses a page, the system first attempts to obtain a static artifact that matches the version number from the static middleware platform. This mechanism greatly improves the page loading speed and optimizes the user experience. If the static artifact does not exist, the system flexibly displays the first-screen content rendered by dynamic data, and when the user does not operate the page, it intelligently captures a screenshot of the first screen and uploads it to the static middleware platform as a static artifact. This process not only avoids the server burden caused by pre-generating a large number of static artifacts but also ensures the timeliness and accuracy of the static artifacts. This solution not only makes full use of the flexibility of dynamic data rendering but also effectively realizes the staticization of the page, properly solving the trade-off problem between dynamic rendering and staticization. Especially in high-concurrency access scenarios, it significantly improves the stability and availability of the service.

[0133] Through the description of the above embodiments, those skilled in the art can clearly understand that the methods of the above embodiments can be implemented by means of software plus a necessary general hardware platform. Of course, they can also be implemented by hardware, but in many cases, the former is a better implementation method. Based on such an understanding, the technical solution of the present application, in essence or the part that contributes to the prior art, can be embodied in the form of a software product. This computer software product is stored in a storage medium (such as ROM / RAM, magnetic disk, optical disc) and includes several instructions for causing a terminal device (which can be a mobile phone, computer, server, air conditioner, or network device, etc.) to execute the methods of the various embodiments of the present application.

[0134] Obviously, the above-described embodiments are only a part of the embodiments of the present application, rather than all of the embodiments. The accompanying drawings show the preferred embodiments of the present application, but do not limit the patent scope of the present application. The present application can be implemented in many different forms. On the contrary, the purpose of providing these embodiments is to make the understanding of the disclosed content of the present application more thorough and comprehensive. Although the present application has been described in detail with reference to the foregoing embodiments, for those skilled in the art, they can still modify the technical solutions described in the foregoing specific embodiments or perform equivalent replacements for some of the technical features. Any equivalent structure directly or indirectly using the content of the specification and drawings of the present application in other related technical fields is equally within the scope of the patent protection of the present application. The non-company enterprise software tools or components that appear in the embodiments of the present application are only for illustrative purposes and do not represent actual use.

Claims

1. A method for generating a static product of a page, characterized in that: The steps include: When the code version of the software project is released, a version number corresponding to the code version is generated and sent to the static middle platform; When a user initiates a page request for the software project through a browser, a static product is requested from the static middle platform according to the version number; If the static middle platform does not have a static product corresponding to the version number, the rendered dynamic data is displayed on the page of the browser as the first screen content; When it is detected that the display of the first screen content is completed and the user has not operated the page, the first screen content is captured to generate a first screen screenshot; The first screen shot is uploaded to the static middle platform as the static product corresponding to the version number for use when requesting the static product.

2. The method according to claim 1, characterized in that When the user initiates a page request for the software project through a browser, the step of requesting a static product from the static middle platform according to the version number specifically includes: embedding the version number into the code of the code version; When a user initiates a page request for the software project through a browser, the version number is parsed from the code of the code version; According to the parsed version number, a static product is requested from the static middle platform.

3. The method according to claim 1, characterized in that When it is detected that the display of the first screen content is complete and the user has not operated the page, before the step of capturing the first screen content and generating a first screen screenshot, the step specifically includes: Calculate the height of the element within the viewport of the page; Obtain a preset height threshold, and compare the height of the element in the viewport with the height threshold; If the height of the element in the viewport reaches the height threshold, it is determined that the display of the first screen content is completed; If no mouse events, keyboard events, and scrolling events are monitored, it is determined that the user has not operated the page.

4. The method according to claim 1, characterized in that The step of capturing the first screen content and generating a first screen screenshot specifically includes: Calling a webpage screenshot library, using the webpage screenshot library, and selecting a specific element in the first screen content; The specific element is rendered as a canvas, and a first screen shot is generated from the canvas.

5. The method according to claim 1, characterized in that After the step of requesting a static product from the static middle platform according to the version number when the user initiates a page request for the software project through a browser, the method further includes: If the static middle station has a static product corresponding to the version number, obtain the static product from the static middle station; The static product is displayed on the page of the browser as the first screen content.

6. The method according to claim 5, characterized in that After the step of displaying the static product as the first screen content on the page of the browser, the method further includes: Obtaining dynamic data of the page and rendering the dynamic data; After the dynamic data is rendered, the static product of the first screen content is replaced with the rendered dynamic data.

7. The method according to claim 1, characterized in that After the step of requesting a static product from the static middle platform according to the version number when the user initiates a page request for the software project through a browser, the method further includes: If the static product fails to load or the dynamic data of the page has been rendered but the static product has not been loaded, the rendered dynamic data is displayed.

8. A device for generating static page products, characterized in that: include: A generation module is used to generate a version number corresponding to the code version when the code version of the software project is released, and send the version number to the static middle platform; A request module, used for requesting a static product from the static middle platform according to the version number when a user initiates a page request for the software project through a browser; A display module, used to display the rendered dynamic data as the first screen content on the page of the browser if the static product corresponding to the version number does not exist in the static middle platform; A capture module, configured to capture the first screen content and generate a first screen screenshot when it is detected that the first screen content display is completed and the user has not operated the page; An upload module is used to upload the first screen screenshot as a static product corresponding to the version number to the static middle platform for use when requesting the static product.

9. A computer device, characterized in that: It comprises a memory and a processor, wherein the memory stores computer-readable instructions, and when the processor executes the computer-readable instructions, the steps of the method for generating a static product of a page as claimed in any one of claims 1 to 7 are implemented.

10. A computer-readable storage medium, characterized in that: The computer-readable storage medium stores computer-readable instructions, and when the computer-readable instructions are executed by a processor, the steps of the method for generating a static page product according to any one of claims 1 to 7 are implemented.

Images