Method and device for rendering the first screen of a web page in an application

Abstract

The present application discloses a method for rendering the first screen of a web page in an application. The method includes: upon receiving a web page first screen access request in an application triggered by a user, judging whether there is preloaded information matching the first screen of the web page in a preset resource package based on the uniform resource locator of the first screen of the web page, the preloaded information including a request body for obtaining dynamic resources of the first screen of the web page; upon determining that the preloaded information exists in the resource package, obtaining response data in response to the request body from a server based on the request body; receiving the response data returned by the server, and storing the response data in the application; when rendering the first screen of the web page, obtaining the response data from the application, and using the response data to render the first screen of the web page. The present application can improve the rendering speed of the first screen of a web page in an application and reduce user waiting time.

Description

Technical Field

[0001] The present application relates to the field of computer technology, and in particular to a method and device for rendering the first screen of a web page in an application. Background Art

[0002] With the development of Internet technology and the popularization of mobile terminals, people are increasingly accustomed to obtaining various types of information from the Internet through applications (APPs). However, as the functions included in applications continue to enrich, the content displayed by the web pages (web pages) in applications is becoming increasingly rich. Typically, a web page will present multiple screens of content. Users can trigger the mobile terminal to perform a web page flipping operation by sliding or clicking, thereby switching the home page of the web page to other screens. In the prior art, when a user accesses the home page, the mobile terminal will send a network request to the server to obtain the home page data. The mobile terminal then renders the home page based on the obtained home page data, thereby displaying the home page. Generally speaking, it takes a certain amount of time from the user triggering the request to open a home page to the application displaying the home page, resulting in a long waiting time for the user. To reduce the user's waiting time, the prior art downloads the static resources (html, css, js, image, etc.) of the home page to the local computer. When the user accesses the home page, the application localizes the access request for the remote resources, thereby eliminating the time required for network communication and achieving the purpose of speeding up the home page. The inventors found that with this optimization method, users still need to wait for a relatively long time. Summary of the Invention

[0003] In view of this, a method, apparatus, computer device and computer-readable storage medium for rendering the first screen of a web page in an application are now provided to solve the problem of how to further reduce the waiting time required by users when rendering the first screen of a web page.

[0004] This application provides a method for rendering the first screen of a web page in an application, including:

[0005] Upon receiving a request to access the homepage of a webpage from an application triggered by a user, determining, based on the uniform resource locator of the homepage of the webpage, whether preload information matching the homepage of the webpage exists in a preset resource package, the preload information including a request body for obtaining dynamic resources of the homepage of the webpage;

[0006] When it is determined that the preload information exists in the resource package, obtaining response data corresponding to the request body from the server according to the request body;

[0007] Receive response data returned by the server, and store the response data in the application;

[0008] When rendering the first screen of the web page, the response data is obtained from the application program, and the response data is used to render the first screen of the web page.

[0009] Optionally, upon receiving a webpage home screen access request from an application triggered by a user, determining whether there is preloaded information matching the webpage home screen in a preset resource package according to the uniform resource locator of the webpage home screen includes:

[0010] Upon receiving a webpage home screen access request from an application triggered by a user, generating a network request according to the access request, wherein the network request includes a uniform resource locator of the webpage home screen;

[0011] The network request is intercepted, and whether preload information matching the first screen of the web page is determined in a preset resource package according to a uniform resource locator in the network request.

[0012] Optionally, the method further includes:

[0013] When there is no preload information matching the first screen of the webpage in the resource package, obtaining page data corresponding to the first screen of the webpage from the server through the network request;

[0014] The page data is used to render the first screen of the web page.

[0015] Optionally, the method further includes:

[0016] When the application is started, it requests the server to download the resource package, which includes multiple offline resources of the first screen of the web page, and each offline resource of the first screen of the web page includes pre-loaded information of the first screen of the web page.

[0017] Optionally, when the application is started, requesting the server to download the resource package includes:

[0018] When the application is started, determining whether the resource package exists locally;

[0019] When the resource package exists locally, obtaining a first hash value of each offline resource included in the resource package;

[0020] Compare each first hash value with a second hash value corresponding to each first hash value contained in the server, where the second hash value is a hash value of each offline resource in the resource package in the server;

[0021] When the first hash value and the second hash value are different, a request is made to the server to download the offline resource corresponding to the second hash value.

[0022] Optionally, the method further includes:

[0023] After obtaining the response data from the application, deleting the response data from the application; and

[0024] When it is detected that the response data has not been used within a preset time period, the response data is deleted from the application.

