Page loading method and device, computer equipment and storage medium
By receiving user requests and judging exception caches, clearing and reloading the H5 page, combining monitoring modules and resource optimization technology, loading errors and user experience problems caused by cache problems are solved, achieving smooth page loading and efficient user experience.
Patent Information
- Application Number
- CN202411252179.X
- Authority / Receiving Office
- CN · China
- Patent Type
- Applications(China)
- Current Assignee / Owner
- Filing Date
- 2024-09-06
- Publication Date
- 2024-12-27
- Estimated Expiration
- 2044-09-06
AI Technical Summary
When solving the loading errors and user experience problems caused by caching problems in the prior art, there are problems such as high complexity, difficulty in covering all client environments, affecting page loading speed, and being unable to solve user experience instantly.
By receiving user page access requests, determine whether the target page has an exception cache, clear the exception cache and reload the page, use the pre-deployed monitoring module to capture and clear the exception cache, and use progressive image loading and streaming if necessary Technical optimization resource loading.
It improves the fluency of users' H5 pages, reduces customer complaint rates, ensures fast loading and usability of the page, and is suitable for different client environments.
Smart Images

Figure CN119201271A_ABST
Abstract
Description
Technical Field
[0001] The present application relates to the fields of computer communication and artificial intelligence technology, and in particular to a page loading method, device, computer equipment and storage medium. Background Art
[0002] In the process of business development in the leasing industry, it is inevitable to conduct business through mobile H5 pages. For example, in the commercial vehicle used car leasing business, the account manager needs to enter the lessee and vehicle information in the mobile phone H5 page so that the back-end staff can evaluate the vehicle price and assist in loan and credit decisions. The stability of the H5 page function directly affects the smooth development of the leasing process. In the past period of time, after the R&D personnel updated the H5 function, there was a small probability that the front-line account manager could not open the page immediately (white screen state). At this time, the user needs to reinstall the APP to reopen the page. This is because the cache file loaded in the APP references a resource file that no longer exists (usually because the programmer has removed or renamed the file), which causes a page loading error and affects normal use.
[0003] In order to solve the above problems, the following technical means are usually used in the prior art: 1. Disable cache. In scenarios where access performance is not pursued, technicians can choose to disable cache. Common means include: disabling browser cache, disabling server cache, disabling CDN cache, etc. 2. Add monitoring and tracking points for the page, and report errors that occur on the collection page for subsequent analysis. 3. In the patent "A page loading method and device that does not require clearing the cache after front-end upgrade" (application number: CN202111029219.0), it is proposed to add the version number to js in the configuration file, add the version number to json.js in the configuration file, and include the version number in the path of the generated package file. The solution solves the problem of needing to clear the cache and re-login to obtain the latest style of the page.
[0004] However, there are still some problems with the above three methods: The main disadvantage of method 1 is that it involves many technical aspects, has high complexity and certain technical thresholds, and the established solution is in fact difficult to cover all differences in client environments (different mobile phones and models) on the market, so user experience problems caused by cache still occur from time to time. In addition, disabling the cache function will objectively slow down page loading, affecting the user experience to a certain extent. The main disadvantage of method 2 is that relying solely on monitoring and reporting cannot solve user experience problems immediately. When the H5 page cannot be opened due to the above-mentioned cache problem, the user still needs to use forced means to clear the cache, such as refreshing the page, re-login or install the APP. The main disadvantage of method 3 is that this method aims to solve the problem of difficulty in obtaining the latest style of the page, but on the basis of "no cache clearing", it also cannot solve the problem of page loading failure due to cache problems, which directly affects the availability of the page. Summary of the invention
[0005] The purpose of the embodiments of the present application is to provide a page loading method, apparatus, computer device and storage medium to solve the problem in the prior art that users are blocked from using the page due to cache problems.
[0006] In order to solve the above technical problems, the embodiment of the present application provides a page loading method, which adopts the following technical solution:
[0007] Receive a page access request from a user, wherein the page access request is used to request access to a target page;
[0008] Determine whether the target page has an abnormal cache, where the abnormal cache is used to indicate a running error, an asynchronous error, or a resource loading error;
[0009] If yes, receiving an instruction from the user to clear the abnormal cache and reload the target page;
[0010] Clear the exception cache and reload the target page according to the instruction; or
[0011] Triggering a monitoring module pre-deployed on the target page to capture the abnormal cache;
[0012] The monitoring module is controlled to clear the abnormal cache and reload the target page.
[0013] Furthermore, the step of determining whether the target page has abnormal cache specifically includes:
[0014] Obtaining page data of the page access request, and loading and rendering the target page according to the page data;
[0015] Performing real-time monitoring on the loading process of the target page;
[0016] When monitoring that an exception occurs in the loading process of the target page, extracting an error code of the abnormal state;
[0017] It is determined whether the target page has abnormal cache according to the error code.
[0018] Furthermore, the step of controlling the monitoring module to clear the abnormal cache and reload the target page specifically includes:
[0019] Controlling the monitoring module to clear the abnormal cache stored in the browser where the target page is located;
[0020] Reloading the target page from the server according to the page data to obtain updated page content;
[0021] The updated page content is cached in the browser.
[0022] Further, after the step of controlling the monitoring module to clear the abnormal cache and reload the target page, the method further includes:
[0023] Controlling the monitoring module to generate an error log according to the abnormal cache;
[0024] Extract error parameters from the error log and determine the corresponding error code.
[0025] Furthermore, after receiving the page access request from the user, the method further includes:
[0026] Setting a loading priority order according to the preset importance of the target page;
[0027] The page elements with high priority in the target page are loaded according to the priority order.
[0028] Furthermore, after the step of reloading the target page, the method further includes:
[0029] Monitor the loading process of the target page in real time and collect performance indicators, including loading time, resource size, and number of requests;
[0030] Calculate a comprehensive score of the target page loading based on the loading time, resource size, and number of requests;
[0031] Determining whether the comprehensive score is lower than a preset threshold;
[0032] If it is lower than that, then identifying the slow-loading resources in the target page;
[0033] When the resource that is slowly loaded is identified as a large picture resource, a progressive picture loading technology is used to split the large picture into multiple small pictures for loading;
[0034] When it is identified that the resource that is slowly loaded is a video resource, a streaming transmission technology is used to cut the video into multiple video segments for loading.
[0035] Furthermore, the step of calculating the comprehensive score of the target page loading based on the loading time, resource size and number of requests specifically includes:
[0036] Calculate corresponding weight values according to the importance of the loading time, resource size and number of requests;
[0037] The comprehensive score of the target page loading is calculated according to the corresponding weight value.
[0038] In order to solve the above technical problems, the embodiment of the present application further provides a page loading device, which adopts the following technical solution:
[0039] A first receiving module is used to receive a page access request from a user, wherein the page access request is used to request access to a target page;
[0040] A first judgment module is used to judge whether the target page has an abnormal cache, and the abnormal cache is used to indicate a running error, an asynchronous error or a resource loading error;
[0041] A second receiving module is used to receive an instruction from the user to clear the abnormal cache and reload the target page when the judgment result is yes;
[0042] a processing module, configured to clear the exception cache and reload the target page according to the instruction; or
[0043] The device includes a capture module, which is used to trigger a monitoring module pre-deployed on the target page to capture the abnormal cache when the judgment result is yes;
[0044] The control module is used to control the monitoring module to clear the abnormal cache and reload the target page.
[0045] Furthermore, the first determination module includes:
[0046] An acquisition unit, used to acquire page data of the page access request, and load and render the target page according to the page data;
[0047] A monitoring unit, used for real-time monitoring of the loading process of the target page;
[0048] An extraction unit, configured to extract an error code of the abnormal state when an abnormality occurs in the loading process of the target page;
[0049] A judging unit is used to judge whether the target page has abnormal cache according to the error code.
[0050] Furthermore, the control module includes:
[0051] A clearing unit, used to control the monitoring module to clear the abnormal cache stored in the browser where the target page is located;
[0052] A loading unit, used to reload the target page from the server according to the page data to obtain updated page content;
[0053] A cache unit is used to cache the updated page content in the browser.
[0054] Furthermore, the device also includes:
[0055] A generating module, used for controlling the monitoring module to generate an error log according to the abnormal cache;
[0056] The extraction module is used to extract error parameters from the error log and determine the corresponding error code.
[0057] Furthermore, the device also includes:
[0058] A setting module, used to set a loading priority order according to the preset importance of the target page;
[0059] The loading module is used to load the page elements with high priority in the target page according to the priority order.
[0060] Furthermore, the device also includes:
[0061] A collection module, used to monitor the loading process of the target page in real time and collect performance indicators, the performance indicators including loading time, resource size and number of requests;
[0062] A calculation module, used to calculate a comprehensive score of the target page loading based on the loading time, resource size and number of requests;
[0063] A second judgment module is used to judge whether the comprehensive score is lower than a preset threshold;
[0064] an identification module, configured to identify the slowly loading resources in the target page when the determination result of the second determination module is yes;
[0065] The segmentation module is used to adopt progressive image loading technology to segment the large image into multiple small images for loading when the slowly loading resource is identified as a large image resource; and adopt streaming transmission technology to segment the video into multiple video clips for loading when the slowly loading resource is identified as a video resource.
[0066] Furthermore, the calculation module includes:
[0067] A first calculation unit, used to calculate corresponding weight values according to the importance of the loading time, resource size and number of requests;
[0068] The second calculation unit is used to calculate the comprehensive score of the target page loading according to the corresponding weight value.
[0069] In order to solve the above technical problems, the embodiment of the present application further provides a computer device, which adopts the following technical solution:
[0070] A computer device is provided, comprising one or more processors; and a memory for storing one or more programs, so that the one or more processors implement any one of the page loading methods described above.
[0071] In order to solve the above technical problems, the embodiment of the present application further provides a computer-readable storage medium, which adopts the following technical solution:
[0072] A computer-readable storage medium stores a computer program, and when the computer program is executed by a processor, the page loading method described in any one of the above is implemented.
[0073] Compared with the prior art, the embodiments of the present application have the following beneficial effects:
[0074] This application receives a page access request from a user, and the page access request is used to request access to a target page, so as to obtain the page requested by the user; determines whether the target page has an abnormal cache, and the abnormal cache is used to indicate a running error, an asynchronous error, or a resource loading error, so as to monitor the abnormal cache in the target page; if so, receives an instruction from the user to clear the abnormal cache and reload the target page, so as to obtain the user's instruction; clears the abnormal cache and reloads the target page according to the instruction, so as to enable the user to quickly clear the abnormal cache and reload the page; or triggers the monitoring module pre-deployed on the target page to capture the abnormal cache, so as to enable the monitoring module to capture the abnormal cache; controls the monitoring module to clear the abnormal cache and reload the target page, so as to clear the abnormal cache and load the page. This application retains the advantages of caching, and only clears the cache and reloads the page when an abnormal cache occurs, which improves the fluency of users when using H5 pages, reduces the customer complaint rate, and is also conducive to the promotion of business. BRIEF DESCRIPTION OF THE DRAWINGS
[0075] In order to more clearly illustrate the scheme in the present application, a brief introduction is given below to the drawings required for use in the description of the embodiments of the present application. Obviously, the drawings described below are some embodiments of the present application. For ordinary technicians in this field, other drawings can be obtained based on these drawings without paying any creative work.
[0076] Figure 1 is an exemplary system architecture diagram to which the present application may be applied;
[0077] Figure 2 A flow chart of an embodiment of a page loading method according to the present application;
[0078] Figure 3 is a structural schematic diagram of an embodiment of a page loading device according to the present application;
[0079] Figure 4 It is a structural diagram of an embodiment of a computer device according to the present application. DETAILED DESCRIPTION
[0080] Unless otherwise defined, all technical and scientific terms used herein have the same meaning as those commonly understood by technicians in the technical field of the present application; the terms used in the specification of the application herein are only for the purpose of describing specific embodiments and are not intended to limit the present application; the terms "including" and "having" and any variations thereof in the specification and claims of the present application and the above-mentioned drawings are intended to cover non-exclusive inclusions. The terms "first", "second", etc. in the specification and claims of the present application or the above-mentioned drawings are used to distinguish different objects, not to describe a specific order.
[0081] Reference to "embodiments" herein means that a particular feature, structure, or characteristic described in conjunction with the embodiments may be included in at least one embodiment of the present application. The appearance of the phrase in various locations in the specification does not necessarily refer to the same embodiment, nor is it an independent or alternative embodiment that is mutually exclusive with other embodiments. It is explicitly and implicitly understood by those skilled in the art that the embodiments described herein may be combined with other embodiments.
[0082] In order to enable those skilled in the art to better understand the solution of the present application, the technical solution in the embodiments of the present application will be clearly and completely described below in conjunction with the accompanying drawings.
[0083] like Figure 1 As shown, the system architecture 100 may include terminal devices 101, 102, 103, a network 104 and a server 105. The network 104 is used to provide a medium for communication links between the terminal devices 101, 102, 103 and the server 105. The network 104 may include various connection types, such as wired, wireless communication links or optical fiber cables, etc.
[0084] Users can use terminal devices 101, 102, 103 to interact with server 105 through network 104 to receive or send messages, etc. Various communication client applications can be installed on terminal devices 101, 102, 103, such as web browser applications, shopping applications, search applications, instant messaging tools, email clients, social platform software, etc.
[0085] Terminal devices 101, 102, 103 can be various electronic devices with display screens and supporting web browsing, including but not limited to smart phones, tablet computers, e-book readers, MP3 players (Moving Picture Experts Group Audio Layer III), MP4 (Moving Picture Experts Group Audio Layer IV) players, laptop computers, desktop computers, etc.
[0086] The server 105 may be a server that provides various services, such as a background server that provides support for web pages displayed on the terminal devices 101 , 102 , and 103 .
[0087] It should be noted that the page loading method provided in the embodiment of the present application is generally executed by a server / terminal device, and accordingly, the page loading device is generally set in the server / terminal device.
[0088] It should be understood that Figure 1 The number of terminal devices, networks and servers in the embodiment is only for illustration. Any number of terminal devices, networks and servers may be provided according to implementation requirements.
[0089] Continue to refer Figure 2 , shows a flow chart of an embodiment of a page loading method according to the present application. The page loading method comprises the following steps:
[0090] Step S201: receiving a page access request from a user, wherein the page access request is used to request access to a target page.
[0091] In this embodiment, the electronic device (eg, Figure 1 The server / terminal device shown in the figure can receive the user's page access request through a wired connection or a wireless connection. It should be noted that the above wireless connection method may include but is not limited to 3G / 4G / 5G connection, WiFi connection, Bluetooth connection, WiMAX connection, Zigbee connection, UWB (ultra wideband) connection, and other wireless connection methods currently known or to be developed in the future.
[0092] Specifically, the target page is an H5 page, which is a mobile web page developed based on HTML5 technology. Since it is suitable for browsing on mobile devices, it is usually presented to users using APP as a carrier. It is also a kind of web application in a broad sense.
[0093] Step S202, determining whether the target page has an abnormal cache, wherein the abnormal cache is used to indicate a running error, an asynchronous error or a resource loading error.
[0094] In this embodiment, cache refers to the above-mentioned temporarily stored resource copies (including HTML pages, images, JavaScript, CSS, etc.). For example: Web cache is mainly used to temporarily store Web documents (such as HTML pages, images, JavaScript, CSS, etc.) to reduce the time delay of server response. Abnormal cache refers to resource copy files that have been removed or renamed by the programmer. For example, in the commercial vehicle used car leasing business, the account manager needs to enter the lessee and vehicle information in the mobile phone H5 page so that the back-end staff can evaluate the car price and assist in loan and credit decisions. The removal or renaming of various resource files occurs from time to time, resulting in a small probability that the front-line account manager cannot open the page immediately. This is because the cache file loaded in the APP references a resource file that no longer exists, which causes a page loading error and affects normal use.
[0095] Step S203: if the result of the determination is that the target page has an abnormal cache, receiving an instruction from the user to clear the abnormal cache and reload the target page.
[0096] In this embodiment, a small button is added to the H5 page. When an abnormal cache problem occurs and the page is blank, the user can click this button to allow the server to receive the user's instruction to clear the abnormal cache and reload the target page.
[0097] Step S204: clear the exception cache and reload the target page according to the instruction.
[0098] In this embodiment, after receiving the instruction from the user to clear the abnormal cache and reload the target page, the operation of clearing the abnormal cache and reloading the target page is performed according to the instruction. The present invention achieves the technical effect of manually triggering the clearing of the cache and reloading the page, and also avoids the problem that the user needs to uninstall and reinstall the App before reusing H5.
[0099] Step S205 , triggering a monitoring module pre-deployed on the target page to capture the abnormal cache.
[0100] In this embodiment, when the result of the determination is that the target page has abnormal cache, the abnormal cache can be automatically captured by triggering a monitoring module pre-deployed on the target page.
[0101] Step S206, controlling the monitoring module to clear the exception cache and reload the target page.
[0102] In this embodiment, when the exception cache is captured, the callback method bound to the monitoring module is executed to clear the exception cache. After the exception cache is cleared, the monitoring module automatically reloads the page without the user having to log in again.
[0103] This application receives a page access request from a user, and the page access request is used to request access to a target page, so as to obtain the page requested by the user; determines whether the target page has an abnormal cache, and the abnormal cache is used to indicate a running error, an asynchronous error, or a resource loading error, so as to monitor the abnormal cache in the target page; if so, receives an instruction from the user to clear the abnormal cache and reload the target page, so as to obtain the user's instruction; clears the abnormal cache and reloads the target page according to the instruction, so as to enable the user to quickly clear the abnormal cache and reload the page; or triggers the monitoring module pre-deployed on the target page to capture the abnormal cache, so as to enable the monitoring module to capture the abnormal cache; controls the monitoring module to clear the abnormal cache and reload the target page, so as to clear the abnormal cache and load the page. This application retains the advantages of caching, and only clears the cache and reloads the page when an abnormal cache occurs, which improves the fluency of users when using H5 pages, reduces the customer complaint rate, and is also conducive to the promotion of business.
[0104] In some optional implementations of this embodiment, step S202 of determining whether the target page has abnormal cache includes the following steps:
[0105] Obtaining page data of the page access request, and loading and rendering the target page according to the page data;
[0106] Performing real-time monitoring on the loading process of the target page;
[0107] When monitoring that an exception occurs in the loading process of the target page, extracting an error code of the abnormal state;
[0108] It is determined whether the target page has abnormal cache according to the error code.
[0109] In this embodiment, different error codes correspond to different abnormal contents, and cache abnormality may be one of them. According to the corresponding table of abnormal contents and error codes, it can be determined whether it is a cache abnormality by the error code. When an abnormality occurs during the monitoring of the loading process, the error code of the abnormal state can be extracted to determine whether the target page has abnormal cache.
[0110] This application uses a pre-set correspondence table of exception content and error codes to quickly determine whether the target page has an abnormal cache by extracting the error code of the abnormal state that occurs during the loading process.
[0111] In some optional implementations of this embodiment, the step S206 of controlling the monitoring module to clear the abnormal cache and reload the target page includes the following steps:
[0112] Controlling the monitoring module to clear the abnormal cache stored in the browser where the target page is located;
[0113] Reloading the target page from the server according to the page data to obtain updated page content;
[0114] The updated page content is cached in the browser.
[0115] In this embodiment, the abnormal cache is a cache pre-stored in the browser. When the cache content changes, the monitoring module clears the cache, reloads it from the server, and caches the updated page content in the browser for subsequent calls to the cache content.
[0116] This application can automatically clear the abnormal cache and load new cache content into the browser by controlling the monitoring module, avoiding the problem of users being unable to open pages due to abnormal caching, and making it more convenient to load new cache content later.
[0117] In some optional implementations of this embodiment, after controlling the monitoring module to clear the abnormal cache and reload the target page in step S206, the electronic device may further perform the following steps:
[0118] Controlling the monitoring module to generate an error log according to the abnormal cache;
[0119] Extract error parameters from the error log and determine the corresponding error code.
[0120] In this embodiment, the monitoring module can also generate an error log according to the abnormal cache, and can extract error parameters from the error log to determine the error code, and the key factors of the abnormal cache error can be obtained according to the error code.
[0121] This application can quickly obtain the problems that occur during the target page loading process through the generated error logs and error codes, so as to analyze and improve the error problems later.
[0122] In some optional implementations of this embodiment, after receiving the user's page access request in step S201, the electronic device may further perform the following steps:
[0123] Setting a loading priority order according to the preset importance of the target page;
[0124] The page elements with high priority in the target page are loaded according to the priority order.
[0125] In this embodiment, loading priorities are set for different page elements according to the importance of the page and the user's focus. For example, critical CSS and JavaScript files can be loaded first to ensure that the critical path of the page is completed as soon as possible and improve the interactive time of the page.
[0126] This application can ensure that the critical path of the page is completed as quickly as possible and improve the interactive time of the page by setting the priority order.
[0127] In some optional implementations of this embodiment, after the step of reloading the target page, the electronic device may further perform the following steps:
[0128] Monitor the target page loading process in real time and collect performance indicators, wherein the performance indicators calculate a comprehensive score of the target page loading based on the loading time, resource size, and number of requests;
[0129] Determining whether the comprehensive score is lower than a preset threshold;
[0130] If it is lower than that, then identifying the slow-loading resources in the target page;
[0131] When the resource that is slowly loaded is identified as a large picture resource, a progressive picture loading technology is used to split the large picture into multiple small pictures for loading;
[0132] When it is identified that the resource that is slowly loaded is a video resource, a streaming transmission technology is used to cut the video into multiple video segments for loading.
[0133] In this embodiment, progressive image loading technology is a network image optimization method that allows images to be displayed gradually during the loading process, first displaying a portion of the blurred image, and then gradually displaying the complete original image as the loading is completed. In addition, progressive image loading can be combined with lazy loading technology, by first displaying a low-resolution or blurred thumbnail, and then replacing it after the original image is loaded, thereby reducing the number of HTTP requests and traffic consumption, while providing a smooth visual effect. In detail, after the large image is divided into multiple small images, during the loading process, a portion of the blurred small images are first displayed, and then as the loading is completed, the complete multiple small images are gradually displayed; in addition, low-resolution or blurred thumbnails can also be displayed first, and then replaced after the original image of the small image is loaded, thereby providing a smooth visual effect.
[0134] Streaming is a packet or message data exchange technology that transmits instant applications and multimedia data (such as video, audio, images, etc.) in the form of streams over the network, so that the receiving end can process while receiving without waiting for the entire file to be downloaded. Specifically, in this embodiment, the video is divided into multiple video segments, and streaming technologies such as segmented transmission and frame transmission are used to transmit and receive these video segments one by one, and the received video segments are reassembled into a complete video at the receiving end.
[0135] Monitor the page loading process in real time and collect performance indicators such as loading time, resource size, and number of requests. By analyzing these data, we can find out the performance bottleneck of page loading and take targeted measures to continuously optimize the page loading performance.
[0136] This application collects performance indicators, calculates the comprehensive score of target page loading, analyzes key issues that affect loading speed, and optimizes these issues in a targeted manner, thereby speeding up the loading process of the target page.
[0137] In some optional implementations of this embodiment, the calculating the comprehensive score of the target page loading based on the loading time, resource size, and request number includes the following steps:
[0138] Calculate corresponding weight values according to the importance of the loading time, resource size and number of requests;
[0139] The comprehensive score of the target page loading is calculated according to the corresponding weight value.
[0140] In this embodiment, the page loading event refers to the time required from the user initiating a request to the page being fully loaded, which is an important indicator for measuring web page performance. The number of requests and resource size also directly affect the page loading speed.
[0141] This application calculates the importance of loading time, resource size and number of requests, obtains the corresponding weights, and then calculates the comprehensive score of the target page loading, which is conducive to the subsequent targeted optimization of indicators affecting page loading.
[0142] It should be emphasized that in order to further ensure the privacy and security of the above-mentioned page cache information, the above-mentioned page cache information can also be stored in a node of a blockchain.
[0143] The blockchain referred to in this application is a new application model of computer technologies such as distributed data storage, peer-to-peer transmission, consensus mechanism, encryption algorithm, etc. Blockchain is essentially a decentralized database, a string of data blocks generated by cryptographic methods. Each data block contains a batch of network transaction information, which is used to verify the validity of its information (anti-counterfeiting) and generate the next block. Blockchain can include the underlying blockchain platform, platform product service layer, and application service layer.
[0144] The embodiments of the present application can acquire and process relevant data based on artificial intelligence technology. Among them, artificial intelligence (AI) is the theory, method, technology and application system that uses digital computers or machines controlled by digital computers to simulate, extend and expand human intelligence, perceive the environment, acquire knowledge and use knowledge to obtain the best results.
[0145] AI basic technologies generally include sensors, dedicated AI chips, cloud computing, distributed storage, big data processing technology, operation / interaction systems, mechatronics, etc. AI software technologies mainly include computer vision technology, robotics technology, biometrics technology, speech processing technology, natural language processing technology, and machine learning / deep learning. This application can be applied to the field of smart leasing, thereby promoting the construction of smart cities.
[0146] Those skilled in the art can understand that all or part of the processes in the above-mentioned embodiments can be implemented by instructing the relevant hardware through computer-readable instructions, and the computer-readable instructions can be stored in a computer-readable storage medium. When the program is executed, it can include the processes of the embodiments of the above-mentioned methods. Among them, the aforementioned storage medium can be a non-volatile storage medium such as a disk, an optical disk, a read-only memory (ROM), or a random access memory (RAM).
[0147] It should be understood that, although the steps in the flowchart of the accompanying drawings are displayed in sequence as indicated by the arrows, these steps are not necessarily executed in sequence in the order indicated by the arrows. Unless otherwise specified herein, there is no strict order restriction on the execution of these steps, and they can be executed in other orders. Moreover, at least a part of the steps in the flowchart of the accompanying drawings may include multiple sub-steps or multiple stages, and these sub-steps or stages are not necessarily executed at the same time, but can be executed at different times, and their execution order is not necessarily sequential, but can be executed in turn or alternately with other steps or at least a part of the sub-steps or stages of other steps.
[0148] Further references Figure 3 , as a response to the above Figure 2 The present application provides an embodiment of a page loading device, and the device embodiment is similar to Figure 2 Corresponding to the method embodiment shown, the device can be specifically applied to various electronic devices.
[0149] like Figure 3 As shown, the page loading device 300 described in this embodiment includes: a first receiving module 301, a first judging module 302, a second receiving module 303 and a processing module 304, or a capturing module 305, and a control module 306. Among them:
[0150] The first receiving module 301 is used to receive a page access request from a user, where the page access request is used to request access to a target page;
[0151] A first determination module 302 is used to determine whether the target page has an abnormal cache, where the abnormal cache is used to indicate a running error, an asynchronous error, or a resource loading error;
[0152] The second receiving module 303 is used to receive an instruction from the user to clear the abnormal cache and reload the target page when the judgment result is yes;
[0153] The processing module 304 is used to clear the exception cache and reload the target page according to the instruction; or
[0154] The device 300 includes a capture module 305, which is used to trigger a monitoring module pre-deployed on the target page to capture the abnormal cache when the judgment result is yes;
[0155] The control module 306 is used to control the monitoring module to clear the abnormal cache and reload the target page.
[0156] In this embodiment, the first receiving module 301 receives a page access request from a user, and the page access request is used to request access to a target page to obtain the page requested by the user; the first judging module 302 judges whether the target page has an exception cache, and the exception cache is used to indicate a running error, an asynchronous error or a resource loading error, so as to monitor the exception cache in the target page; the second receiving module 303 receives an instruction issued by the user to clear the exception cache and reload the target page when the judgment result is yes, so as to obtain the user instruction; the processing module 304 clears the exception cache and reloads the target page according to the instruction, so as to enable the user to quickly clear the exception cache and reload the page; or the device includes a capturing module 305, which triggers a monitoring module pre-deployed on the target page to capture the exception cache when the judgment result is yes, so as to enable the monitoring module to capture the exception cache; the control module 306 controls the monitoring module to clear the exception cache and reload the target page, so as to clear the exception cache and load the page. This application retains the advantages of caching, and only clears the cache and reloads the page when abnormal caching occurs, which improves the fluency of users when using H5 pages, reduces customer complaints, and is also conducive to business promotion.
[0157] In some optional implementations of this embodiment, the first determination module 302 includes:
[0158] The acquisition unit 3021 is used to acquire the page data of the page access request, and load and render the target page according to the page data;
[0159] The monitoring unit 3022 is used to monitor the loading process of the target page in real time;
[0160] An extraction unit 3023 is used to extract an error code of the abnormal state when monitoring that an abnormality occurs in the loading process of the target page;
[0161] The judging unit 3024 is configured to judge whether the target page has abnormal cache according to the error code.
[0162] In this embodiment, different error codes correspond to different abnormal contents, and cache abnormality may be one of them. According to the corresponding table of abnormal contents and error codes, it can be determined whether it is a cache abnormality by the error code. When an abnormality occurs during the monitoring of the loading process, the error code of the abnormal state can be extracted to determine whether the target page has abnormal cache.
[0163] This application uses a pre-set correspondence table of exception content and error codes to quickly determine whether the target page has an abnormal cache by extracting the error code of the abnormal state that occurs during the loading process.
[0164] In some optional implementations of this embodiment, the control module 306 includes:
[0165] A clearing unit 3061, used to control the monitoring module to clear the abnormal cache stored in the browser where the target page is located;
[0166] The loading unit 3062 is used to reload the target page from the server according to the page data to obtain updated page content;
[0167] The cache unit 3063 is used to cache the updated page content in the browser.
[0168] In this embodiment, the abnormal cache is a cache pre-stored in the browser. When the cache content changes, the monitoring module clears the cache, reloads it from the server, and caches the updated page content in the browser for subsequent calls to the cache content.
[0169] This application can automatically clear the abnormal cache and load new cache content into the browser by controlling the monitoring module, avoiding the problem of users being unable to open pages due to abnormal caching, and making it more convenient to load new cache content later.
[0170] In some optional implementations of this embodiment, the apparatus 300 further includes:
[0171] A generating module 307, used to control the monitoring module to generate an error log according to the abnormal cache;
[0172] The extraction module 308 is used to extract error parameters from the error log and determine the corresponding error code.
[0173] In this embodiment, the monitoring module can also generate an error log according to the abnormal cache, and can extract error parameters from the error log to determine the error code, and the key factors of the abnormal cache error can be obtained according to the error code.
[0174] This application can quickly obtain the problems that occur during the target page loading process through the generated error logs and error codes, so as to analyze and improve the error problems later.
[0175] In some optional implementations of this embodiment, the apparatus 300 further includes:
[0176] A setting module 309, used to set a loading priority order according to the preset importance of the target page;
[0177] The loading module 310 is used to load the page elements with high priority in the target page according to the priority order.
[0178] In this embodiment, loading priorities are set for different page elements according to the importance of the page and the user's focus. For example, critical CSS and JavaScript files can be loaded first to ensure that the critical path of the page is completed as soon as possible and improve the interactive time of the page.
[0179] This application can ensure that the critical path of the page is completed as quickly as possible and improve the interactive time of the page by setting the priority order.
[0180] In some optional implementations of this embodiment, the apparatus 300 further includes:
[0181] The collection module 311 is used to monitor the loading process of the target page in real time and collect performance indicators, including loading time, resource size and number of requests;
[0182] A calculation module 312, used to calculate a comprehensive score of the target page loading based on the loading time, resource size and request number;
[0183] The second judgment module 313 is used to judge whether the comprehensive score is lower than a preset threshold;
[0184] An identification module 314, configured to identify the slowly loading resources in the target page when the determination result of the second determination module 313 is yes;
[0185] The segmentation module 315 is used to adopt progressive image loading technology to segment the large image into multiple small images for loading when the slowly loading resource is identified as a large image resource; and to adopt streaming transmission technology to segment the video into multiple video segments for loading when the slowly loading resource is identified as a video resource.
[0186] In this embodiment, the page loading process is monitored in real time, and performance indicators such as loading time, resource size, and number of requests are collected. By analyzing these data, the performance bottleneck of page loading is found, and targeted processing is performed to continuously optimize the page loading performance.
[0187] This application collects performance indicators, calculates the comprehensive score of target page loading, analyzes key issues that affect loading speed, and optimizes these issues in a targeted manner, thereby speeding up the loading process of the target page.
[0188] In some optional implementations of this embodiment, the calculation module 312 includes:
[0189] A first calculation unit 3121 is used to calculate corresponding weight values according to the importance of the loading time, resource size and number of requests;
[0190] The second calculation unit 3122 is used to calculate the comprehensive score of the target page loading according to the corresponding weight value.
[0191] In this embodiment, the page loading event refers to the time required from the user initiating a request to the page being fully loaded, which is an important indicator for measuring web page performance. The number of requests and resource size also directly affect the page loading speed.
[0192] This application calculates the importance of loading time, resource size and number of requests, obtains the corresponding weights, and then calculates the comprehensive score of the target page loading, which is conducive to the subsequent targeted optimization of indicators affecting page loading.
[0193] It should be emphasized that in order to further ensure the privacy and security of the above-mentioned page cache information, the above-mentioned page cache information can also be stored in a blockchain node.
[0194] To solve the above technical problems, the present application also provides a computer device. Figure 4 , Figure 4 This is a basic structural block diagram of the computer device in this embodiment.
[0195] The computer device 4 includes a memory 41, a processor 42, and a network interface 43 that are interconnected through a system bus. It should be noted that the figure only shows a computer device 4 with components 41-43, but it should be understood that it is not required to implement all the components shown, and more or fewer components can be implemented instead. Among them, those skilled in the art can understand that the computer device here is a device that can automatically perform numerical calculations and / or information processing according to pre-set or stored instructions, and its hardware includes but is not limited to microprocessors, application specific integrated circuits (Application Specific Integrated Circuit, ASIC), programmable gate arrays (Field-Programmable Gate Array, FPGA), digital processors (Digital Signal Processor, DSP), embedded devices, etc.
[0196] The computer device may be a computing device such as a desktop computer, a notebook, a PDA, a cloud server, etc. The computer device may interact with a user through a keyboard, a mouse, a remote controller, a touch pad, or a voice control device.
[0197] The memory 41 includes at least one type of readable storage medium, and the readable storage medium includes flash memory, hard disk, multimedia card, card-type memory (for example, SD or DX memory, etc.), random access memory (RAM), static random access memory (SRAM), read-only memory (ROM), electrically erasable programmable read-only memory (EEPROM), programmable read-only memory (PROM), magnetic memory, disk, optical disk, etc. In some embodiments, the memory 41 can be an internal storage unit of the computer device 4, such as a hard disk or memory of the computer device 4. In other embodiments, the memory 41 can also be an external storage device of the computer device 4, such as a plug-in hard disk equipped on the computer device 6, a smart memory card (Smart Media Card, SMC), a secure digital (Secure Digital, SD) card, a flash card (FlashCard), etc. Of course, the memory 41 can also include both the internal storage unit of the computer device 4 and its external storage device. In this embodiment, the memory 41 is generally used to store the operating system and various application software installed on the computer device 4, such as computer-readable instructions of the page loading method, etc. In addition, the memory 41 can also be used to temporarily store various types of data that have been output or are to be output.
[0198] The processor 42 may be a central processing unit (CPU), a controller, a microcontroller, a microprocessor, or other data processing chips in some embodiments. The processor 42 is generally used to control the overall operation of the computer device 4. In this embodiment, the processor 42 is used to run computer-readable instructions stored in the memory 41 or process data, such as computer-readable instructions for running the page loading method.
[0199] The network interface 43 may include a wireless network interface or a wired network interface. The network interface 43 is generally used to establish a communication connection between the computer device 4 and other electronic devices.
[0200] The computer device of the present application receives a page access request from a user, wherein the page access request is used to request access to a target page, so as to obtain the page requested by the user; determines whether the target page has an abnormal cache, wherein the abnormal cache is used to indicate a running error, an asynchronous error or a resource loading error, so as to monitor the abnormal cache in the target page; if so, receives an instruction issued by the user to clear the abnormal cache and reload the target page, so as to obtain the user's instruction; clears the abnormal cache and reloads the target page according to the instruction, so as to enable the user to quickly clear the abnormal cache and reload the page; or triggers the monitoring module pre-deployed on the target page to capture the abnormal cache, so as to enable the monitoring module to capture the abnormal cache; controls the monitoring module to clear the abnormal cache and reload the target page, so as to clear the abnormal cache and load the page. The present application retains the advantages of the cache, and only clears the cache and reloads the page when an abnormal cache occurs, which improves the fluency of users when using H5 pages, reduces the customer complaint rate, and is also conducive to the promotion of business.
[0201] The present application also provides another implementation, namely, providing a computer-readable storage medium, wherein the computer-readable storage medium stores computer-readable instructions, and the computer-readable instructions can be executed by at least one processor to enable the at least one processor to perform the steps of the page loading method as described above.
[0202] The computer-readable storage medium of the present application receives a page access request from a user, and the page access request is used to request access to a target page, so as to obtain the page requested by the user; determines whether the target page has an abnormal cache, and the abnormal cache is used to indicate a running error, an asynchronous error, or a resource loading error, so as to monitor the abnormal cache in the target page; if so, receives an instruction issued by the user to clear the abnormal cache and reload the target page, so as to obtain the user's instruction; clears the abnormal cache and reloads the target page according to the instruction, so as to enable the user to quickly clear the abnormal cache and reload the page; or triggers the monitoring module pre-deployed on the target page to capture the abnormal cache, so as to enable the monitoring module to capture the abnormal cache; controls the monitoring module to clear the abnormal cache and reload the target page, so as to clear the abnormal cache and load the page. The present application retains the advantages of the cache, and only clears the cache and reloads the page when an abnormal cache occurs, which improves the fluency of users when using H5 pages, reduces the customer complaint rate, and is also conducive to the promotion of business.
[0203] Through the description of the above implementation methods, those skilled in the art can clearly understand that the above-mentioned embodiment methods can be implemented by means of software plus a necessary general hardware platform, and of course by hardware, but in many cases the former is a better implementation method. Based on such an understanding, the technical solution of the present application, or the part that contributes to the prior art, can be embodied in the form of a software product, which is stored in a storage medium (such as ROM / RAM, magnetic disk, optical disk), and includes a number of instructions for a terminal device (which can be a mobile phone, computer, server, air conditioner, or network device, etc.) to execute the methods described in each embodiment of the present application.
[0204] Obviously, the embodiments described above are only some embodiments of the present application, rather than all embodiments. The preferred embodiments of the present application are given in the accompanying drawings, but they do not limit the patent scope of the present application. The present application can be implemented in many different forms. On the contrary, the purpose of providing these embodiments is to make the understanding of the disclosure of the present application more thorough and comprehensive. Although the present application is described in detail with reference to the aforementioned embodiments, for those skilled in the art, it is still possible to modify the technical solutions recorded in the aforementioned specific implementation methods, or to perform equivalent replacement of some of the technical features therein. Any equivalent structure made using the contents of the specification and drawings of this application, directly or indirectly used in other related technical fields, is similarly within the scope of patent protection of this application.
Claims
1. A page loading method, characterized in that: The steps include: Receive a page access request from a user, wherein the page access request is used to request access to a target page; Determine whether the target page has an abnormal cache, where the abnormal cache is used to indicate a running error, an asynchronous error, or a resource loading error; If yes, receiving an instruction from the user to clear the abnormal cache and reload the target page; Clear the exception cache and reload the target page according to the instruction; or Triggering a monitoring module pre-deployed on the target page to capture the abnormal cache; Control the monitoring module to clear the exception cache and reload the target page.
2. The page loading method according to claim 1, characterized in that: The step of determining whether the target page has abnormal cache specifically includes: Obtaining page data of the page access request, and loading and rendering the target page according to the page data; Performing real-time monitoring on the loading process of the target page; When monitoring that an exception occurs in the loading process of the target page, extracting an error code of the abnormal state; It is determined whether the target page has abnormal cache according to the error code.
3. The page loading method according to claim 2, characterized in that: The step of controlling the monitoring module to clear the abnormal cache and reload the target page specifically includes: Controlling the monitoring module to clear the abnormal cache stored in the browser where the target page is located; Reloading the target page from the server according to the page data to obtain updated page content; The updated page content is cached in the browser.
4. The page loading method according to claim 1, characterized in that: After the step of controlling the monitoring module to clear the abnormal cache and reload the target page, the method further includes: Controlling the monitoring module to generate an error log according to the abnormal cache; Extract error parameters from the error log and determine the corresponding error code.
5. The page loading method according to claim 1, characterized in that: After receiving the page access request from the user, the method further includes: Setting a loading priority order according to the preset importance of the target page; The page elements with high priority in the target page are loaded according to the priority order.
6. The page loading method according to claim 1, characterized in that: After the step of reloading the target page, the method further includes: Monitor the loading process of the target page in real time and collect performance indicators, including loading time, resource size, and number of requests; Calculate a comprehensive score of the target page loading based on the loading time, resource size, and number of requests; Determining whether the comprehensive score is lower than a preset threshold; If it is lower than that, then identifying the slow-loading resources in the target page; When the resource that is slowly loaded is identified as a large picture resource, a progressive picture loading technology is used to split the large picture into multiple small pictures for loading; When it is identified that the resource that is slowly loaded is a video resource, a streaming transmission technology is used to cut the video into multiple video segments for loading.
7. The page loading method according to claim 6, characterized in that: The step of calculating the comprehensive score of the target page loading based on the loading time, resource size and request number specifically includes: Calculate corresponding weight values according to the importance of the loading time, resource size and number of requests; The comprehensive score of the target page loading is calculated according to the corresponding weight value.
8. A page loading device, characterized in that: include: A first receiving module is used to receive a page access request from a user, wherein the page access request is used to request access to a target page; A first judgment module is used to judge whether the target page has an abnormal cache, and the abnormal cache is used to indicate a running error, an asynchronous error or a resource loading error; A second receiving module is used to receive an instruction from the user to clear the abnormal cache and reload the target page when the judgment result is yes; a processing module, configured to clear the exception cache and reload the target page according to the instruction; or The device includes a capture module, which is used to trigger a monitoring module pre-deployed on the target page to capture the abnormal cache when the judgment result is yes; The control module is used to control the monitoring module to clear the abnormal cache and reload the target page.
9. A computer device, characterized in that: The method comprises a memory and a processor, wherein the memory stores computer-readable instructions, and the processor implements the steps of the page loading method according to any one of claims 1 to 7 when executing the computer-readable instructions.
10. A computer-readable storage medium, characterized in that: The computer-readable storage medium stores computer-readable instructions, and when the computer-readable instructions are executed by a processor, the steps of the page loading method according to any one of claims 1 to 7 are implemented.
Citation Information
Patent Citations
A page loading method and device for avoiding cache clearing after front-end upgrade
CN113656110B
Page loading method and device, computer equipment and storage medium
CN109582899A
Page cache management method and system, terminal equipment and storage medium
CN110245307A
Webpage opening method and device and computer readable storage medium
CN110795650A
Page loading method, device and system
CN111259300A
Cited By
Project resource loading method and device, equipment and storage medium
CN120541319A