HTML5 page loading method and device, equipment and storage medium
By obtaining the interface configuration information of HTML5 pages in the APP application and sending preload configuration requests, loading HTML5 page data in advance and storing it in the local cache, the problem of long loading time of HTML5 pages is solved, and the user experience and page loading efficiency are improved.
Patent Information
- Application Number
- CN202411945333.1
- Authority / Receiving Office
- CN · China
- Patent Type
- Applications(China)
- Current Assignee / Owner
- Filing Date
- 2024-12-26
- Publication Date
- 2025-05-06
AI Technical Summary
In APP applications, HTML5 page loading time is long, resulting in an increase in user waiting time and affecting user experience.
By obtaining the interface configuration information of the HTML5 page when the application is cold-started, and when the WebView opens the HTML5 page, it sends a preload configuration request to the server based on the interface configuration information, loading the page data in advance, and storing the data in the local cache.
It greatly shortens the time for users to wait for HTML5 page display, improves user experience, reduces the impact of network delay on page loading, and ensures timely data acquisition.
Smart Images

Figure CN119939056A_ABST
Abstract
Description
Technical Field
[0001] The present invention relates to the field of artificial intelligence technology, and in particular to an HTML5 page loading method, device, equipment and storage medium. Background Art
[0002] With the development of mobile Internet, WebView containers are increasingly used in APP applications to display HTML5 pages. However, in existing technical implementations, when users access single-page HTML5 pages through WebView in APP applications, there is a significant problem: since HTML5 pages need to obtain resources and page data from the server, this process often results in a long page loading time. Users need to wait for a long time to see the complete page content during the operation, which greatly affects the user experience. For example, in some e-commerce apps, when users click on the product details page (usually an HTML5 page), they may not be able to view the product information in time due to slow page loading, and may even cause users to give up the operation, affecting business conversion rate. Therefore, how to reduce the loading time of HTML5 pages in WebView and improve user experience has become a technical problem that needs to be solved urgently. Summary of the invention
[0003] In view of this, the present invention provides an HTML5 page loading method, apparatus, device and storage medium to solve the problem that HTML5 pages need to obtain resources and page data from a server, which results in a long page loading time.
[0004] In a first aspect, the present invention provides an HTML5 page loading method, which is used on a platform side, wherein the platform side includes an application program, and the platform side is connected to a server; the method comprises:
[0005] When the application is cold started, the interface configuration information of the HTML5 page to be configured is obtained; when the WebView in the application opens the HTML5 page to be configured, the page resources are obtained and a preload configuration request is sent to the server based on the interface configuration information, so that the server loads the page data based on the preload configuration request; the page data sent by the server is received and stored in the local cache; when the page resources are downloaded, the page data is obtained from the local cache; the HTML5 page to be configured is rendered based on the page data and the target HTML5 page is generated.
[0006] The HTML5 page loading method provided by the present invention obtains the interface configuration information of the HTML5 page when the application is cold started, and can prepare for the subsequent page loading in advance. Further, after the WebView opens the HTML5 page, a preload configuration request is sent to the server based on the previously obtained interface configuration information while obtaining the page resources. Through this synchronous operation, the server can prepare the page data in advance, instead of waiting for the page resources to be downloaded and then requesting the data, which greatly shortens the time for the user to wait for the HTML5 page to be displayed. Further, the page data sent by the server is stored in the local cache, and when the same or similar page is accessed again later, the data can be directly obtained from the local cache, avoiding repeated acquisition from the server, and reducing the impact of network delay on page loading. Further, when the page resources are downloaded, the page data is immediately obtained from the local cache, ensuring the timeliness of data acquisition. Finally, rendering is performed based on the obtained page data, and finally a user-visible HTML5 page is generated, which reduces the user waiting time. Therefore, through the real-time present invention, by requesting page data while obtaining page resources, the user's waiting time for the HTML5 page to be displayed is greatly shortened, and the user experience is improved.
[0007] In an optional implementation, when the WebView in the application opens the HTML5 page to be configured, the page resources are obtained and a preload configuration request is sent to the server based on the interface configuration information, so that the server loads the page data based on the preload configuration request, including:
[0008] When the WebView in the application opens the HTML5 page to be configured, the WebView is used to perform navigation operations; based on the navigation operation, the WebView checks whether there are valid page resources in the local cache; when there are no valid page resources, it is determined whether to establish a connection with the server through the preset transmission control protocol; when a connection is established with the server, the page resources are obtained and a preload configuration request is sent to the server based on the interface configuration information, so that the server loads the page data based on the preload configuration request.
[0009] The HTML5 page loading method provided by the present invention performs navigation operations through WebView, and can organize and request page resources according to the established navigation logic when opening a page, which helps to standardize the page loading process and ensure the orderliness and efficiency of page loading. Further, during the navigation operation, the local cache is checked to timely find out whether the existing local page resources can be used. If there are valid resources, they can be used directly to avoid unnecessary network requests and further speed up the page loading speed. Further, when there are no available resources in the local cache, the connection status with the server is judged by the preset transmission control protocol, ensuring the reliability and timeliness of the connection when resources need to be obtained from the server. Finally, after establishing a connection with the server, the page resource download and preload configuration request are immediately performed, which can make full use of the network connection and allow the server to prepare the page data in advance, instead of waiting for the page resource download to complete before requesting the data, which greatly shortens the time the user waits for the HTML5 page to be displayed.
[0010] In an optional implementation, when there is no valid page resource, determining whether to establish a connection with the server through a preset transmission control protocol includes:
[0011] When there is no valid page resource, the domain name of the HTML5 page to be configured is resolved and the target address is obtained; based on the target address, a connection is established with the server through a preset transmission control protocol.
[0012] The HTML5 page loading method provided by the present invention resolves the domain name of the HTML5 page to be configured and obtains the target address when there is no valid page resource. Through accurate domain name resolution, it can ensure that the correct server is found to obtain page resources, avoiding loading failure or delay caused by address errors. Further, based on the accurate target address and using the preset transmission control protocol to establish a connection, the correctness and stability of the connection are guaranteed, providing support for subsequent ensuring that page resources and data can be smoothly transmitted between the server and WebView.
[0013] In an optional implementation, when establishing a connection with a server, obtaining page resources includes:
[0014] When a connection is established with the server, a resource request is sent to the server, so that the server loads page resources based on the resource request; and the page resources sent by the server are received.
[0015] The HTML5 page loading method provided by the present invention timely sends a resource request after establishing a connection with the server, so that the server can load the page resources according to the request, thereby enabling the server to provide the resources required for the page in a targeted manner, avoiding unnecessary resource search and processing by the server, and improving the resource acquisition efficiency. Furthermore, by accurately receiving the page resources, support is provided for subsequently ensuring that the page can be fully presented to the user.
[0016] In an optional embodiment, the method further includes:
[0017] When the application is cold started and the interface configuration information is not obtained, the interface configuration information of the HTML5 page to be configured is obtained through an online loading method.
[0018] The HTML5 page loading method provided by the present invention obtains the interface configuration information through an online loading method when the application is cold started and the interface configuration information is not obtained, thereby ensuring that the configuration information can be supplemented in time even when the initial configuration is missing, providing a complete configuration basis for subsequent page loading operations, and avoiding the problem of the page not being able to load normally or loading slowly due to missing configuration.
[0019] In an optional embodiment, the method further includes:
[0020] When the page resource download is complete and the page data is not obtained from the local cache, the operation of sending the preload configuration request to the server is repeated until the page data sent by the server is received.
[0021] The HTML5 page loading method provided by the present invention repeatedly sends a preloading configuration request when the local cache fails to obtain the page data, thereby ensuring that the page data can be finally obtained. Furthermore, the method can cope with network fluctuations or abnormal server responses, thereby ensuring the integrity and availability of the page data, preventing the problem of the page being unable to be rendered or partial content being missing, and improving the reliability of page loading.
[0022] In a second aspect, the present invention provides an HTML5 page loading device, which is used on a platform side, wherein the platform side includes an application program, and the platform side is connected to a server; the device includes:
[0023] The first acquisition module is used to obtain the interface configuration information of the HTML5 page to be configured when the application is cold started; the download and send module is used to obtain the page resources and send a preload configuration request to the server based on the interface configuration information when the WebView in the application opens the HTML5 page to be configured, so that the server loads the page data based on the preload configuration request; the receiving and storage module is used to receive the page data sent by the server and store the page data in the local cache; the second acquisition module is used to obtain the page data from the local cache when the page resource download is completed; the rendering and generation module is used to render the HTML5 page to be configured based on the page data and generate the target HTML5 page.
[0024] In a third aspect, the present invention provides a computer device, comprising: a memory and a processor, the memory and the processor being communicatively connected to each other, the memory storing computer instructions, and the processor executing the HTML5 page loading method of the first aspect or any corresponding embodiment thereof by executing the computer instructions.
[0025] In a fourth aspect, the present invention provides a computer-readable storage medium having computer instructions stored thereon, the computer instructions being used to enable a computer to execute the HTML5 page loading method of the first aspect or any corresponding embodiment thereof.
[0026] In a fifth aspect, the present invention provides a computer program product, comprising computer instructions, wherein the computer instructions are used to enable a computer to execute the HTML5 page loading method of the above-mentioned first aspect or any corresponding embodiment thereof. BRIEF DESCRIPTION OF THE DRAWINGS
[0027] In order to more clearly illustrate the specific implementation methods of the present invention or the technical solutions in the prior art, the drawings required for use in the specific implementation methods or the description of the prior art will be briefly introduced below. Obviously, the drawings described below are some implementation methods of the present invention. For ordinary technicians in this field, other drawings can be obtained based on these drawings without paying creative work.
[0028] Figure 1 is a schematic diagram of a process flow of an HTML5 page rendering solution according to an embodiment of the present invention;
[0029] Figure 2 is a schematic flow chart of an HTML5 page loading method according to an embodiment of the present invention;
[0030] Figure 3 is a flow chart of another HTML5 page loading method according to an embodiment of the present invention;
[0031] Figure 4It is a flowchart of the H5 page preloading technical solution according to an embodiment of the present invention;
[0032] Figure 5 is a schematic diagram of the H5 page preloading process according to an embodiment of the present invention;
[0033] Figure 6 is a structural block diagram of the XX device according to an embodiment of the present invention;
[0034] Figure 7 It is a schematic diagram of the hardware structure of a computer device according to an embodiment of the present invention. DETAILED DESCRIPTION
[0035] In order to make the purpose, technical solution and advantages of the embodiments of the present invention clearer, the technical solution in the embodiments of the present invention will be clearly and completely described below in conjunction with the drawings in the embodiments of the present invention. Obviously, the described embodiments are part of the embodiments of the present invention, not all of the embodiments. Based on the embodiments of the present invention, all other embodiments obtained by those skilled in the art without creative work are within the scope of protection of the present invention.
[0036] like Figure 1 As shown, existing HTML5 page rendering solutions include:
[0037] 1. Open webview, access the H5 page, initialize the H5 link loadRequest, set the page navigation decidePolicyForNavigationAction, and send the link request navigationStart;
[0038] 2. Check whether the current link exists from AppCache and the server. If the link exists, start a TCP link and start a three-way handshake with the server to verify that the end and the server have the ability to send and receive;
[0039] 3. After the verification is successful, start sending requestStart of the page resource. If the request is successful, receive the response responseStart returned by the server and accept the completion responseEnd;
[0040] 4.webview starts to accept resources obtained from the server, requests the service interface to obtain the page data to be rendered, completes the interface request, gets the returned data, starts rendering the page, enters the loading state, DOM rendering completes domComplete, and triggers the end event loadEventEnd;
[0041] 5. Page rendering is completed, didFinishNavigation.
[0042] It can be seen that the overall page request is divided into page resources and page data, the interaction between the two is serial, and the overall time consumption is relatively long.
[0043] The embodiment of the present invention provides an HTML5 page loading method, which greatly shortens the time a user waits for the display of an HTML5 page by requesting page data while acquiring page resources, thereby improving the user experience.
[0044] According to an embodiment of the present invention, an embodiment of an HTML5 page loading method is provided. It should be noted that the steps shown in the flowchart of the accompanying drawings can be executed in a computer system such as a set of computer executable instructions, and although a logical order is shown in the flowchart, in some cases, the steps shown or described can be executed in an order different from that shown here.
[0045] In this embodiment, an HTML5 page loading method is provided, which can be used for a platform side. Further, the platform side includes an application (APP) and the platform side is connected to a server. The number of the application (APP) can be one or more.
[0046] Specifically, the platform side can provide support for the operation of the HTML5 page loading method. Taking the mobile application scenario as an example, the platform side can refer to a mobile operating system (such as Android or iOS) and its related operating environment.
[0047] Furthermore, the application (APP) represents a software entity running on the platform side. In this embodiment, the application (APP) represents a carrier for implementing specific business logic and user interaction functions, and can realize its own functions by calling the resources and interfaces provided by the platform side.
[0048] Figure 2 is a flowchart of an HTML5 page loading method according to an embodiment of the present invention. Figure 2 As shown, the process includes the following steps:
[0049] Step S201, when the application is cold started, the interface configuration information of the HTML5 page to be configured is obtained.
[0050] Among them, application cold start refers to the process when the application starts from a completely non-running state (that is, no resident process in memory). For example, when you click an application icon that has not been opened for a long time on a mobile phone, the system starts the application from scratch, which is a cold start.
[0051] Furthermore, HTML5 pages refer to web pages written in HTML5 (Hypertext Markup Language) technology, which have rich functions, including multimedia support, local storage, offline applications, 2D / 3D drawing, etc. In mobile application development, HTML5 pages are usually displayed through WebView to achieve dynamic content and cross-platform effects.
[0052] Furthermore, the interface configuration information represents the relevant configuration parameters used to interact with the server to obtain HTML5 page data and resources, which may include the server address, interface call method, request parameter format, data return format, etc., and can guide the application on how to correctly send requests to the server and obtain the required page data.
[0053] Specifically, when the application is cold started, the platform can first check whether there is pre-stored HTML5 page interface configuration information locally. This information may be stored in the internal storage area of the application and saved in a specific file format (such as XML, JSON, etc.).
[0054] Furthermore, the application can read these configuration files according to the predetermined path and file format. For example, if the configuration file is stored in the path " / app / configs / h5_interface_config.json", the application will try to open the file and parse the content to obtain the interface configuration information.
[0055] Step S202, when the WebView in the application opens the HTML5 page to be configured, the page resources are obtained and a preload configuration request is sent to the server based on the interface configuration information, so that the server loads the page data based on the preload configuration request.
[0056] Among them, WebView represents a component that embeds browser functions within an application, allowing the application to directly display the content of an HTML5 page.
[0057] Furthermore, the preload configuration request may be constructed according to the interface configuration information.
[0058] Specifically, when the WebView in the application opens the HTML5 page to be configured, the corresponding page resources can be obtained at this time, and while obtaining the page resources, a preload configuration request can be sent to the server based on the previously obtained interface configuration information. This synchronous operation allows the server to prepare page data in advance, instead of waiting for the page resources to be downloaded before requesting data, which greatly shortens the time users wait for the HTML5 page to be displayed.
[0059] Furthermore, after receiving the preloading configuration request, the server may process it according to the parameters and configuration information in the preloading configuration request.
[0060] Specifically, the server can search and load the corresponding page data from a database or other data storage. For example, if the preload configuration request is to obtain the user's personalized recommendation data, the server can query the user's historical behavior data and related recommendation algorithms to generate and load the corresponding recommendation data.
[0061] Furthermore, through the above preloading mechanism, the server can prepare the data required for page rendering in advance while WebView continues to download page resources. Then, when WebView completes downloading page resources and is ready to render, the server has already prepared the relevant data, which can greatly shorten the time users wait for the page to be fully rendered and improve the user experience.
[0062] Step S203: receiving the page data sent by the server and storing the page data in a local cache.
[0063] Specifically, after the server completes loading of the page data based on the preload configuration request received previously, the corresponding page data can be sent back to the client environment where the WebView in the application is located.
[0064] Furthermore, during the above process, WebView can maintain a network connection with the server and start a corresponding monitoring mechanism, always ready to receive data from the server. For example, when a user downloads a file online, the download tool will continue to wait for the server to transmit the file content.
[0065] In an optional real-time mode, when receiving data, WebView can perform integrity check on the received data to ensure that the data is not lost, damaged or tampered with during transmission. The verification method can be through data checksum, hash value comparison, or checking whether the length and format of the data meet expectations.
[0066] Furthermore, after WebView receives the page data sent by the server, it can select an appropriate local cache method to store the page data according to the design of the application and the cache strategy adopted.
[0067] Among them, the local cache mode can be memory cache, file cache, database cache, etc.
[0068] Furthermore, after determining the local cache mode, WebView can perform corresponding storage operations to store the received page data in the local cache in an orderly manner according to the selected mode.
[0069] In an optional implementation, the application can also manage the local cache, such as setting the cache validity period, cache size limit, etc. When the cache reaches a certain capacity or the data expires, the cache content can be automatically cleaned or updated to ensure that the cache is always in a reasonable and efficient state, which can meet the needs of quickly obtaining page data without taking up too much storage space of the device.
[0070] Step S204, when the page resource download is completed, the page data is obtained from the local cache.
[0071] Specifically, WebView can monitor the resource download process, and when it is determined that the page resource download is complete, it can perform data retrieval in the local cache and obtain the corresponding page data according to the local cache method described in step S203.
[0072] Step S205: Render the HTML5 page to be configured based on the page data and generate a target HTML5 page.
[0073] Specifically, the page data may be used to render the HTML5 page to be configured and generate a target HTML5 page visible to the user after the rendering is completed.
[0074] In an optional implementation, page rendering and generating a target HTML5 page may be performed in the following manner:
[0075] (1) HTML file parsing: The parser in WebView can read the HTML file content in the page data line by line according to the HTML syntax rules and identify different tag elements, such as the root element representing the entire page, including the main content of the page. To define a paragraph, Used to insert pictures, etc.
[0076] Furthermore, the parser can distinguish the start and end of these tags and their nesting relationships. For example, when parsing an HTML fragment containing images and text, it can accurately determine the text wrapped in Tags, images by The tags are introduced and placed in the appropriate page hierarchy position.
[0077] (2) Generation of DOM tree: A Document Object Model (DOM) tree can be constructed based on the parsing results of the HTML file.
[0078] Among them, the DOM tree represents a tree structure, which represents each element in the web page in the form of nodes. The tag is the root node, and the nodes corresponding to the tags such as and below are child nodes. Further down, the tags corresponding to each specific page element also have corresponding nodes, and form a hierarchical tree structure according to their nested relationship in the HTML file.
[0079] For example, in an HTML file of a simple product display page, there will be a node representing a product image under its DOM tree. Node, representing the product description text Nodes, etc., through this tree structure, the logical architecture of the entire page is clearly displayed, providing a clear element relationship diagram for subsequent rendering operations.
[0080] (3) Style matching and association: After the DOM tree structure is determined, the CSS style in the page data can be applied to the corresponding DOM elements.
[0081] Among them, the CSS style sheet can specify the range of elements to which the style is to be applied through various selectors (such as tag selectors, class selectors, ID selectors, etc.).
[0082] Furthermore, WebView can traverse each node in the DOM tree and match the corresponding style declaration according to the CSS selector rules. For example, if there is a CSS rule "img{width:200px;height:200px;}", it means that all The width and height of the image element corresponding to the tag are both set to 200 pixels. When traversing the DOM tree, Node, you can apply this style attribute to the image element represented by the node, thereby determining the size of the image on the page and giving the page element a specific visual presentation effect.
[0083] (4) Style cascading: CSS has cascading properties, which means that multiple style rules may act on the same element. At this time, it is necessary to determine the final applied style according to a certain priority.
[0084] Specifically, WebView can follow the CSS cascading rules, such as inline styles (style attributes written directly in HTML tags) have higher priority than internal style sheets (written in the HTML file part). <style>标签内的样式),而内部样式表又高于外部样式表(通过<link>标签引入的独立的CSS文件)等。
[0085] 进一步,通过合理处理样式的层叠关系,可以确保每个DOM元素都能呈现出正确的外观样式,使得整个页面的布局和视觉风格逐步清晰和确定下来。
[0086] (5)脚本解析与运行环境搭建:对于页面数据中包含的JavaScript脚本,WebView可以先搭建相应的脚本解析和运行环境。
[0087] (6)交互功能实现:JavaScript脚本可以操作DOM元素来实现各种交互功能。
[0088] 例如,页面上有一个按钮元素,通过JavaScript可以为其绑定点击事件,当用户点击这个按钮时,对应的JavaScript函数就会被执行,可以改变某个DOM元素的显示状态(如隐藏或显示一个元素),或者向服务器发送请求获取新的数据来更新页面内容等。
[0089] 进一步,通过执行脚本代码,页面不再是静态的展示,而是具备了动态交互的能力,能够根据用户的操作做出实时响应,增强了用户在页面浏览过程中的参与感和体验感。
[0090] (7)首屏渲染优化:WebView可以通过分析页面结构和元素布局,识别出属于首屏展示的部分,比如首屏可见的图片、重要的标题文字、关键的功能按钮等,然后优先分配系统资源(如CPU处理时间、网络带宽等)对这些首屏元素进行渲染,使其能够快速呈现给用户,减少了用户等待的时间,提升了用户对页面加载速度的直观感受,例如在新闻资讯类的HTML5页面中,优先渲染出首屏的新闻标题、摘要文字和对应的配图,能够让用户能迅速了解大致内容。
[0091] (8)性能监控与资源调配:WebView可以持续监控渲染过程中的关键性能指标,如帧率、内存占用等情况。如果发现帧率过低,意味着页面可能出现卡顿现象,影响用户体验,此时WebView可以暂停一些非必要的渲染操作,比如延迟加载一些对首屏展示影响不大的动画效果或者次要的图片资源等,将更多的资源优先保障给正在进行的关键内容渲染,确保页面能够流畅地展示给用户。
[0092] 另外,若监测到内存占用过高,有导致内存溢出的风险,WebView可以及时清理一些已经不再使用的缓存资源,释放内存空间,维持渲染过程在一个相对稳定、高效的资源利用状态下进行,保证页面渲染的顺利完成以及应用程序整体的稳定性。
[0093] 进一步,通过上述操作过程,WebView可以将各个页面元素按照既定的设计要求和布局规则,有条不紊地组合在一起,最终生成完整的目标HTML5页面。
[0094] 进一步,目标HTML5页面可以展示在应用程序内指定的区域中,呈现出完整的视觉效果、具备丰富的交互功能,用户可以通过触摸、点击、滑动等操作与页面进行交互,比如查看更多详细内容、点击链接跳转到其他页面、提交表单信息等。
[0095] 进一步,随着用户后续进一步的操作,WebView还可以根据页面的设计逻辑和用户的行为动态地更新页面内容,维持页面的活性和交互性,为用户提供持续良好的浏览体验。
[0096] 本实施例提供的HTML5页面加载方法,在应用程序冷启动时获取HTML5页面的接口配置信息,能够提前为后续的页面加载做好准备。进一步,在WebView打开HTML5页面后,在获取页面资源的同时基于之前获取的接口配置信息向服务器发送预加载配置请求,通过这种同步操作可以让服务器提前准备页面数据,而不是等待页面资源下载完成后再去请求数据,大大缩短了用户等待HTML5页面展示的时间。进一步,将服务器发送的页面数据存储在本地缓存,后续再次访问相同或类似页面时,可以直接从本地缓存获取数据,避免了重复从服务器获取,减少了网络延迟对页面加载的影响。进一步,当页面资源下载完成后,立即从本地缓存获取页面数据,确保了数据获取的及时性。最后,基于获取到的页面数据进行渲染,最终生成用户可见的HTML5页面,减少了用户等待时间。因此,通过实时本发明,通过在获取页面资源的同时请求页面数据,大大缩短了用户等待HTML5页面展示的时间,提升了用户体验。
[0097] 在本实施例中提供了一种HTML5页面加载方法,可用于平台端。进一步,平台端内包括应用程序(APP)且该平台端与服务器连接。其中,应用程序(APP)的数量可以为一个或多个。图3是根据本发明实施例的HTML5页面加载方法的流程图,如图3所示,该流程包括如下步骤:
[0098] 步骤S301,当应用程序冷启动,获取待配置HTML5页面的接口配置信息。详细请参见图2所示实施例的步骤S201,在此不再赘述。
[0099] 步骤S302,当应用程序内WebView打开待配置HTML5页面,获取页面资源并基于接口配置信息发送预加载配置请求至服务器,使得服务器基于预加载配置请求加载页面数据。
[0100] 具体地,上述步骤S302包括:
[0101] 步骤S3021,当应用程序内WebView打开待配置HTML5页面,利用WebView执行导航操作。
[0102] 具体地,当应用程序内WebView打开待配置HTML5页面后,首先可以进行decidePolicyForNavigationAction(决定导航策略)。
[0103] 步骤S3022,基于导航操作,WebView检查本地缓存中是否存在有效的页面资源。
[0104] 其中,有效的页面资源表示本地缓存中存在对应的页面资源且该页面资源是有效的。
[0105] 具体地,WebView可以通过页面的相关标识(如URL、页面文件名等)在本地缓存中进行查找。
[0106] 进一步,对于查找到的页面资源,可以判断其是否有效。
[0107] 在一可选的实施方式中,可以通过以下三个方面进行判断:
[0108] (1)时效性:检查缓存资源是否过期。例如,有些缓存资源可能设置了有效期,一旦超过这个时间,就认为该资源可能已经过时,需要重新获取。
[0109] (2)完整性:确保缓存资源的数据是完整的。如果缓存数据在存储过程中出现损坏,即使存在缓存,也不能使用。
[0110] (3)相关性:验证缓存资源是否与当前要加载的页面相关。例如,可能存在同名但属于不同版本页面的缓存资源,需要进行区分。
[0111] 进一步,通过WebView检查本地缓存中是否存在有效的页面资源可以优化页面加载速度。
[0112] 步骤S3023,当不存在有效的页面资源,通过预设传输控制协议判断是否与服务器建立连接。
[0113] 其中,不存在有效的页面资源表示本地缓存中不存在对应的页面资源,或者存在对应的页面资源但是该页面资源是无效的。
[0114] 进一步,预设传输控制协议为三次握手协议(Three-way Handshake),表示TCP(传输控制协议)用于建立连接的过程,确保客户端和服务器之间能够可靠地传输数据。
[0115] 具体地,如果本地缓存中不存在有效的页面资源,则需要从服务器中获取对应的页面资源以加载HTML5页面。
[0116] 进一步,在上述过程中需要确保与服务器建立可靠的连接。
[0117] 进一步,本实施例中可以通过三次握手协议与服务器建立可靠的连接。
[0118] 其中,三次握手协议的过程如下:
[0119] (1)第一次握手:客户端(即本实施例WebView所在的应用程序)向服务器发送一个SYN(同步)包,其中包含客户端随机生成的初始序列号(Initial Sequence Number,ISN),这个包表示客户端请求与服务器建立连接。
[0120] (2)第二次握手:服务器收到客户端的SYN包后,会回复一个SYN-ACK(同步-确认)包。这个包中包含服务器自己的ISN,并且对客户端的SYN包进行确认(ACK),确认号为客户端的ISN+1。
[0121] (3)第三次握手:客户端收到服务器的SYN-ACK包后,会向服务器发送一个ACK包,确认号为服务器的ISN+1。
[0122] 进一步,通过这三次握手,客户端和服务器之间就建立了可靠的TCP连接。
[0123] 在一些可选的实施方式中,上述步骤S3023包括:
[0124] 步骤a1,当不存在有效的页面资源,对待配置HTML5页面的域名进行解析并得到目标地址。
[0125] 步骤a2,基于目标地址,通过预设传输控制协议与服务器建立连接。
[0126] 具体地,当确定本地缓存没有有效页面资源后,要从服务器获取资源,首先需要知道服务器的地址。
[0127] 进一步,在互联网中,通常使用域名来标识服务器(例如www.example.com),但计算机在网络通信中实际使用的是IP地址。
[0128] 进一步,通过域名解析可以将待配置HTML5页面的域名转换为对应DNS(域名系统)服务器的IP地址即目标地址。
[0129] 其中,域名解析可以通过DNS(域名系统)服务器来完成。当WebView需要解析域名时,可以向本地DNS服务器发送域名解析请求。
[0130] 进一步,本地DNS服务器如果缓存中有该域名对应的IP地址,就直接返回给WebView;如果没有,本地DNS服务器会向根DNS服务器、顶级域名DNS服务器、权威DNS服务器等逐级查询,最终获取到域名对应的IP地址,并返回给WebView。
[0131] 进一步,当通过域名解析得到目标地址后,可以基于该目标地址,通过三次握手协议与服务器建立可靠的连接。
[0132] 具体地,WebView作为客户端,可以按照三次握手协议的流程向服务器发起连接请求。首先发送SYN包,然后等待服务器的SYN-ACK包,最后再回复ACK包,完成连接建立。
[0133] 进一步,如果本地缓存中存在有效的页面资源,WebView可以直接使用本地缓存中存储的有效的页面资源,避免了后续不必要的网络请求,进一步加快了页面加载速度。
[0134] 步骤S3024,当与服务器建立连接,获取页面资源并基于接口配置信息发送预加载配置请求至服务器,使得服务器基于预加载配置请求加载页面数据。
[0135] 具体地,当与服务器建立可靠的连接后,可以获取页面资源以及向服务器发送预加载配置请求了,通过这种方式能够尽可能快地收集到完整的页面数据,以便后续能够及时地进行页面渲染,减少用户等待页面呈现的时间,提升用户体验。
[0136] 其中,当与服务器建立连接,获取页面资源,包括:
[0137] 步骤b1,当与服务器建立连接,发送资源请求至服务器,使得服务器基于资源请求加载页面资源。
[0138] 步骤b2,接收服务器发送的页面资源。
[0139] 具体地,当与服务器建立连接后,WebView可以按照页面加载的需求,组织并发送资源请求给服务器。
[0140] 进一步,资源请求可以包含明确的用于告知服务器需要获取哪些页面资源。的信息。例如,资源请求中可以指明具体要获取的HTML文件的路径(如果是通过URL来定位资源的话,就包含在URL当中),对于其他资源像图片等,也会有对应的文件名或者资源标识符等信息。
[0141] 进一步,资源请求的格式和内容也需要遵循相应的网络协议(通常是HTTP或HTTPS协议)要求。
[0142] 例如,资源请求头中可以包含一些必要的元数据,如客户端的标识(使用用户代理来表示,说明客户端是何种类型的设备、使用的是哪个版本的应用程序等信息)、可接受的文件类型(告诉服务器客户端能够处理哪些格式的资源,如可以接受的图片格式有jpg、png等)等内容,进而帮助服务器准确地了解客户端的需求并做出合适的响应。
[0143] 进一步,服务器接收到资源请求后,可以根据资源请求中的信息从自身的存储系统(如硬盘存储、数据库等,具体取决于服务器的架构和数据存储方式)中查找对应的页面资源。
[0144] 例如,如果请求的是某个商品详情页的HTML文件,服务器可以定位到存储该HTML文件的位置,然后准备将其发送给客户端;如果是请求图片资源,服务器同样可以找到相应的图片文件,并按照合适的方式(如进行必要的格式转换、压缩等操作,以符合客户端可接受的格式和优化网络传输的要求)进行处理,以便后续能够发送给客户端。
[0145] 进一步,服务器可以将获取到的页面资源返回至WebView中。
[0146] 进一步,基于接口配置信息发送预加载配置请求至服务器,使得服务器基于预加载配置请求加载页面数据的过程可以参考上述步骤S202中的描述,此处不再赘述。
[0147] 步骤S303,接收服务器发送的页面数据并将页面数据存储在本地缓存中。详细请参见图2所示实施例的步骤S203,在此不再赘述。
[0148] 步骤S304,当页面资源下载完成,从本地缓存获取页面数据。详细请参见图2所示实施例的步骤S204,在此不再赘述。
[0149] 步骤S305,基于页面数据对待配置HTML5页面进行渲染并生成目标HTML5页面。详细请参见图2所示实施例的步骤S205,在此不再赘述。
[0150] 在一可选的实施方式中,本发明实施例的HTML5页面加载方法包括如下步骤:
[0151] 步骤c1,当应用程序冷启动且未获取到接口配置信息,通过在线加载方法获取待配置HTML5页面的接口配置信息。
[0152] 具体地,当应用程序冷启动阶段如果没有获取到对应的待配置HTML5页面的接口配置信息,可以借助在线加载的方式获取。
[0153] 其中,在线加载可以通过应用程序与服务器建立网络连接,主动向服务器发起请求,以获取待配置HTML5页面的接口配置信息。
[0154] 具体地,应用程序可以按照既定的网络协议(如HTTP或HTTPS)构建相应的请求消息,在请求中可能会携带一些必要的标识信息,如应用程序的版本号、设备的相关参数(如设备型号、操作系统版本等)。这些信息能够帮助服务器识别是哪个应用、在哪种设备环境下需要接口配置信息,从而可以精准地返回适合该应用和设备的配置内容。
[0155] 进一步,服务器收到请求后,可以根据请求中的这些标识以及自身的配置策略,查找对应的接口配置信息。例如,服务器可以依据不同的应用版本和设备类型,匹配相应的服务器地址、接口调用方式、请求参数格式、数据返回格式等配置参数,然后将这些查找到的接口配置信息打包成合适的格式(如JSON格式等),并通过网络响应返回给应用程序。
[0156] 进一步,应用程序接收到服务器返回的接口配置信息后,还可以对其进行解析处理,提取出关键的参数,并将这些参数存储在本地合适的位置(如内存中的特定变量或者本地存储文件中),以便后续在打开待配置HTML5页面、与服务器交互获取页面资源和数据等操作时,能够依据这些接口配置信息准确地进行请求发送和响应接收,保障页面加载流程的顺利进行。
[0157] 在一可选的实施方式中,本发明实施例的HTML5页面加载方法包括如下步骤:
[0158] 步骤d1,当页面资源下载完成且从本地缓存未获取到页面数据,重复发送预加载配置请求至服务器的操作,直至接收到服务器发送的页面数据。
[0159] 具体地,当页面资源下载完成后,如果没有成功从本地缓存中提取到对应的页面数据,应用程序内的WebView可以按照既定的接口配置信息,重新构建并发送预加载配置请求给服务器。
[0160] 进一步,不断重复发送预加载配置请求至服务器的操作,直至接收到服务器发送的页面数据时停止向服务器继续发送预加载配置请求。
[0161] 进一步,通过不断重复发送预加载配置请求给服务器,确保最终能够获取到页面数据,避免了因数据缺失导致页面渲染失败或显示异常,提升了HTML5页面加载的可靠性和完整性。进一步,可以应对网络波动或服务器响应异常等情况,保证了页面数据的完整性和可用性,防止出现页面无法渲染或部分内容缺失的问题,提升了页面加载的可靠性。
[0162] 本实施例提供的HTML5页面加载方法,通过WebView执行导航操作,能够在打开页面时按照既定的导航逻辑进行页面资源的组织和请求,有助于规范页面加载流程,确保页面加载的有序性和高效性。进一步,在导航操作过程中检查本地缓存,能够及时发现是否可以利用本地已有的页面资源。如果存在有效资源,就可以直接使用,避免不必要的网络请求,进一步加快页面加载速度。进一步,当本地缓存没有可用资源时,通过预设传输控制协议判断与服务器的连接情况,确保了在需要从服务器获取资源时,连接的可靠性和及时性。最后,在与服务器建立连接后,立即进行页面资源下载和预加载配置请求,能够充分利用网络连接,让服务器提前准备页面数据,而不是等待页面资源下载完成后再去请求数据,大大缩短了用户等待HTML5页面展示的时间。进一步,在应用程序冷启动且未获取到接口配置信息的情况下,通过在线加载方法获取,保证了即使在初始配置缺失的情况下,也能够及时补充配置信息,为后续的页面加载操作提供了完整的配置依据,避免了因配置缺失导致页面无法正常加载或加载缓慢的问题。进一步,当本地缓存没有获取到页面数据时,重复发送预加载配置请求,确保了最终能够获取到页面数据,进一步,可以应对网络波动或服务器响应异常等情况,保证了页面数据的完整性和可用性,防止出现页面无法渲染或部分内容缺失的问题,提升了页面加载的可靠性。
[0163] 在一实例中,如图4所示,提供了一种H5页面预加载技术方案,包括:
[0164] 1.平台配置H5页面请求的接口配置;
[0165] 2.APP冷启动时,获取H5页面的接口配置;
[0166] 3.APP内webview打开H5页面时,下载页面需要的资源,同时根据配置,请求页面的接口数据,成功后,存到本地缓存;
[0167] 4.资源下载完成后,从本地缓存获取数据,若数据不存在,继续请求接口;若数据存在,使用本地缓存数据进行页面内容的渲染。
[0168] 进一步,提供一个详细的H5页面预加载流程,如图5所示,具体包括:
[0169] (1)打开webview:表示应用程序中开始加载一个WebView。
[0170] (2)decidePolicyForNavigationAction和loadRequest
[0171] 当WebView开始加载页面时,首先会进行"decidePolicyForNavigationAction”(决定导航策略)和"loadRequest”(加载请求)操作,主要是为后续的页面加载请求做准备,确保加载请求符合导航策略。
[0172] (3)AppCache检查
[0173] 系统首先检查本地缓存(AppCache),查看是否存在所需的页面资源。如果本地缓存中有可用资源,则可以直接使用,减少网络请求。
[0174] (4)DNS查找
[0175] 如果本地缓存中没有可用资源,或者需要更新资源,接下来会进行DNS(域名系统)查找,目的是将域名转换为IP地址,以便与服务器建立连接。DNS查找过程包括"domainLookupStart”(域名查找开始)和"domainLookupEnd”(域名查找结束)两个时间点。
[0176] (5)TCP连接建立
[0177] 在获取服务器的IP地址后,会进行TCP(传输控制协议)连接建立,包括与服务器进行"TCP”连接的过程,确保可靠的数据传输。
[0178] (6)Request发送
[0179] TCP连接建立后,客户端向服务器发送资源请求(Request),包括"requestStart”(请求开始)时间点,表示开始向服务器发送请求。
[0180] (7)Response接收
[0181] 服务器收到请求后,会发送响应(Response),包括"responseStart”(响应开始)和"responseEnd”(响应结束)时间点,表示开始接收服务器响应和接收结束。
[0182] (8)Processing处理
[0183] 客户端接收到服务器的响应后,可以对数据进行处理(Processing),为在将资源应用到页面之前的内部处理步骤。
[0184] (9)Load加载
[0185] 处理完数据后,开始将资源加载(Load)到页面中,即页面资源真正开始显示在页面上的阶段。
[0186] (10)关键时间点
[0187] navigationStart:导航开始,标志着整个页面加载过程的开始。
[0188] domLoading:文档开始加载,此时HTML文档开始被解析。
[0189] domInteractive:文档可交互,此时HTML文档已经解析完成,但可能还有一些资源(如图像、样式表等)未加载完成。
[0190] domComplete:文档加载完成,所有的HTML、CSS、JavaScript等资源都已加载完成。
[0191] loadEventStart和loadEventEnd:加载事件开始和结束,表示页面的onload事件被触发和处理完成。
[0192] (11)预加载请求相关
[0193] 还包括预加载请求相关的操作,包括"预加载请求完成”等。这些预加载请求也是在WebView执行导航操作过程中产生的,目的是提前获取页面数据,加快页面加载速度。
[0194] (12)Time To Interactive(TTI):表示页面达到可交互状态所需的时间,可以反映用户能够开始与页面进行交互的时间点。
[0195] 本实施例提供的H5页面预加载技术方案,APP应用内使用webview容器打开H5页面时,预先加载页面所需要的数据,使用户可以更快的看到页面内容。
[0196] 在本实施例中还提供了一种HTML5页面加载装置,该装置用于实现上述实施例及优选实施方式,已经进行过说明的不再赘述。如以下所使用的,术语"模块”可以实现预定功能的软件和 / 或硬件的组合。尽管以下实施例所描述的装置较佳地以软件来实现,但是硬件,或者软件和硬件的组合的实现也是可能并被构想的。
[0197] 本实施例提供一种HTML5页面加载装置,如图6所示,用于平台端,平台端包括应用程序,平台端与服务器连接;该装置包括:
[0198] 第一获取模块601,用于当应用程序冷启动,获取待配置HTML5页面的接口配置信息。
[0199] 下载与发送模块602,用于当应用程序内WebView打开待配置HTML5页面,获取页面资源并基于接口配置信息发送预加载配置请求至服务器,使得服务器基于预加载配置请求加载页面数据。
[0200] 接收与存储模块603,用于接收服务器发送的页面数据并将页面数据存储在本地缓存中。
[0201] 第二获取模块604,用于当页面资源下载完成,从本地缓存获取页面数据。
[0202] 渲染与生成模块605,用于基于页面数据对待配置HTML5页面进行渲染并生成目标HTML5页面。
[0203] 在一些可选的实施方式中,下载与发送模块602包括:
[0204] 执行子模块,用于当应用程序内WebView打开待配置HTML5页面,利用WebView执行导航操作。
[0205] 检查子模块,用于基于导航操作,WebView检查本地缓存中是否存在有效的页面资源。
[0206] 判断子模块,用于当不存在有效的页面资源,通过预设传输控制协议判断是否与服务器建立连接。
[0207] 获取与发送子模块,用于当与服务器建立连接,获取页面资源并基于接口配置信息发送预加载配置请求至服务器,使得服务器基于预加载配置请求加载页面数据。
[0208] 在一些可选的实施方式中,判断子模块包括:
[0209] 解析单元,用于当不存在有效的页面资源,对待配置HTML5页面的域名进行解析并得到目标地址。
[0210] 连接单元,用于基于目标地址,通过预设传输控制协议与服务器建立连接。
[0211] 在一些可选的实施方式中,获取与发送子模块中当与服务器建立连接,获取页面资源包括:当与服务器建立连接,发送资源请求至服务器,使得服务器基于资源请求加载页面资源;接收服务器发送的页面资源。
[0212] 在一些可选的实施方式中,该装置还包括:
[0213] 第三获取模块,用于当应用程序冷启动且未获取到接口配置信息,通过在线加载方法获取待配置HTML5页面的接口配置信息。
[0214] 在一些可选的实施方式中,该装置还包括:
[0215] 重复模块,用于当页面资源下载完成且从本地缓存未获取到页面数据,重复发送预加载配置请求至服务器的操作,直至接收到服务器发送的页面数据。
[0216] 上述各个模块和单元的更进一步的功能描述与上述对应实施例相同,在此不再赘述。
[0217] 本实施例中的HTML5页面加载装置是以功能单元的形式来呈现,这里的单元是指ASIC(Application Specific Integrated Circuit,专用集成电路)电路,执行一个或多个软件或固定程序的处理器和存储器,和 / 或其他可以提供上述功能的器件。
[0218] 本发明实施例还提供一种计算机设备,具有上述图6所示的HTML5页面加载装置。
[0219] 请参阅图7,图7是本发明可选实施例提供的一种计算机设备的结构示意图,如图7所示,该计算机设备包括:一个或多个处理器10、存储器20,以及用于连接各部件的接口,包括高速接口和低速接口。各个部件利用不同的总线互相通信连接,并且可以被安装在公共主板上或者根据需要以其它方式安装。处理器可以对在计算机设备内执行的指令进行处理,包括存储在存储器中或者存储器上以在外部输入 / 输出装置(诸如,耦合至接口的显示设备)上显示GUI的图形信息的指令。在一些可选的实施方式中,若需要,可以将多个处理器和 / 或多条总线与多个存储器一起使用。同样,可以连接多个计算机设备,各个设备提供部分必要的操作(例如,作为服务器阵列、一组刀片式服务器、或者多处理器系统)。图7中以一个处理器10为例。
[0220] 处理器10可以是中央处理器,网络处理器或其组合。其中,处理器10还可以进一步包括硬件芯片。上述硬件芯片可以是专用集成电路,可编程逻辑器件或其组合。上述可编程逻辑器件可以是复杂可编程逻辑器件,现场可编程逻辑门阵列,通用阵列逻辑或其任意组合。
[0221] 其中,存储器20存储有可由至少一个处理器10执行的指令,以使至少一个处理器10执行实现上述实施例示出的方法。
[0222] 存储器20可以包括存储程序区和存储数据区,其中,存储程序区可存储操作系统、至少一个功能所需要的应用程序;存储数据区可存储根据计算机设备的使用所创建的数据等。此外,存储器20可以包括高速随机存取存储器,还可以包括非瞬时存储器,例如至少一个磁盘存储器件、闪存器件、或其他非瞬时固态存储器件。在一些可选的实施方式中,存储器20可选包括相对于处理器10远程设置的存储器,这些远程存储器可以通过网络连接至该计算机设备。上述网络的实例包括但不限于互联网、企业内部网、局域网、移动通信网及其组合。
[0223] 存储器20可以包括易失性存储器,例如,随机存取存储器;存储器也可以包括非易失性存储器,例如,快闪存储器,硬盘或固态硬盘;存储器20还可以包括上述种类的存储器的组合。
[0224] 该计算机设备还包括通信接口30,用于该计算机设备与其他设备或通信网络通信。
[0225] 本发明实施例还提供了一种计算机可读存储介质,上述根据本发明实施例的方法可在硬件、固件中实现,或者被实现为可记录在存储介质,或者被实现通过网络下载的原始存储在远程存储介质或非暂时机器可读存储介质中并将被存储在本地存储介质中的计算机代码,从而在此描述的方法可被存储在使用通用计算机、专用处理器或者可编程或专用硬件的存储介质上的这样的软件处理。其中,存储介质可为磁碟、光盘、只读存储记忆体、随机存储记忆体、快闪存储器、硬盘或固态硬盘等;进一步地,存储介质还可以包括上述种类的存储器的组合。可以理解,计算机、处理器、微处理器控制器或可编程硬件包括可存储或接收软件或计算机代码的存储组件,当软件或计算机代码被计算机、处理器或硬件访问且执行时,实现上述实施例示出的方法。
[0226] 本发明的一部分可被应用为计算机程序产品,例如计算机程序指令,当其被计算机执行时,通过该计算机的操作,可以调用或提供根据本发明的方法和 / 或技术方案。本领域技术人员应能理解,计算机程序指令在计算机可读介质中的存在形式包括但不限于源文件、可执行文件、安装包文件等,相应地,计算机程序指令被计算机执行的方式包括但不限于:该计算机直接执行该指令,或者该计算机编译该指令后再执行对应的编译后程序,或者该计算机读取并执行该指令,或者该计算机读取并安装该指令后再执行对应的安装后程序。在此,计算机可读介质可以是可供计算机访问的任意可用的计算机可读存储介质或通信介质。
[0227] 虽然结合附图描述了本发明的实施例,但是本领域技术人员可以在不脱离本发明的精神和范围的情况下做出各种修改和变型,这样的修改和变型均落入由所附权利要求所限定的范围之内。< / style>
Claims
1. A method for loading an HTML5 page, characterized in that: Used for a platform end, the platform end includes an application, and the platform end is connected to a server; the method includes: When the application is cold started, interface configuration information of the HTML5 page to be configured is obtained; When the WebView in the application opens the HTML5 page to be configured, the page resources are obtained and a preload configuration request is sent to the server based on the interface configuration information, so that the server loads the page data based on the preload configuration request; Receiving the page data sent by the server and storing the page data in a local cache; When the page resource download is complete, the page data is obtained from the local cache; The HTML5 page to be configured is rendered based on the page data and a target HTML5 page is generated.
2. The method according to claim 1, characterized in that When the WebView in the application opens the HTML5 page to be configured, the page resources are obtained and a preload configuration request is sent to the server based on the interface configuration information, so that the server loads the page data based on the preload configuration request, including: When the WebView in the application opens the HTML5 page to be configured, the WebView is used to perform a navigation operation; Based on the navigation operation, the WebView checks whether there is a valid page resource in the local cache; When there is no valid page resource, determining whether to establish a connection with the server through a preset transmission control protocol; When a connection is established with the server, page resources are obtained and a preloading configuration request is sent to the server based on the interface configuration information, so that the server loads page data based on the preloading configuration request.
3. The method according to claim 2, characterized in that When there is no valid page resource, determining whether to establish a connection with the server through a preset transmission control protocol includes: When there is no valid page resource, the domain name of the HTML5 page to be configured is parsed and the target address is obtained; Based on the target address, a connection is established with the server through the preset transmission control protocol.
4. The method according to claim 2, characterized in that: When a connection is established with the server, page resources are obtained, including: When a connection is established with the server, a resource request is sent to the server, so that the server loads the page resource based on the resource request; Receive the page resource sent by the server.
5. The method according to claim 1, characterized in that The method further comprises: When the application is cold started and the interface configuration information is not obtained, the interface configuration information of the HTML5 page to be configured is obtained through an online loading method.
6. The method according to claim 1, characterized in that The method further comprises: When the page resource download is complete and the page data is not obtained from the local cache, the operation of sending the preload configuration request to the server is repeated until the page data sent by the server is received.
7. An HTML5 page loading device, characterized in that: Used for a platform end, the platform end includes an application program, and the platform end is connected to a server; the device includes: A first acquisition module, used for acquiring interface configuration information of the HTML5 page to be configured when the application is cold started; A downloading and sending module, used for, when the WebView in the application opens the HTML5 page to be configured, obtaining page resources and sending a preloading configuration request to the server based on the interface configuration information, so that the server loads page data based on the preloading configuration request; A receiving and storing module, used for receiving the page data sent by the server and storing the page data in a local cache; A second acquisition module is used to acquire the page data from the local cache when the page resource download is completed; The rendering and generating module is used to render the HTML5 page to be configured based on the page data and generate a target HTML5 page.
8. A computer device, characterized in that: include: A memory and a processor, wherein the memory and the processor are communicatively connected to each other, the memory stores computer instructions, and the processor executes the HTML5 page loading method according to any one of claims 1 to 6 by executing the computer instructions.
9. A computer-readable storage medium, characterized in that: The computer-readable storage medium stores computer instructions, and the computer instructions are used to enable a computer to execute the HTML5 page loading method according to any one of claims 1 to 6.
10. A computer program product, characterized in that The method comprises computer instructions for causing a computer to execute the HTML5 page loading method according to any one of claims 1 to 6.