[0025] Optionally, when rendering the first screen of the webpage, obtaining the response data from the application and rendering the first screen of the webpage using the response data includes:

[0026] When rendering the first screen of the webpage, if the response data does not exist in the application and the status of the request body is pending, waiting to receive the response data returned by the server and storing the response data in the application;

[0027] The response data is obtained from the application program, and the response data is used to render the first screen of the webpage.

[0028] This application also provides a device for rendering the first screen of a web page in an application, including:

[0029] a determination module configured to, upon receiving a user-triggered request to access the homepage of a webpage in an application, determine, based on the uniform resource locator of the homepage, whether preload information matching the homepage of the webpage exists in a preset resource package, the preload information including a request body for obtaining dynamic resources for the homepage of the webpage;

[0030] an acquisition module, configured to acquire response data corresponding to the request body from a server according to the request body when determining that the preload information exists in the resource package;

[0031] A storage module, configured to receive response data returned by the server and store the response data in the application;

[0032] A rendering module is used to obtain the response data from the application when rendering the first screen of the web page, and use the response data to render the first screen of the web page.

[0033] The present application also provides a computer device, which includes a memory, a processor, and a computer program stored in the memory and executable on the processor, wherein the processor implements the steps of the above method when executing the computer program.

[0034] The present application also provides a computer-readable storage medium having a computer program stored thereon, which implements the steps of the above method when executed by a processor.

[0035] This embodiment stores the request body for obtaining the dynamic resources of the web page home screen in the resource package. In this way, when the user accesses the web page home screen, the response data can be directly obtained from the server through these request bodies, and the response data can be used to render the web page home screen without waiting for the page data of the web page home screen to be parsed before obtaining the request body for obtaining the response data. This saves the time for obtaining the response data, improves the rendering speed of the web page home screen in the application, and reduces the user's waiting time. BRIEF DESCRIPTION OF THE DRAWINGS

[0036] Figure 1 This is a schematic diagram of the environment of the method for rendering the first screen of a web page in an application according to an embodiment of the present application;

[0037] Figure 2 A flowchart of an embodiment of a method for rendering the first screen of a web page in an application described in this application;

[0038] Figure 3 A schematic diagram of a detailed flow chart of the steps for determining whether preloaded information matching the home screen of a web page is present in a preset resource package based on the uniform resource locator of the home screen of the web page when a user-triggered request to access the home screen of the web page is received in an application program in one embodiment of the present application;

[0039] Figure 4 A flowchart of another embodiment of the method for rendering the first screen of a web page in an application described in this application;

[0040] Figure 5 This is a detailed flowchart of the steps of requesting the server to download the resource package when the application is started in one embodiment of the present application;

[0041] Figure 6 A schematic diagram of a detailed flow chart of the steps of obtaining the response data from the application and rendering the first screen of the web page using the response data when rendering the first screen of the web page in one embodiment of the present application;

[0042] Figure 7 This is a schematic diagram of the implementation process of the method for rendering the first screen of a web page in the application program of this application;

[0043] Figure 8 A program module diagram of an embodiment of a device for rendering the first screen of a web page in an application described in this application;

[0044] Figure 9A schematic diagram of the hardware structure of a computer device for executing a method for rendering the first screen of a web page in an application provided in an embodiment of the present application. DETAILED DESCRIPTION

[0045] The advantages of the present application are further described below with reference to the accompanying drawings and specific embodiments.

[0046] Exemplary embodiments will be described in detail herein, with examples illustrated in the accompanying drawings. In the following description, when referring to the drawings, identical numerals in different figures represent identical or similar elements, unless otherwise indicated. The embodiments described in the following exemplary embodiments are not intended to represent all possible embodiments consistent with the present disclosure. Rather, they are merely examples of apparatus and methods consistent with certain aspects of the present disclosure, as detailed in the appended claims.

[0047] The terms used in this disclosure are for the purpose of describing specific embodiments only and are not intended to limit the disclosure. As used in this disclosure and the appended claims, the singular forms "a," "an," "the," and "the" are intended to include the plural forms, unless the context clearly indicates otherwise. It should also be understood that the term "and / or" as used herein refers to and encompasses any and all possible combinations of one or more of the associated listed items.

[0048] It should be understood that although the terms first, second, third, etc. may be used in this disclosure to describe various information, such information should not be limited to these terms. These terms are only used to distinguish information of the same type from each other. For example, without departing from the scope of this disclosure, first information may also be referred to as second information, and similarly, second information may also be referred to as first information. Depending on the context, the word "if" as used herein may be interpreted as "at the time of" or "when" or "in response to determining."

