Method and device for quickly loading page module

By performing static and online compression on the server and adding mask components to the client, the slow loading speed and white screen problems caused by the huge size of the development framework are solved, and faster page loading speed and better user experience are achieved.

CN120162494APending Publication Date: 2025-06-17XIAN JIAODA JIEPU NETWORK SCI & TECH CO LTD
View PDF 0 Cites 0 Cited by

Patent Information

Application Number
CN202311721068.4
Authority / Receiving Office
CN · China
Patent Type
Applications(China)
Current Assignee / Owner
Filing Date
2023-12-14
Publication Date
2025-06-17

AI Technical Summary

Technical Problem

In the prior art, the large size of the development framework leads to large network overhead for web page requests, resulting in slow system response and poor user experience, especially the slow loading speed when switching sub-pages, resulting in long white screen time.

Method used

Optimize the loading speed of page files by performing static and online compression on the server side. Specific measures include: if the page file is not compressed in the first way, the second way is performed after receiving the client access request; before the client, the page submodule is loaded, add a mask component to the main page, and close the mask component after all submodules are loaded.

Benefits of technology

It realizes the reduction of file packaging volume, improves file response and page and submodule loading speed, avoids white screen problems, and improves user experience.

✦ Generated by Eureka AI based on patent content.
Patent Text Reader

Abstract

According to the page module processing method and device for increasing the loading speed, static compression and online compression are started at the same time, static compression is preferentially carried out when the file is uploaded to the server, and online compression is carried out when the server responds only when static compression is not carried out, so that server resources are saved, and the loading speed is increased. And the file packaging volume can be reduced, and the file response and the loading speed of the page and the submodule thereof are improved. Meanwhile, before all the sub-modules of the page are loaded, the mask is set for the main page, the white screen problem caused when loading is slow is avoided, and the actual experience of a user can be improved.
Need to check novelty before this filing date? Find Prior Art

Description

Technical Field

[0001] The present invention belongs to the technical field of web page display, and in particular relates to a method for quickly loading page files and a device applying the method. Background Art

[0002] With the development of technology, various Web-based services have become the mainstream of many system applications. However, due to the large volume of many development frameworks, which occupy a large network overhead in web requests, the entire software system responds slowly, and the user experience is greatly reduced. Especially when frequently requesting, loading, creating, and initializing in a browser, repeated page data interaction with the server is required, which easily leads to the collapse of the front end of the system.

[0003] A situation faced in reality is that some systems require that only a part of the subsystems can be installed, and it is required that the subsequent upgrade of the subsystems does not affect the existing other modules. This results in a situation in the system that when the front-end files of the subsystems are large, there is a long blank screen time due to the slow loading speed during the switching of sub-pages, which greatly affects the user experience. Summary of the Invention

[0004] In view of the above background, the present invention aims to provide a method and a device for processing page modules to accelerate the loading speed, and the specific technical solutions are as follows: A method for loading page modules includes: before the page file is uploaded to the server, if the first compression is not performed during packaging, after the server receives the access request from the client, the page file is secondarily compressed and then returned; before the page sub-module of the client is loaded, a mask component with a preset style is added to the main page, and when it is monitored that all sub-modules are loaded, the mask component is closed.

[0005] Preferably, if the page file has been first compressed, the second compression is not performed again.

[0006] Further, before the above-mentioned first compression, it also includes cutting files larger than a first preset value and then packaging them, and independently packaging the common framework files in the page files.

[0007] Further, the above-mentioned file cutting includes performing splitting only when the number of times a file is referenced exceeds a second preset value.

[0008] Further, the above-mentioned first compression only performs data compression on files whose size is greater than a third preset value before compression and less than a fourth preset value after compression; and sets a compression level for indicating the degree of compression according to the file size.

[0009] Further, for the above-mentioned second compression, only files with a size greater than the fifth preset value before compression are compressed; meanwhile, the server performance consumption is monitored, and when the preset resource consumption is exceeded, the compression level is reduced until the resource consumption is lower than the preset.

[0010] Preferably, for the above-mentioned page mask component, when switching sub-modules, a mask component covering the main page is displayed, and a loading style is added, and the mask component is closed after the sub-module is loaded.

[0011] On the other hand, a page file loading device is also proposed, including: A compression module for compressing page files; A splitting module for splitting files exceeding the preset value; A loading module for loading the requested page files.

[0012] Before the page file is uploaded to the server, if the first compression is not performed during packaging, the server performs the second compression on the page file and then returns it after receiving the access request.

[0013] Before the page sub-module is loaded, a mask component with a preset style is added to the main page, and when it is monitored that all sub-modules are loaded, the mask component is closed.

[0014] The present invention adopting the above technical solution has at least the following beneficial effects: Static compression and online compression are enabled simultaneously, and static compression is preferentially performed when the file is uploaded to the server. Only when static compression is not performed, the server performs online compression during response, which not only saves server resources but also reduces the file packaging volume, improves the file response and the loading speed of the page and its sub-modules. At the same time, before all sub-modules of the page are loaded, a mask is set for the main page to avoid the white screen problem when the loading is slow, and the actual user experience can be improved. Embodiment

[0015] To make the purpose, technical solution and advantages of the present invention clearer, the technical solution of the present invention will be clearly and completely described below in conjunction with the embodiments.

