CN113934954A - Webpage first screen rendering method and device in application program - Google Patents
Webpage first screen rendering method and device in application program Download PDFInfo
- Publication number
- CN113934954A CN113934954A CN202111181010.6A CN202111181010A CN113934954A CN 113934954 A CN113934954 A CN 113934954A CN 202111181010 A CN202111181010 A CN 202111181010A CN 113934954 A CN113934954 A CN 113934954A
- Authority
- CN
- China
- Prior art keywords
- screen
- webpage
- application program
- response data
- rendering
- Prior art date
- Legal status (The legal status is an assumption and is not a legal conclusion. Google has not performed a legal analysis and makes no representation as to the accuracy of the status listed.)
- Pending
Links
Images
Classifications
-
- G—PHYSICS
- G06—COMPUTING; CALCULATING OR COUNTING
- G06F—ELECTRIC DIGITAL DATA PROCESSING
- G06F16/00—Information retrieval; Database structures therefor; File system structures therefor
- G06F16/90—Details of database functions independent of the retrieved data types
- G06F16/95—Retrieval from the web
- G06F16/957—Browsing optimisation, e.g. caching or content distillation
Abstract
The application discloses a webpage first screen rendering method in an application program. The method comprises the following steps: when a webpage initial screen access request in an application program triggered by a user is received, judging whether pre-loading information matched with the webpage initial screen exists in a preset resource package according to a uniform resource locator of the webpage initial screen, wherein the pre-loading information comprises a request body used for acquiring dynamic resources of the webpage initial screen; when the resource package is judged to have the preloading information, response data responding to the request body is obtained from a server according to the request body; receiving response data returned by the server, and storing the response data into the application program; and when the first webpage screen is rendered, acquiring the response data from the application program, and rendering the first webpage screen by adopting the response data. According to the method and the device, the rendering speed of the first screen of the webpage in the application program can be improved, and the waiting time of a user is reduced.
Description
Technical Field
The present application relates to the field of computer technologies, and in particular, to a method and an apparatus for rendering a first screen of a web page in an application.
Background
With the development of internet technology and the popularization of mobile terminals, people are more and more accustomed to obtaining various types of information from networks through application programs (APPs). However, as the functions included in the application are continuously rich, the contents displayed on a web page (web page) in the application are more and more rich, generally, one web page presents multi-screen displayed contents, and a user can trigger the mobile terminal to perform a screen flipping operation of the web page through a sliding operation or a clicking operation, so as to switch a first screen page of the web page to another screen page. In the prior art, when a user accesses a home screen page, a mobile terminal sends a network request to a server to acquire home screen page data, and then the mobile terminal renders the home screen page through the acquired home screen page data, so that the home screen page is displayed. Generally, a certain time is required from the moment a user triggers a request to open a first screen page to the moment an application program displays the first screen page, so that the user needs to experience a long waiting time. In order to reduce the waiting time of the user, in the prior art, static resources (html, css, js, image and other resources) of a first screen page are downloaded locally, and when the user accesses the first screen page, an application program localizes an access request of a remote resource, so that the time required by network communication is removed, and the purpose of accelerating the first screen is achieved. The inventor has found that the user still needs a long waiting time by the optimization mode.
Disclosure of Invention
In view of the above, a method, an apparatus, a computer device, and a computer-readable storage medium for rendering a first screen of a webpage in an application program are provided to solve the problem of how to further reduce the waiting time required by a user when rendering the first screen of the webpage.
The application provides a webpage first screen rendering method in an application program, which comprises the following steps:
when a webpage initial screen access request in an application program triggered by a user is received, judging whether pre-loading information matched with the webpage initial screen exists in a preset resource package according to a uniform resource locator of the webpage initial screen, wherein the pre-loading information comprises a request body used for acquiring dynamic resources of the webpage initial screen;
when the resource package is judged to have the preloading information, response data responding to the request body is obtained from a server according to the request body;
receiving response data returned by the server, and storing the response data into the application program;
and when the first webpage screen is rendered, acquiring the response data from the application program, and rendering the first webpage screen by adopting the response data.
Optionally, when receiving a webpage initial screen access request in an application triggered by a user, the determining, according to the uniform resource locator of the webpage initial screen, whether a pre-loaded information matched with the webpage initial screen exists in a preset resource package includes:
when a webpage initial screen access request in an application program triggered by a user is received, generating a network request according to the access request, wherein the network request comprises uniform resource positioning of the webpage initial screen;
and intercepting the network request, and judging whether pre-loading information matched with the first screen of the webpage exists in a preset resource packet according to a uniform resource locator in the network request.
Optionally, the method further comprises:
when the resource package does not contain the preloading information matched with the first webpage screen, acquiring page data corresponding to the first webpage screen from the server through the network request;
and rendering the first screen of the webpage by adopting the page data.
Optionally, the method further comprises:
when the application program is started, the resource package is requested to be downloaded to the server, the resource package comprises the offline resources of the first screens of the multiple webpages, and the offline resources of each first screen of the network comprise the preloading information of the first screen of the webpage.
Optionally, the requesting, when the application is started, to download the resource package from the server includes:
when the application program is started, judging whether the resource packet exists locally;
when the resource package exists locally, acquiring a first hash value of each offline resource contained in the resource package;
comparing each first hash value with a second hash value contained in the server and corresponding to each first hash value, wherein the second hash value is the hash value of each offline resource in a resource packet in the server;
and when the first hash value is different from the second hash value, requesting the server to download the offline resource corresponding to the second hash value.
Optionally, the method further comprises:
deleting the response data from the application program after the response data is acquired from the application program; and
and when the response data is detected not to be used within a preset time period, deleting the response data from the application program.
Optionally, when rendering the first screen of the webpage, the obtaining the response data from the application program, and rendering the first screen of the webpage by using the response data includes:
when the first screen of the webpage is rendered, if the response data does not exist in the application program and the state of the request body is in an undetermined state, waiting for receiving the response data returned by the server and storing the response data into the application program;
and acquiring the response data from the application program, and rendering the first screen of the webpage by adopting the response data.
The application also provides a device for rendering the first screen of the webpage in the application program, which comprises:
the system comprises a judging module, a judging module and a judging module, wherein the judging module is used for judging whether pre-loading information matched with a webpage first screen exists in a preset resource package according to a uniform resource locator of the webpage first screen when a webpage first screen access request in an application program triggered by a user is received, and the pre-loading information comprises a request body used for acquiring dynamic resources of the webpage first screen;
the acquisition module is used for acquiring response data responding to the request body from a server according to the request body when the resource package is judged to have the preloading information;
the storage module is used for receiving response data returned by the server and storing the response data into the application program;
and the rendering module is used for acquiring the response data from the application program when rendering the first webpage screen and rendering the first webpage screen by adopting the response data.
The present application further provides a computer device comprising a memory, a processor and a computer program stored on the memory and executable on the processor, the processor implementing the steps of the above method when executing the computer program.
The present application also provides a computer-readable storage medium having stored thereon a computer program which, when being executed by a processor, carries out the steps of the above-mentioned method.
In this embodiment, the request bodies for acquiring the dynamic resources of the first webpage screen are stored in the resource packet, so that when a user accesses the first webpage screen, the user can directly acquire response data from the request bodies to the server and use the response data to render the first webpage screen, and the request bodies for acquiring the response data can be acquired without waiting for analyzing the page data of the first webpage screen, thereby saving the time for acquiring the response data, improving the rendering speed of the first webpage screen in an application program, and reducing the waiting time of the user.
Drawings
Fig. 1 is an environment schematic diagram of a webpage first screen rendering method in an application program according to an embodiment of the present application;
FIG. 2 is a flowchart of an embodiment of a method for rendering a first screen of a web page in an application according to the present application;
fig. 3 is a flowchart illustrating a detailed process of determining whether a pre-loaded information matched with a first webpage screen exists in a preset resource package according to a uniform resource locator of the first webpage screen when a first webpage screen access request in an application triggered by a user is received in an embodiment of the present application;
FIG. 4 is a flowchart of another embodiment of a method for rendering a first screen of a web page in an application according to the present application;
fig. 5 is a flowchart illustrating a detailed process of requesting the server to download the resource package when the application is started according to an embodiment of the present application;
fig. 6 is a flowchart illustrating a detailed process of steps of obtaining the response data from the application program and rendering the first screen of the webpage by using the response data when rendering the first screen of the webpage according to an embodiment of the present application;
fig. 7 is a schematic flow chart illustrating an implementation of a method for rendering a first screen of a webpage in an application program according to the present application;
FIG. 8 is a block diagram of an embodiment of an apparatus for rendering a first screen of a web page in an application according to the present application;
fig. 9 is a schematic hardware structure diagram of a computer device that executes a method for rendering a first screen of a web page in an application according to an embodiment of the present application.
Detailed Description
The advantages of the present application are further illustrated below with reference to the accompanying drawings and specific embodiments.
Reference will now be made in detail to the exemplary embodiments, examples of which are illustrated in the accompanying drawings. When the following description refers to the accompanying drawings, like numbers in different drawings represent the same or similar elements unless otherwise indicated. The implementations described in the exemplary embodiments below are not intended to represent all implementations 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.
The terminology used in the present disclosure is for the purpose of describing particular embodiments only and is not intended to be limiting of the disclosure. As used in this disclosure and the appended claims, the singular forms "a," "an," and "the" are intended to include the plural forms as well, 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.
It is to be understood that although the terms first, second, third, etc. may be used herein to describe various information, such information should not be limited to these terms. These terms are only used to distinguish one type of information from another. For example, first information may also be referred to as second information, and similarly, second information may also be referred to as first information, without departing from the scope of the present disclosure. The word "if" as used herein may be interpreted as "at … …" or "when … …" or "in response to a determination", depending on the context.
In the description of the present application, it should be understood that the numerical references before the steps do not identify the order of performing the steps, but merely serve to facilitate the description of the present application and to distinguish each step, and therefore should not be construed as limiting the present application.
It should be noted that the application program is implemented by a browser kernel when rendering the first screen of the web page, where the browser kernel is responsible for interpreting a web page language (such as HTML and JavaScript) and rendering (displaying) the web page, that is, parsing and rendering the web page by the browser kernel. Typically, the browser kernel is also referred to as a rendering engine. And the rendering engine is used for converting the HTML/CSS/JavaScript text and the corresponding resource files thereof into image results for displaying.
Generally, when a page is opened using an Application (APP) having a browser kernel installed on a mobile terminal (e.g., a smart phone) with a limited display area, the page performance is determined by the rendering speed of the first screen of the page. The page rendered by the application program needs to download the first screen data, executes the JavaScript to analyze the first screen data, and then inserts various analyzed tags into the HTML document of the page. The browser kernel then parses and typesets the HTML document, initiates a first screen picture request, decodes the loaded picture, renders the page, and then the user can see the first screen of the page, and the series of operations are executed serially, which consumes a long time.
Dynamic data typically needs to be downloaded over a network, and therefore typically takes over 600 ms. It is also time consuming to perform the JavaScript script rendering of the first screen, which usually takes more than 300 ms. Therefore, the user can experience a long waiting process each time a new page is opened, and the use experience of the user is seriously influenced.
Fig. 1 schematically illustrates an application environment of a method for rendering a first screen of a webpage in an application according to an embodiment of the present application. In an exemplary embodiment, the system of the application environment may include the terminal device 10 and the server 20. Wherein 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, or the like. The server 20 may be a server or a server cluster composed of multiple servers, or a cloud computing center, and the like, and is not limited herein. The terminal device 10 may operate the webpage first screen rendering method in the application program.
Fig. 2 is a schematic flowchart of a webpage first screen rendering method in an application according to an embodiment of the present application. It should be understood that the flow charts in the embodiments of the present method are not used to limit the order of executing the steps. In the application, a mobile phone is taken as an example of an execution subject, and as can be seen from the figure, the method for rendering the first screen of the webpage in the application provided in the embodiment includes:
step S20, when a webpage initial screen access request in an application program triggered by a user is received, judging whether a preset resource package has pre-loading information matched with the webpage initial screen according to a uniform resource locator of the webpage initial screen, wherein the pre-loading information comprises a request body for acquiring dynamic resources of the webpage initial screen.
In particular, the application is an Application (APP) having a web page (web page).
The first webpage screen is the webpage content displayed by the first screen of the webpage of the application program on the screen of the terminal equipment.
The resource package comprises a plurality of offline resources of the first screen of the webpage, and the offline resources of each first screen of the network comprise preloading information of the first screen of the webpage. The multiple first web page screens may be the first web page screens of all web pages in the application program, or the first web page screens of some web pages in the application program, which is not limited in this embodiment.
The dynamic resource is interface data which needs to be acquired from a server through a network request, wherein the interface data is data required for rendering components in a first screen of a webpage.
Generally, the whole webpage first screen (HTML) is abstracted into different service modules, the different service modules are called different components, the component rendering usually depends on interface data, DOM nodes are rendered by the components, and the display page corresponding to the webpage first screen can be obtained after all the DOM nodes are rendered.
The preloading information comprises a request body used for acquiring the dynamic resource of the first screen of the webpage, and interface data required for rendering the first screen of the webpage can be acquired through the request body. The request body may include a request method (GET, POST, etc.) for requesting the first screen of the web page, a URL for requesting the first screen of the web page, a Headers object related to the request for requesting the first screen of the web page, a params for requesting the first screen of the web page, and the like.
It should be noted that the interface data mentioned above may refer to interface data required by all components included in the first screen of the web page.
In this embodiment, when a user wants to access a first webpage screen of a certain web page, the user may trigger a first webpage screen access request in an application program by clicking a target control in the page.
In the prior art, when a user triggers a request for accessing a first screen of a web page, an application program requests a server to obtain page data of the first screen of the web page according to a Uniform Resource Locator (URL) of the first screen of the web page. However, in the present application, after receiving a page access request, the server is not requested to obtain the page data of the first screen of the web page according to a Uniform Resource Locator (URL) of the first screen of the web page, but first determines whether a preset Resource package has pre-loading information matched with the first screen of the web page according to the URL of the first screen of the web page, and then requests to obtain the page data of the first screen of the web page according to the URL of the first screen of the web page if the pre-loading information does not exist in the Resource package.
It should be noted that the resource package is downloaded in advance and stored in the mobile phone, and when the content included in the resource package changes, the resource package may also be updated.
As an example, the resource package may include the following: a request method (GET, POST, etc.) for requesting the first screen of the web page, a URL for requesting the first screen of the web page, a heads object related to the request for requesting the first screen of the web page, a params for requesting the first screen of the web page, etc.
In an exemplary embodiment, referring to fig. 3, when receiving a request for accessing a first webpage screen in an application triggered by a user, determining whether a pre-loaded information matching the first webpage screen exists in a preset resource package according to a uniform resource locator of the first webpage screen includes: step S31, when receiving a webpage initial screen access request in an application program triggered by a user, generating a network request according to the access request, wherein the network request comprises a uniform resource locator of the webpage initial screen; step S32, the network request is intercepted, and whether the pre-loading information matched with the first screen of the webpage exists in the preset resource package is judged according to the uniform resource locator in the network request.
Specifically, when a user triggers a web page initial screen access request, a network request is generated according to the access request, so that the web page data corresponding to the web page initial screen can be requested to a server through the network request. After the network request is generated, the network request is intercepted, and whether the preloading information matched with the initial screen of the webpage exists in the resource package or not is judged according to the URL in the network request. Specifically, the URL included in the network request may be compared with the URLs included in the respective preloading information in the resource package, and if the URL identical to the URL included in the network request exists, it may be determined that the preloading information matching with the initial screen of the web page exists in the resource package. If the same URL as the URL contained in the network request does not exist, it can be determined that the preloading information matched with the initial screen of the webpage does not exist in the resource package.
And step S21, when the resource package is judged to have the preloading information, response data responding to the request body is obtained from the server according to the request body.
Specifically, when it is determined that the preloading information exists in the resource package, the response data responding to the request body can be directly obtained from the server through the request body, and the response data responding to the request body can be obtained from the server through the request body obtained after the analysis without waiting for the analysis of the page code of the first screen of the webpage, so that the time for obtaining the response data can be saved.
And step S22, receiving response data returned by the server, and storing the response data in the application program.
And step S23, when rendering the first screen of the webpage, acquiring the response data from the application program, and rendering the first screen of the webpage by adopting the response data.
Specifically, after response data returned by the server is received, the response data may be stored in the application program, so that when the first screen of the webpage needs to be rendered subsequently, the response data may be directly taken from the application program, and the first screen of the webpage is rendered by using the response data, thereby obtaining the first screen of the webpage.
According to the embodiment of the application, the request body used for acquiring the dynamic resources of the first webpage screen is stored in the resource packet, so that when a user accesses the first webpage screen, response data can be directly acquired from the server through the request bodies, the first webpage screen is rendered through the response data, the request body of the response data can be acquired after the page data of the first webpage screen is analyzed without waiting, and therefore the time for acquiring the response data is saved, the rendering speed of the first webpage screen in an application program is improved, and the waiting time of the user is reduced.
In an exemplary embodiment, referring to fig. 4, the method further comprises: step S40, when the resource package does not have the pre-loading information matched with the first screen of the webpage, acquiring the page data corresponding to the first screen of the webpage from the server through the network request; and step S41, rendering the first screen of the webpage by adopting the page data.
Specifically, when the resource package does not have the pre-loading information matched with the first webpage screen, the rendering of the first webpage screen can be realized through normal webpage screen rendering logic, namely, the webpage data are obtained by sending a network request to the server, and after the webpage data returned by the server are received, the webpage data are used for rendering the first webpage screen, so that the first webpage screen is displayed for a user.
In an exemplary embodiment, in order to obtain the preloaded information from the resource package in time when the user accesses the first screen of the web page, the method further includes:
when the application program is started, the resource package is requested to be downloaded to the server, the resource package comprises the offline resources of the first screens of the multiple webpages, and the offline resources of each first screen of the network comprise the preloading information of the first screen of the webpage.
In this embodiment, when the application program is started in a hot state or a cold state, the application program may request the server to download the resource package.
In an exemplary embodiment, referring to fig. 5, in order to avoid the repeated downloading of the resource package, which results in wasting network resources, in this embodiment, requesting to download the resource package from the server when the application starts includes:
step S50, when the application program is started, determine whether the resource package exists locally.
Specifically, after the application program is started, it may be determined whether the resource package exists locally, and when the resource package does not exist locally, the resource package may be requested to be downloaded to the server. When a resource package exists locally, whether the resource package is updated or not can be judged, and if the resource package is not updated, the resource package does not need to be requested to be downloaded to the server; and requesting the server to download the resource package if the resource package is updated.
Step S51, when the resource package exists locally, obtain a first hash value of each offline resource included in the resource package.
Specifically, in order to determine whether the locally stored resource package is the same as the resource package stored by 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.
Step S52, comparing each first hash value with a second hash value corresponding to each first hash value included in the server, where the second hash value is a hash value of each offline resource in the resource package in the server.
Specifically, the corresponding second hash value may be generated in advance for each offline resource in the resource package stored in the server, so that, when determining whether the local resource package is the same as the resource package in the server, it may be determined whether each offline resource is updated by comparing whether the first hash value is the same as the corresponding second hash value.
As an example, it is assumed that the locally stored resource package includes offline resource 1, offline resource 2, and offline resource 3, and the first hash values thereof are hash 1, hash 2, and hash 3, respectively. The resource packet in the server includes an offline resource a, an offline resource b, and an offline resource c, and the second hash values are hash a, hash b, and hash c, respectively, where the offline resource a, the offline resource b, and the offline resource c correspond to the offline resource 1, the offline resource 2, and the offline resource 3, respectively. When comparing, the hash 1 and the hash a, the hash 2 and the hash b, and the hash 3 and the hash c can be compared, if the comparison results are the same, it indicates that the offline resource is not changed, and if the comparison results are different, it indicates that the offline resource is updated.
Step S53, when the first hash value is different from the second hash value, requesting the server to download the offline resource corresponding to the second hash value.
Specifically, when a first hash value of the local offline resource to be currently compared is different from a second hash value of the offline resource to be currently compared, which is stored in the server, the offline resource corresponding to the second hash value may be requested to be downloaded from the server. When the first hash value of the current offline resource to be compared is the same as the second hash value of the corresponding offline resource, the server does not need to be requested to download the offline resource corresponding to the second hash value, and the comparison of the next offline resource stored in the local can be continued until all the offline resources are compared.
In an exemplary embodiment, in order to ensure timeliness and accuracy of data, the response data may be deleted from the application program after the response data is acquired from the application program. When the response data is detected not to be used within a preset time period, the response data can also be deleted from the application program.
In an exemplary embodiment, referring to fig. 6, when rendering the first webpage, the obtaining the response data from the application program, and rendering the first webpage using the response data includes: step S60, when rendering the first screen of the webpage, if the response data does not exist in the application program and the state of the request body is an undetermined state, waiting to receive the response data returned by the server, and storing the response data into the application program; and step S61, acquiring the response data from the application program, and rendering the first screen of the webpage by adopting the response data.
In this embodiment, when rendering the first screen of the web page, if the response data does not exist in the application program temporarily, but the request body exists, and the current state of the request body is a pending state (pending state), in order to increase the rendering speed of the first screen of the web page, the server may wait to receive the response data returned by the server, store the response data in the application program, then obtain the response data from the application program, and render the first screen of the web page by using the response data.
It should be noted that the pending state means that the task of obtaining response data from the server through the requesting body is neither honored nor denied.
According to the method and the device, the page data are acquired from the server in a waiting mode instead of directly through a network request, and the acquired page data are adopted to render the first screen of the webpage. The rendering speed of the first screen of the webpage can be improved.
In order to facilitate understanding of the present application, an implementation flow of a webpage first screen rendering method in an application program in the present application will be described in detail below with reference to a specific embodiment.
Referring to fig. 7, after the application program (APP) is started, the APP downloads the resource package from the remote server and stores the downloaded resource package in a preset storage space. When the downloaded resource package exists in the storage space, after the APP starts to download the resource package, the APP can 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 a user accesses a webpage initial screen in the APP, the APP judges whether an offline resource matched with a webpage link exists in a resource package according to the webpage link (URL) of the webpage initial screen accessed by the current user. When the resource package has the matched offline resource, the APP acquires a Request (Request body) required for loading the first screen of the webpage from the resource package, then acquires response data (response) responding to the Request body from the server through the Request, and stores the response data in the APP local after acquiring the response data returned by the server. When the APP needs to render the first screen of the webpage, response data can be obtained from the APP locally, and the first screen of the webpage is rendered by adopting the response data.
In this embodiment, when the APP determines that there is no matched offline resource in the resource package according to a web page link (URL) of a first screen of a web page accessed by a current user, the APP initializes HTML of the first screen of the web page through the browser, and then the browser sends a network request to obtain response data corresponding to the first screen of the web page from the server. When the browser sends a network request to acquire response data, the APP intercepts the network request, then judges whether the APP locally has the response data, and renders the first screen of the webpage by adopting the locally stored response data when judging that the APP locally has the response data. When the APP judges that the APP does not have response data locally, the APP can acquire the response data from the server through the browser, and then the APP can render the first screen of the webpage by using the response data acquired by the browser.
Fig. 8 is a block diagram of an embodiment of a webpage first screen rendering apparatus 70 in the application program of the present application.
In this embodiment, the first webpage rendering apparatus 70 in the application program includes a series of computer program instructions stored in a memory, and when the computer program instructions are executed by a processor, the first webpage rendering function in the application program according to the embodiments of the present application can be implemented. In some embodiments, based on the specific operations implemented by the computer program instructions, the first webpage rendering apparatus 70 in the application program may be divided into one or more modules, which may be specifically divided as follows:
the determining module 71 is configured to, when receiving a webpage initial screen access request in an application triggered by a user, determine whether a pre-loading information matched with the webpage initial screen exists in a preset resource package according to a uniform resource locator of the webpage initial screen, where the pre-loading information includes a request body for acquiring a dynamic resource of the webpage initial screen;
an obtaining module 72, configured to, when it is determined that the preloading information exists in the resource package, obtain, from the server, response data responding to the request body according to the request body;
a storage module 73, configured to receive response data returned by the server, and store the response data in the application program;
and a rendering module 74, configured to, when rendering the first screen of the web page, obtain the response data from the application program, and render the first screen of the web page by using the response data.
In an exemplary embodiment, the determining module 71, when receiving an access request of a first screen of a webpage in an application triggered by a user, generates a network request according to the access request, where the network request includes a uniform resource locator of the first screen of the webpage; and intercepting the network request, and judging whether pre-loading information matched with the first screen of the webpage exists in a preset resource packet according to a uniform resource locator in the network request.
In an exemplary embodiment, the obtaining module 72 is further configured to, when there is no pre-loading information matched with the first screen of the web page in the resource package, obtain, by the network request, page data corresponding to the first screen of the web page from the server.
The rendering module 74 is further configured to render the first screen of the webpage by using the page data.
In an exemplary embodiment, the first webpage rendering apparatus 70 in the application further includes a request module.
The request module is used for requesting the server to download the resource package when the application program is started, wherein the resource package comprises the offline resources of a plurality of webpage initial screens, and the offline resources of each network initial screen comprise the preloading information of the webpage initial screen.
In an exemplary embodiment, the request module is further configured to determine whether the resource package exists locally when the application program is started; when the resource package exists locally, acquiring a first hash value of each offline resource contained in the resource package; comparing each first hash value with a second hash value contained in the server and corresponding to each first hash value, wherein the second hash value is the hash value of each offline resource in a resource packet in the server; and when the first hash value is different from the second hash value, requesting the server to download the offline resource corresponding to the second hash value.
In an exemplary embodiment, the first webpage rendering apparatus 70 in the application further includes a deletion module.
The deleting module is used for deleting the response data from the application program after the response data is acquired from the application program; and deleting the response data from the application program when detecting that the response data is not used within a preset time period.
In an exemplary embodiment, the rendering module 74 is further configured to, when rendering the first screen of the webpage, wait to receive response data returned by the server if the response data does not exist in the application program and the state of the request body is an undetermined state, and store the response data into the application program; and acquiring the response data from the application program, and rendering the first screen of the webpage by adopting the response data.
In this embodiment, the request bodies for acquiring the dynamic resources of the first webpage screen are stored in the resource packet, so that when a user accesses the first webpage screen, the user can directly acquire response data from the request bodies to the server and use the response data to render the first webpage screen, and the request bodies for acquiring the response data can be acquired without waiting for analyzing the page data of the first webpage screen, thereby saving the time for acquiring the response data, improving the rendering speed of the first webpage screen in an application program, and reducing the waiting time of the user.
Fig. 9 schematically shows a hardware architecture diagram of a computer device 8 suitable for implementing a webpage first screen rendering method in an application according to an embodiment of the present application. In the present embodiment, the computer device 8 is a device capable of automatically performing numerical calculation and/or information processing in accordance with a command set or stored in advance. For example, the server may be a tablet computer, a notebook computer, a desktop computer, a rack server, a blade server, a tower server, or a rack server (including an independent server or a server cluster composed of a plurality of servers). As shown in fig. 9, the computer device 8 includes at least, but is not limited to: the memory 120, processor 121, and network interface 122 may be communicatively linked to each other by a system bus. Wherein:
the memory 120 includes at least one type of computer-readable storage medium, which may be volatile or non-volatile, and particularly, includes a flash memory, a hard disk, a multimedia card, a card type memory (e.g., 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, and the like. In some embodiments, the storage 120 may be an internal storage module of the computer device 8, such as a hard disk or a memory of the computer device 8. In other embodiments, the memory 120 may also be an external storage device of the computer device 8, such as a plug-in hard disk provided on the computer device 8, a Smart Media Card (SMC), a Secure Digital (SD) Card, a Flash memory Card (Flash Card), and the like. Of course, the memory 120 may also include both internal and external memory modules of the computer device 8. In this embodiment, the memory 120 is generally used for storing an operating system installed in the computer device 8 and various types of application software, such as program codes of a webpage first screen rendering method in an application program. In addition, the memory 120 may also be used to temporarily store various types of data that have been output or are to be output.
Processor 121 may be, in some embodiments, 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 configured 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 configured to execute the program code stored in the memory 120 or process data.
Network interface 122 may comprise a wireless network interface or a wired network interface, with network interface 122 typically being used to establish communication links between computer device 8 and other computer devices. For example, the network interface 122 is used to connect the computer device 8 with an external terminal via a network, establish a data transmission channel and a communication link between the computer device 8 and the external terminal, and the like. The network may be a wireless or wired network such as an Intranet (Intranet), the Internet (Internet), a Global System of Mobile communication (GSM), Wideband Code Division Multiple Access (WCDMA), a 4G network, a 5G network, Bluetooth (Bluetooth), or Wi-Fi.
It is noted that FIG. 9 only shows a computer device having components 120-122, but it is understood that not all of the shown components are required to be implemented, and that more or fewer components may be implemented instead.
In this embodiment, the method for rendering the first screen of the webpage stored in the application program in the memory 120 may be divided into one or more program modules and executed by one or more processors (in this embodiment, the processor 121) to complete the present application.
The embodiment of the application provides a computer-readable storage medium, on which a computer program is stored, and the computer program, when executed by a processor, implements the steps of the webpage first screen rendering method in the application program in the embodiment.
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, 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, and the like. In some embodiments, the computer readable storage medium may be an internal storage unit of the computer device, such as a hard disk or a memory of the computer device. In other embodiments, the computer readable storage medium may be an external storage device of the computer device, such as a plug-in hard disk, a Smart Media Card (SMC), a Secure Digital (SD) Card, a Flash memory Card (Flash Card), and the like provided on the computer device. Of course, the computer-readable storage medium may also include both internal and external storage devices of the computer device. In this embodiment, the computer-readable storage medium is generally used to store an operating system and various types of application software installed in the computer device, for example, program codes of a first screen rendering method of a web page in an application program in the embodiment, and the like. Further, the computer-readable storage medium may also be used to temporarily store various types of data that have been output or are to be output.
The above-described embodiments of the apparatus are merely illustrative, and the units described as separate parts may or may not be physically separate, and the parts displayed as units may or may not be physical units, may be located in one place, or may be distributed on at least two network units. Some or all of the modules can be screened out according to actual needs to achieve the purpose of the scheme of the embodiment of the application. One of ordinary skill in the art can understand and implement it without inventive effort.
Through the above description of the embodiments, those skilled in the art will clearly understand that each embodiment can be implemented by software plus a general hardware platform, and certainly can also be implemented by hardware. It will be understood by those skilled in the art that all or part of the processes of the methods of the embodiments described above can be implemented by hardware related to instructions of a computer program, which can be stored in a computer readable storage medium, and when executed, can include the processes of the embodiments of the methods described above. The storage medium may be a magnetic disk, an optical disk, a Read-only memory (ROM), a Random Access Memory (RAM), or the like.
Finally, it should be noted that: the above embodiments are only used for illustrating the technical solutions of the present application, and not for limiting the same; although the present application has been described in detail with reference to the foregoing embodiments, it should be understood by those of ordinary skill in the art that: the technical solutions described in the foregoing embodiments may still be modified, or some or all of the technical features may be equivalently replaced; and the modifications or the substitutions do not make the essence of the corresponding technical solutions depart from the scope of the technical solutions of the embodiments of the present application.
Claims (10)
1. A method for rendering a first screen of a webpage in an application program is characterized by comprising the following steps:
when a webpage initial screen access request in an application program triggered by a user is received, judging whether pre-loading information matched with the webpage initial screen exists in a preset resource package according to a uniform resource locator of the webpage initial screen, wherein the pre-loading information comprises a request body used for acquiring dynamic resources of the webpage initial screen;
when the resource package is judged to have the preloading information, response data responding to the request body is obtained from a server according to the request body;
receiving response data returned by the server, and storing the response data into the application program;
and when the first webpage screen is rendered, acquiring the response data from the application program, and rendering the first webpage screen by adopting the response data.
2. The method for rendering the first screen of the webpage in the application program according to claim 1, wherein when receiving a request for accessing the first screen of the webpage in the application program triggered by a user, determining whether pre-loading information matched with the first screen of the webpage exists in a preset resource package according to a uniform resource locator of the first screen of the webpage comprises:
when a webpage initial screen access request in an application program triggered by a user is received, generating a network request according to the access request, wherein the network request comprises a uniform resource locator of the webpage initial screen;
and intercepting the network request, and judging whether pre-loading information matched with the first screen of the webpage exists in a preset resource packet according to a uniform resource locator in the network request.
3. The method for rendering the first screen of the webpage in the application program according to claim 2, wherein the method further comprises the following steps:
when the resource package does not contain the preloading information matched with the first webpage screen, acquiring page data corresponding to the first webpage screen from the server through the network request;
and rendering the first screen of the webpage by adopting the page data.
4. The method for rendering the first screen of the webpage in the application program according to claim 1, wherein the method further comprises the following steps:
when the application program is started, the resource package is requested to be downloaded to the server, the resource package comprises the offline resources of the first screens of the multiple webpages, and the offline resources of each first screen of the network comprise the preloading information of the first screen of the webpage.
5. The method for rendering the first screen of the webpage in the application program according to claim 4, wherein the requesting the server to download the resource package when the application program is started comprises:
when the application program is started, judging whether the resource packet exists locally;
when the resource package exists locally, acquiring a first hash value of each offline resource contained in the resource package;
comparing each first hash value with a second hash value contained in the server and corresponding to each first hash value, wherein the second hash value is the hash value of each offline resource in a resource packet in the server;
and when the first hash value is different from the second hash value, requesting the server to download the offline resource corresponding to the second hash value.
6. The method for rendering the first screen of the webpage in the application program according to any one of claims 1 to 5, wherein the method further comprises the following steps:
deleting the response data from the application program after the response data is acquired from the application program; and
and when the response data is detected not to be used within a preset time period, deleting the response data from the application program.
7. The method for rendering the first screen of the webpage in the application program according to claim 6, wherein when the first screen of the webpage is rendered, the step of obtaining the response data from the application program and rendering the first screen of the webpage by using the response data comprises:
when the first screen of the webpage is rendered, if the response data does not exist in the application program and the state of the request body is in an undetermined state, waiting for receiving the response data returned by the server and storing the response data into the application program;
and acquiring the response data from the application program, and rendering the first screen of the webpage by adopting the response data.
8. A webpage first screen rendering device in an application program is characterized by comprising:
the system comprises a judging module, a judging module and a judging module, wherein the judging module is used for judging whether pre-loading information matched with a webpage first screen exists in a preset resource package according to a uniform resource locator of the webpage first screen when a webpage first screen access request in an application program triggered by a user is received, and the pre-loading information comprises a request body used for acquiring dynamic resources of the webpage first screen;
the acquisition module is used for acquiring response data responding to the request body from a server according to the request body when the resource package is judged to have the preloading information;
the storage module is used for receiving response data returned by the server and storing the response data into the application program;
and the rendering module is used for acquiring the response data from the application program when rendering the first webpage screen and rendering the first webpage screen by adopting the response data.
9. A computer device comprising a memory, a processor and a computer program stored on the memory and executable on the processor, the processor implementing the steps of the method of any one of claims 1 to 7 when executing the computer program.
10. A computer-readable storage medium having stored thereon a computer program, characterized in that: the computer program, when executed by a processor, implementing the steps of the method of any one of claims 1 to 7.
Priority Applications (1)
| Application Number | Priority Date | Filing Date | Title |
|---|---|---|---|
| CN202111181010.6A CN113934954A (en) | 2021-10-11 | 2021-10-11 | Webpage first screen rendering method and device in application program |
Applications Claiming Priority (1)
| Application Number | Priority Date | Filing Date | Title |
|---|---|---|---|
| CN202111181010.6A CN113934954A (en) | 2021-10-11 | 2021-10-11 | Webpage first screen rendering method and device in application program |
Publications (1)
| Publication Number | Publication Date |
|---|---|
| CN113934954A true CN113934954A (en) | 2022-01-14 |
Family
ID=79278121
Family Applications (1)
| Application Number | Title | Priority Date | Filing Date |
|---|---|---|---|
| CN202111181010.6A Pending CN113934954A (en) | 2021-10-11 | 2021-10-11 | Webpage first screen rendering method and device in application program |
Country Status (1)
| Country | Link |
|---|---|
| CN (1) | CN113934954A (en) |
Cited By (1)
| Publication number | Priority date | Publication date | Assignee | Title |
|---|---|---|---|---|
| CN114357339A (en) * | 2022-03-17 | 2022-04-15 | 杭州互链互联网技术有限公司 | Page loading method and device and storage medium |
-
2021
- 2021-10-11 CN CN202111181010.6A patent/CN113934954A/en active Pending
Cited By (1)
| Publication number | Priority date | Publication date | Assignee | Title |
|---|---|---|---|---|
| CN114357339A (en) * | 2022-03-17 | 2022-04-15 | 杭州互链互联网技术有限公司 | Page loading method and device and storage medium |
Similar Documents
| Publication | Publication Date | Title |
|---|---|---|
| CN106294648B (en) | Processing method and device for page access path | |
| CN106294658B (en) | Webpage quick display method and device | |
| US9275018B2 (en) | Techniques for analyzing web pages to determine font subsets | |
| CN108874922B (en) | Client device, webpage rendering method based on single page application and storage medium | |
| US20170300459A1 (en) | Card-type desktop implementation method and apparatus | |
| WO2008112103A1 (en) | Selectively updating web pages on a mobile client | |
| CN112637361B (en) | Page proxy method, device, electronic equipment and storage medium | |
| CN111431767B (en) | Multi-browser resource synchronization method and device, computer equipment and storage medium | |
| CN112612982A (en) | Webpage preloading method and device and computer equipment | |
| CN109190067B (en) | Browser input box display method and device, computer equipment and storage medium | |
| US11930096B2 (en) | Systems and methods for rendering interactive web pages | |
| CN111339456B (en) | Preloading method and device | |
| CN111079048B (en) | Page loading method and device | |
| CN113934954A (en) | Webpage first screen rendering method and device in application program | |
| US10095791B2 (en) | Information search method and apparatus | |
| US9485330B2 (en) | Web browser operation method and system | |
| CN111783005A (en) | Method, apparatus and system for displaying web page, computer system and medium | |
| CN112672187B (en) | Page generation method and device, computer equipment and readable storage medium | |
| CN111273964A (en) | Data loading method and device | |
| US20190384862A1 (en) | Scalable Whittled Proxy Execution for Low-Latency Web Over Cellular Networks | |
| US9239831B2 (en) | Data localization service made available by a web browser | |
| US8402367B1 (en) | Smart reload pages | |
| CN111756744B (en) | H5 user identification method, device, equipment and storage medium | |
| CN113934953A (en) | Webpage first screen rendering method and device | |
| CN113297515A (en) | Resource information processing method and device, computer storage medium and electronic equipment |
Legal Events
| Date | Code | Title | Description |
|---|---|---|---|
| PB01 | Publication | ||
| PB01 | Publication | ||
| SE01 | Entry into force of request for substantive examination | ||
| SE01 | Entry into force of request for substantive examination |