[0049] In the description of this application, it should be understood that the numerical labels before the steps do not indicate the order in which the steps are executed. They are only used to facilitate the description of this application and to distinguish each step. Therefore, they cannot be understood as limitations on this application.

[0050] It's important to note that when an application renders a webpage on its home screen, it does so through the browser kernel. The browser kernel is responsible for interpreting the webpage's syntax (e.g., HTML, JavaScript) and rendering (displaying) the webpage. In other words, the browser kernel parses and renders the webpage. The browser kernel is also commonly referred to as the rendering engine. The rendering engine converts HTML / CSS / JavaScript text and its corresponding resource files into images for display.

[0051] Typically, when a page is opened using an application (APP) with a browser kernel installed on a mobile terminal with a limited display area (e.g., a smartphone), the page performance is determined by the rendering speed of the first screen of the page. The page rendered by the application needs to download the first screen data, execute JavaScript scripts to parse the first screen data, and then parse out various tags and insert them into the HTML document of the page. The browser kernel then parses and typesets the HTML document, initiates a first screen image request, decodes the loaded image, and renders the page. Only then can the user see the first screen of the page. This series of operations is executed serially, so it takes a relatively long time.

[0052] Generally speaking, dynamic data needs to be downloaded over the network, often taking over 600ms. JavaScript execution to render the first screen is also time-consuming, typically taking over 300ms. This results in users experiencing long wait times each time they open a new page, severely impacting their user experience.

[0053] Figure 1 The following schematically illustrates an application environment diagram of a web page first screen rendering method in an application according to an embodiment of the present application. In an exemplary embodiment, the system of the application environment may include a terminal device 10 and a server 20. The terminal device 10 forms a wireless or wired connection with the server 20. The terminal device 10 may be a mobile phone, an iPAD, a tablet computer, etc. The server 20 may be a server cluster or a cloud computing center composed of one server or multiple servers, and the specific details are not limited here. The web page first screen rendering method in the above application can be run in the terminal device 10.

[0054] See Figure 2 , which is a flowchart of a web page first screen rendering method in an application of an embodiment of the present application. It can be understood that the flowchart in the embodiment of the present method is not used to limit the order of execution steps. This application takes a mobile phone as an example of the execution subject. As can be seen from the figure, the web page first screen rendering method in the application provided in this embodiment includes:

[0055] Step S20: When a request to access the home screen of a web page is received from an application triggered by a user, it is determined whether there is preloaded information matching the home screen of the web page in a preset resource package based on the uniform resource locator of the home screen of the web page, and the preloaded information includes a request body for obtaining dynamic resources of the home screen of the web page.

[0056] Specifically, the application is an application program (APP) having a web page (web page).

[0057] The web page home screen is the web page content displayed on the first screen of the application's web page on the screen of the terminal device.

[0058] The resource package includes multiple offline resources for the first screen of a web page, and each offline resource for the first screen of a web page includes preloaded information for the first screen of a web page. The multiple first screens of a web page can be the first screens of all web pages in the application, or the first screens of some web pages in the application, which is not limited in this embodiment.

[0059] The dynamic resource is interface data that needs to be obtained from the server through a network request, wherein the interface data is data required for rendering components in the first screen of the web page.

[0060] Usually, we abstract the entire home screen of a web page (HTML) into different business modules. Different business modules are called different components. Component rendering often depends on interface data. What the component renders is the DOM node. Once all DOM nodes are rendered, the display page corresponding to the home screen of the web page can be obtained.

[0061] The preloading information includes a request body for obtaining dynamic resources for the homepage of the webpage, through which the interface data required for rendering the homepage of the webpage can be obtained. The request body may include the request method (GET, POST, etc.) for requesting the homepage of the webpage, the URL for requesting the homepage of the webpage, the headers object related to the request for the homepage of the webpage, and the params for requesting the homepage of the webpage.

[0062] It should be noted that the interface data mentioned above may refer to the interface data required by all components included in the first screen of the web page.

[0063] In this embodiment, when a user wants to access the homepage of a web page, the user can trigger a homepage access request in the application by clicking a target control in the page.

[0064] In the prior art, when a user triggers a request to access the home screen of a web page, the application will request the server to obtain the page data of the home screen of the web page according to the Uniform Resource Locator (URL) of the home screen of the web page. However, in the present application, after receiving a page access request, the application will not first request the server to obtain the page data of the home screen of the web page according to the Uniform Resource Locator (URL) of the home screen of the web page. Instead, the application will first determine whether there is pre-loaded information matching the home screen of the web page in a preset resource package based on the URL of the home screen of the web page. If the pre-loaded information does not exist in the resource package, the application will request the server to obtain the page data of the home screen of the web page according to the URL of the home screen of the web page.