[0016] With the IFrame technology of the HTML standard, the module function display and configuration area that occupies the most network and browser resources is separately designed in an IFrame. On the one hand, it avoids the problem that the complex module situation in the module function area causes an exception and makes other areas unavailable; on the other hand, the module function area can also be separated from other areas and loaded separately. For the part outside the module function area, lightweight technology can be used to ensure efficiency.

[0017] For the module function area, create and initialize it using the first loading; after the subsequent module is opened, directly create the instances of the components to be used. In this way, the entire software user interface is requested and initialized only once when it is opened for the first time, and the created component instances are reused, thus greatly improving the overall operation efficiency. Embodiment 1

[0018] This embodiment proposes a page module loading method, including: before the page file is uploaded to the server, if the first compression is not performed during packaging, after the server receives the access request from the client, the page file is secondarily compressed and then returned; before the page sub-module of the client is loaded, a mask component with a preset style is added to the main page, and when it is monitored that all sub-modules are loaded, the mask component is closed.

[0019] Preferably, if the page file has been first compressed, the second compression is no longer performed.

[0020] Furthermore, before the above-mentioned first compression, it also includes cutting the files larger than the first preset value and then packaging them, and independently packaging the common framework files in the page file.

[0021] Furthermore, the above-mentioned file cutting includes performing splitting only when the number of times the file is referenced exceeds the second preset value.

[0022] Furthermore, the above-mentioned first compression only performs data compression on files whose size is greater than the third preset value before compression and less than the fourth preset value after compression; and sets the compression level for indicating the compression degree according to the file size.

[0023] Furthermore, the above-mentioned second compression only compresses files whose size is greater than the fifth preset value before compression; at the same time, monitors the performance consumption of the server, and when the preset resource consumption is exceeded, reduces the compression level until the resource consumption is lower than the preset.

[0024] Preferably, the above-mentioned page mask component displays a mask component covering the main page and adds a loading style when switching sub-modules, and closes the mask component after the sub-module is loaded. Embodiment 2

[0025] This embodiment proposes a page file loading device, including: A compression module for compressing the page file; A splitting module for splitting files exceeding the preset value; A loading module for loading the requested page file.

[0026] Before the device uploads the page file to the server, if the first compression is not performed during packaging, the server performs the second compression on the page file and then returns it after receiving an access request.

[0027] Before the page sub-module is loaded completely, a mask component with a preset style is added to the main page, and when it is monitored that all sub-modules are loaded completely, the mask component is closed.

[0028] In the embodiments of the present invention as described above, static compression and online compression are enabled simultaneously, and static compression is preferentially performed when the file is uploaded to the server. Only when static compression is not possible, the server performs online compression during response. This not only saves server resources but also can reduce the file packaging volume, improve the file response and the loading speed of the page and its sub-modules. At the same time, before all sub-modules of the page are loaded completely, a mask is set for the main page to avoid the white screen problem when the loading is slow, which can improve the actual user experience.

[0029] Those of ordinary skill in the art can understand that all or part of the steps in implementing the above embodiments of the method can be completed by instructing relevant hardware through a program. The program can be stored in a computer-readable storage medium, such as ROM / RAM, magnetic disk, optical disc, etc.

[0030] The above description of the disclosed embodiments enables those skilled in the art to implement or use the present invention. Various modifications to these embodiments will be obvious to those skilled in the art, and the general principles defined herein can be implemented in other embodiments without departing from the spirit or scope of the present invention. Therefore, the present invention will not be limited to the embodiments shown herein, but will be accorded the widest scope consistent with the principles disclosed herein.

Claims

1. A method for rapid loading of page modules, characterized in that, Including: Before the page file is uploaded to the server, if the first compression is not performed during packaging, after the server receives the access request from the client, it performs the second compression on the page file and then returns it; Before the page sub-module of the client is loaded, a mask component with a preset style is added to the main page, and when it is monitored that all sub-modules are loaded, the mask component is closed.

2. The method for rapid page loading according to claim 1, characterized in that, If the page file has been subjected to the first compression, the second compression is no longer performed.

3. The method for rapid page loading according to claim 1, characterized in that, Before the first compression, it also includes cutting files larger than the first preset value and then packaging them, and independently packaging the common framework files in the page file.

4. The method for rapid page loading according to claim 3, characterized in that, The file cutting includes splitting only when the number of times the file is referenced exceeds the second preset value.

5. The method for rapid page loading according to claim 1, characterized in that, The first compression only performs data compression on files whose size is larger than the third preset value before compression and smaller than the fourth preset value after compression; and sets the compression level used to represent the compression degree according to the file size.

6. The method for rapid page loading according to claim 1, characterized in that, The second compression only compresses files whose size is larger than the fifth preset value before compression; at the same time, it monitors the server performance consumption, and when the preset resource consumption is exceeded, it reduces the compression level until the resource consumption is lower than the preset.

7. The method for rapid page loading according to claim 1, characterized in that, When the page mask component switches sub-modules, it displays a mask covering the main page and adds a loading style, and closes the mask after the sub-module is loaded.

8. A page file loading device, characterized in that, The device includes: A compression module for compressing the page file; A splitting module for splitting files exceeding the preset value; A loading module for loading the requested page file.

9. The device according to claim 8, characterized in that, Before the page file is uploaded to the server, if the first compression is not performed during packaging, after the server receives the access request, it performs the second compression on the page file and then returns it.

10. The device according to claim 8, characterized in that, Before the page sub-module is loaded, a mask component with a preset style is added to the main page, and when it is monitored that all sub-modules are loaded, the mask component is closed.