[0065] It should be noted that the resource package is pre-downloaded and stored in the mobile phone. When the content included in the resource package changes, the resource package can also be updated.

[0066] As an example, the resource package may include the following contents: the request method (GET, POST, etc.) for requesting the first screen of the web page, the URL for requesting the first screen of the web page, the request-related Headers object for requesting the first screen of the web page, the params for requesting the first screen of the web page, etc.

[0067] In an exemplary embodiment, see Figure 3 , upon receiving a web page home screen access request from an application triggered by a user, determining whether preloaded information matching the web page home screen is contained in a preset resource package based on the uniform resource locator of the web page home screen includes: step S31, upon receiving a web page home screen access request from an application triggered by a user, generating a network request based on the access request, wherein the network request includes the uniform resource locator of the web page home screen; step S32, intercepting the network request, and determining whether preloaded information matching the web page home screen is contained in a preset resource package based on the uniform resource locator in the network request.

[0068] Specifically, when a user triggers an access request to the first screen of a web page, a network request will be generated based on the access request, so that the page data corresponding to the first screen of the web page can be requested from the server through the network request. After the network request is generated, the network request will be intercepted, and the URL in the network request will be used to determine whether there is preloaded information in the resource package that matches the first screen of the web page. Specifically, the URL contained in the network request can be compared with the URL contained in each preloaded information in the resource package. If there is a URL that is the same as the URL contained in the network request, it can be determined that there is preloaded information in the resource package that matches the first screen of the web page. If there is no URL that is the same as the URL contained in the network request, it can be determined that there is no preloaded information in the resource package that matches the first screen of the web page.

[0069] Step S21 : when it is determined that the preload information exists in the resource package, obtaining response data in response to the request body from the server according to the request body.

[0070] Specifically, when it is determined that the preloading information exists in the resource package, the response data of the request body can be directly obtained from the server through the request body, without having to wait for the page code of the first screen of the web page to be parsed and then obtaining the response data of the request body from the server through the request body obtained after parsing, thereby saving the time of obtaining the response data.

[0071] Step S22: receiving the response data returned by the server, and storing the response data in the application.

[0072] Step S23: when rendering the first screen of the web page, obtaining the response data from the application program, and using the response data to render the first screen of the web page.

[0073] Specifically, after receiving the response data returned by the server, the response data can be stored in the application, so that when the web page home screen needs to be rendered later, the response data can be directly obtained from the application, and the web page home screen can be rendered using these response data to obtain the web page home screen.

[0074] The embodiment of the present application stores the request body for obtaining the dynamic resources of the web page home screen in the resource package. In this way, when the user accesses the web page home screen, the response data can be directly obtained from the server through these request bodies, and the response data can be used to render the web page home screen without waiting for the page data of the web page home screen to be parsed before obtaining the request body for obtaining the response data, thereby saving the time for obtaining the response data, improving the rendering speed of the web page home screen in the application, and reducing the user's waiting time.

[0075] In an exemplary embodiment, see Figure 4 The method further includes: step S40, when there is no preloading information matching the first screen of the web page in the resource package, obtaining page data corresponding to the first screen of the web page from the server through the network request; step S41, using the page data to render the first screen of the web page.

[0076] Specifically, when there is no preloading information matching the first screen of the web page in the resource package, the rendering of the first screen of the web page can be achieved through the normal first screen rendering logic of the web page, that is, by sending a network request to the server to obtain page data, and after receiving the page data returned by the server, the first screen of the web page is rendered using the page data, thereby displaying the first screen of the web page to the user.

[0077] In an exemplary embodiment, in order to obtain preload information from the resource package in a timely manner when the user accesses the home screen of the webpage, the method further includes:

[0078] When the application is started, it requests the server to download the resource package, which includes multiple offline resources of the first screen of the web page, and each offline resource of the first screen of the web page includes pre-loaded information of the first screen of the web page.

[0079] In this embodiment, when the application is hot started or cold started, it can request the server to download the resource package.

[0080] In an exemplary embodiment, see Figure 5 In order to avoid repeated downloading of resource packages and thus waste of network resources, in this embodiment, when the application is started, requesting the server to download the resource package includes:

[0081] Step S50: When the application is started, it is determined whether the resource package exists locally.

[0082] Specifically, when the application is started, it can first determine whether the resource package exists locally. If the resource package does not exist locally, it can request the server to download the resource package. If the resource package exists locally, it can determine whether the resource package has been updated. If not, there is no need to request the server to download the resource package. Only if the resource package has been updated will the server request the resource package to be downloaded.

[0083] Step S51: When the resource package exists locally, obtain the first hash value of each offline resource included in the resource package.

[0084] Specifically, in order to facilitate the determination of whether the locally stored resource package is identical to the resource package stored on the server, a corresponding first hash value may be generated for each offline resource in the resource package when the resource package is stored locally.

[0085] Step S52: Compare each first hash value with a second hash value corresponding to each first hash value contained in the server, where the second hash value is a hash value of each offline resource in the resource package in the server.

[0086] Specifically, a corresponding second hash value can be generated in advance for each offline resource in the resource package stored in the server. In this way, when determining whether the local resource package is the same as the resource package in the server, it is possible to determine whether each offline resource has been updated by comparing the first hash value with the corresponding second hash value.

[0087] As an example, assume that the locally stored resource package includes offline resource 1, offline resource 2, and offline resource 3, and their first hash values ​​are hash 1, hash 2, and hash 3, respectively. The resource package in the server includes offline resource a, offline resource b, and offline resource c, and their second hash values ​​are hash a, hash b, and hash c, respectively. Offline resource a, offline resource b, and offline resource c correspond one-to-one to offline resource 1, offline resource 2, and offline resource 3, respectively. When making comparisons, hash 1 can be compared with hash a, hash 2 with hash b, and hash 3 with hash c. If the comparison results are the same, it indicates that the offline resource has not changed. If the comparison results are different, it indicates that the offline resource has been updated.

[0088] Step S53: When the first hash value and the second hash value are different, a request is made to the server to download an offline resource corresponding to the second hash value.

[0089] Specifically, when the first hash value of the offline resource currently to be compared in the local computer is different from the second hash value of the offline resource currently to be compared stored in the server, a request can be made to the server to download the offline resource corresponding to the second hash value. When the first hash value of the offline resource currently to be compared is the same as the second hash value of the corresponding offline resource, there is no need to request the server to download the offline resource corresponding to the second hash value, and the comparison can continue with the next offline resource stored locally until all offline resources have been compared.

[0090] In an exemplary embodiment, to ensure the timeliness and accuracy of the data, after the response data is obtained from the application, the response data may be deleted from the application. The response data may also be deleted from the application when it is detected that the response data has not been used within a preset time period.

[0091] In an exemplary embodiment, see Figure 6 , when rendering the first screen of the web page, obtaining the response data from the application, and using the response data to render the first screen of the web page includes: step S60, when rendering the first screen of the web page, if the response data does not exist in the application, and the status of the request body is pending, waiting to receive the response data returned by the server, and storing the response data in the application; step S61, obtaining the response data from the application, and using the response data to render the first screen of the web page.

[0092] In this embodiment, when rendering the first screen of a web page, if the response data does not yet exist in the application, but the request body exists, and the current state of the request body is pending, then in order to improve the rendering speed of the first screen of the web page, you can wait for receiving the response data returned by the server, and store the response data in the application, and then obtain the response data from the application, and use the response data to render the first screen of the web page.

[0093] It should be noted that the pending state means that the task of obtaining response data from the server through the request body has neither been fulfilled nor rejected.

[0094] This application uses a waiting method instead of a direct network request to obtain page data from the server, and uses the obtained page data to render the first screen of the web page. This can improve the rendering speed of the first screen of the web page.

[0095] To facilitate understanding of the present application, the implementation process of the method for rendering the first screen of a web page in the application of the present application will be described in detail below in conjunction with a specific embodiment.

[0096] See Figure 7As shown, after the application (APP) is started, it will download a resource package from a remote server and store the downloaded resource package in a preset storage space. If there is a downloaded resource package in the storage space, after the APP is started and the resource package is downloaded, the APP will use the currently downloaded resource package to update the previously downloaded resource package, so that the stored resource package is the latest resource package. When the user accesses the homepage of the web page in the APP, the APP will determine whether there is an offline resource matching the web link in the resource package based on the web link (URL) of the web page currently accessed by the user. If there is a matching offline resource in the resource package, the APP will obtain the request body required to load the homepage of the web page from the resource package, and then use the request to obtain the response data (response) in response to the request body from the server. After obtaining the response data returned by the server, the response data is stored locally in the APP. When the APP needs to render the homepage of the web page, it can obtain the response data from the APP locally and use the response data to render the homepage of the web page.

[0097] In this embodiment, when the APP determines that there is no matching offline resource in the resource package based on the web link (URL) of the home screen of the web page currently accessed by the user, the APP will initialize the HTML of the home screen of the web page through the browser, and then the browser will send a network request to the server to obtain the response data corresponding to the home screen of the web page. When the browser sends a network request to obtain response data, the APP will intercept the network request and then determine whether there is response data in the local APP. When it is determined that there is response data locally, the APP will use the locally stored response data to render the home screen of the web page. When the APP determines that there is no response data in the local APP, the APP will obtain the response data from the server through the browser, and then the APP will use the response data obtained by the browser to render the home screen of the web page.

[0098] See Figure 8 1 is a program module diagram of an embodiment of a web page first screen rendering device 70 in the application of the present application.

[0099] In this embodiment, the web page first screen rendering device 70 in the application includes a series of computer program instructions stored in the memory. When the computer program instructions are executed by the processor, the web page first screen rendering function in the application of each embodiment of the present application can be implemented. In some embodiments, based on the specific operations implemented by each part of the computer program instructions, the web page first screen rendering device 70 in the application can be divided into one or more modules. The specific modules that can be divided are as follows:

[0100] Determination module 71 is configured to, upon receiving a user-triggered request to access the homepage of a webpage in an application, determine, based on the uniform resource locator of the homepage, whether preload information matching the homepage of the webpage exists in a preset resource package, the preload information including a request body for obtaining dynamic resources for the homepage of the webpage;

[0101] An acquisition module 72 is configured to acquire response data corresponding to the request body from a server according to the request body when it is determined that the preload information exists in the resource package;

[0102] A storage module 73 is configured to receive response data returned by the server and store the response data in the application;

[0103] The rendering module 74 is configured to obtain the response data from the application when rendering the first screen of the web page, and use the response data to render the first screen of the web page.

[0104] In an exemplary embodiment, when the judgment module 71 receives a web page home screen access request in an application triggered by a user, it generates a network request based on the access request, wherein the network request includes a uniform resource locator of the web page home screen; intercepts the network request, and determines whether there is preloaded information matching the web page home screen in a preset resource package based on the uniform resource locator in the network request.

[0105] In an exemplary embodiment, the acquisition module 72 is further configured to obtain page data corresponding to the first screen of the web page from the server through the network request when there is no preload information matching the first screen of the web page in the resource package.

[0106] The rendering module 74 is further configured to render the first screen of the web page using the page data.

[0107] In an exemplary embodiment, the web page first screen rendering device 70 in the application further includes a request module.

[0108] The request module is used to request the server to download the resource package when the application is started. The resource package includes offline resources of multiple web page home screens. The offline resources of each web page home screen include preloaded information of the web page home screen.

[0109] In an exemplary embodiment, the request module is further used to determine whether the resource package exists locally when the application is started; when the resource package exists locally, obtain the first hash value of each offline resource contained in the resource package; compare each first hash value with the second hash value corresponding to each first hash value contained in the server, the second hash value being the hash value of each offline resource in the resource package in the server; when the first hash value and the second hash value are different, request the server to download the offline resource corresponding to the second hash value.

[0110] In an exemplary embodiment, the web page first screen rendering device 70 in the application further includes a deletion module.

[0111] The deletion module is configured to delete the response data from the application after obtaining the response data from the application; and to delete the response data from the application when detecting that the response data has not been used within a preset time period.

[0112] In an exemplary embodiment, the rendering module 74 is also used to, when rendering the first screen of the web page, if the response data does not exist in the application and the status of the request body is pending, wait for receiving the response data returned by the server and store the response data in the application; obtain the response data from the application and use the response data to render the first screen of the web page.

[0113] This embodiment stores the request body for obtaining the dynamic resources of the web page home screen in the resource package. In this way, when the user accesses the web page home screen, the response data can be directly obtained from the server through these request bodies, and the response data can be used to render the web page home screen without waiting for the page data of the web page home screen to be parsed before obtaining the request body for obtaining the response data. This saves the time for obtaining the response data, improves the rendering speed of the web page home screen in the application, and reduces the user's waiting time.

[0114] Figure 9 The schematic diagram of the hardware architecture of a computer device 8 suitable for implementing the web page first screen rendering method in an application according to an embodiment of the present application is shown. In this embodiment, the computer device 8 is a device that can automatically perform numerical calculations and / or information processing according to pre-set or stored instructions. For example, it can be a tablet computer, a laptop computer, a desktop computer, a rack server, a blade server, a tower server or a cabinet server (including an independent server, or a server cluster composed of multiple servers), etc. Figure 9As shown, the computer device 8 includes at least but not limited to: a memory 120, a processor 121, and a network interface 122 that can be interconnected through a system bus.

[0115] The memory 120 includes at least one type of computer-readable storage medium, which can be either volatile or non-volatile. Specifically, the computer-readable storage medium includes flash memory, a hard disk, a multimedia card, a card-type memory (e.g., SD or DX memory), random access memory (RAM), static random access memory (SRAM), read-only memory (ROM), electrically erasable programmable read-only memory (EEPROM), programmable read-only memory (PROM), magnetic storage, a magnetic disk, an optical disk, etc. In some embodiments, the memory 120 can be an internal storage module of the computer device 8, such as the hard disk or memory of the computer device 8. In other embodiments, the memory 120 can also be an external storage device of the computer device 8, such as a plug-in hard disk equipped on the computer device 8, a Smart Media Card (SMC), a Secure Digital (SD) card, a flash memory card, etc. Of course, the memory 120 can also include both the internal storage module of the computer device 8 and its external storage device. In this embodiment, the memory 120 is generally used to store the operating system and various application software installed on the computer device 8, such as the program code of the web page first screen rendering method in the application. In addition, the memory 120 can also be used to temporarily store various data that has been output or will be output.

[0116] In some embodiments, the processor 121 may be a central processing unit (CPU), a controller, a microcontroller, a microprocessor, or a web page first screen rendering chip in other applications. The processor 121 is generally used to control the overall operation of the computer device 8, such as performing control and processing related to data interaction or communication with the computer device 8. In this embodiment, the processor 121 is used to execute program code stored in the memory 120 or process data.

[0117] The network interface 122 may include a wireless network interface or a wired network interface. The network interface 122 is generally used to establish a communication link between the computer device 8 and other computer devices. For example, the network interface 122 is used to connect the computer device 8 to an external terminal via a network, establishing a data transmission channel and a communication link between the computer device 8 and the external terminal. The network can be a wireless or wired network such as an intranet, the Internet, the Global System of Mobile Communications (GSM), Wideband Code Division Multiple Access (WCDMA), a 4G network, a 5G network, Bluetooth, or Wi-Fi.

[0118] It should be pointed out that Figure 9 Only a computer device having components 120 - 122 is shown, but it should be understood that implementation of all of the shown components is not a requirement, and greater or fewer components may alternatively be implemented.

[0119] In this embodiment, the web page first screen rendering method in the application stored in the memory 120 can be divided into one or more program modules and executed by one or more processors (processor 121 in this embodiment) to complete this application.

[0120] An embodiment of the present application provides a computer-readable storage medium having a computer program stored thereon. When the computer program is executed by a processor, the steps of the method for rendering the first screen of a web page in an application in the embodiment are implemented.

[0121] In this embodiment, the computer-readable storage medium includes a flash memory, a hard disk, a multimedia card, a card-type memory (e.g., SD or DX memory), 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 computer-readable storage medium may be an internal storage unit of a computer device, such as a hard disk or memory of the computer device. In other embodiments, the computer-readable storage medium may also be an external storage device of the computer device, such as a plug-in hard disk equipped on the computer device, a smart memory card (Smart Media Card, abbreviated as SMC), a secure digital (Secure Digital, abbreviated as SD) card, a flash card, etc. Of course, the computer-readable storage medium may also include both an internal storage unit of the computer device and its external storage device. In this embodiment, the computer-readable storage medium is generally used to store an operating system and various application software installed on the computer device, such as the program code of the web page first screen rendering method in the application program in the embodiment. In addition, the computer-readable storage medium may also be used to temporarily store various types of data that have been output or are about to be output.

[0122] The device embodiments described above are merely illustrative, wherein the units described as separate components may or may not be physically separate, and the components shown as units may or may not be physical units, that is, they may be located in one place or distributed across at least two network units. Some or all of the modules may be selected based on actual needs to achieve the purpose of the embodiments of the present application. Those of ordinary skill in the art can understand and implement the present invention without inventive effort.

[0123] Through the description of the above embodiments, those skilled in the art can clearly understand that each embodiment can be implemented by means of software plus a general hardware platform, and of course, can also be implemented by hardware. Those skilled in the art can understand that all or part of the processes in the above embodiment methods can be completed by instructing the relevant hardware through a computer program, and the program 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 storage medium can be a magnetic disk, an optical disk, a read-only memory (ROM) or a random access memory (RAM), etc.

[0124] Finally, it should be noted that the above embodiments are only used to illustrate the technical solutions of the present application, rather than to limit them. Although the present application has been described in detail with reference to the aforementioned embodiments, those skilled in the art should understand that they can still modify the technical solutions described in the aforementioned embodiments, or make equivalent replacements for some or all of the technical features therein. These modifications or replacements do not deviate the essence of the corresponding technical solutions from the scope of the technical solutions of the embodiments of the present application.

Claims

1. A method for rendering the first screen of a web page in an application, characterized in that: include: Upon receiving a request to access the homepage of a webpage from an application triggered by a user, determining, based on the uniform resource locator of the homepage of the webpage, whether preload information matching the homepage of the webpage exists in a preset resource package, the preload information including a request body for obtaining dynamic resources of the homepage of the webpage; When it is determined that the preload information exists in the resource package, obtaining response data corresponding to the request body from the server according to the request body; Receive response data returned by the server, and store the response data in the application; When rendering the first screen of the webpage, obtaining the response data from the application, and rendering the first screen of the webpage using the response data; The method further comprises: When the application is started, it requests the server to download the resource package, which includes multiple offline resources of the first screen of the web page, and each offline resource of the first screen of the web page includes pre-loaded information of the first screen of the web page.

2. The method for rendering the first screen of a web page in an application according to claim 1, characterized in that: When receiving a webpage home screen access request from an application triggered by a user, determining whether there is preloaded information matching the webpage home screen in a preset resource package according to the uniform resource locator of the webpage home screen includes: Upon receiving a webpage home screen access request from an application triggered by a user, generating a network request according to the access request, wherein the network request includes a uniform resource locator of the webpage home screen; The network request is intercepted, and whether preload information matching the first screen of the web page is determined in a preset resource package according to a uniform resource locator in the network request.

3. The method for rendering the first screen of a web page in an application according to claim 2, characterized in that: The method further comprises: When there is no preload information matching the first screen of the webpage in the resource package, obtaining page data corresponding to the first screen of the webpage from the server through the network request; The page data is used to render the first screen of the web page.

4. The method for rendering the first screen of a web page in an application according to claim 1, characterized in that: When the application is started, requesting the server to download the resource package includes: When the application is started, determining whether the resource package exists locally; When the resource package exists locally, obtaining a first hash value of each offline resource included in the resource package; Compare each first hash value with a second hash value corresponding to each first hash value contained in the server, where the second hash value is a hash value of each offline resource in the resource package in the server; When the first hash value and the second hash value are different, a request is made to the server to download the offline resource corresponding to the second hash value.

5. The method for rendering the first screen of a web page in an application according to any one of claims 1 to 4, characterized in that: The method further comprises: After obtaining the response data from the application, deleting the response data from the application; and When it is detected that the response data has not been used within a preset time period, the response data is deleted from the application. remove.

6. The method for rendering the first screen of a web page in an application according to claim 5, characterized in that: When rendering the first screen of the webpage, obtaining the response data from the application and rendering the first screen of the webpage using the response data includes: When rendering the first screen of the webpage, if the response data does not exist in the application and the status of the request body is pending, waiting to receive the response data returned by the server and storing the response data in the application; The response data is obtained from the application program, and the response data is used to render the first screen of the webpage.

7. A web page first screen rendering device in an application, characterized in that: include: a determination module configured to, upon receiving a user-triggered request to access the homepage of a webpage in an application, determine, based on the uniform resource locator of the homepage, whether preload information matching the homepage of the webpage exists in a preset resource package, the preload information including a request body for obtaining dynamic resources for the homepage of the webpage; an acquisition module, configured to acquire response data corresponding to the request body from a server according to the request body when determining that the preload information exists in the resource package; A storage module, configured to receive response data returned by the server and store the response data in the application; A rendering module, configured to obtain the response data from the application when rendering the first screen of the web page, and render the first screen of the web page using the response data; Among them, also include: When the application is started, it requests the server to download the resource package, which includes multiple offline resources of the first screen of the web page, and each offline resource of the first screen of the web page includes pre-loaded information of the first screen of the web page.

8. A computer device comprising a memory, a processor, and a computer program stored in the memory and executable on the processor, wherein the processor implements the steps of the method according to any one of claims 1 to 6 when executing the computer program.

9. A computer-readable storage medium having a computer program stored thereon, characterized in that: When the computer program is executed by a processor, the steps of the method according to any one of claims 1 to 6 are implemented.

10. A computer program product comprising computer instructions, characterized in that: When the computer instructions are executed by a processor, the steps of the method according to any one of claims 1 to 6 are implemented.

Images