Page resource loading method and device, equipment and storage medium
By adding a tag loader to the web page code to automatically configure priority tags, the problem of low page resource loading efficiency is solved and the user experience and development efficiency are significantly improved.
Patent Information
- Application Number
- CN202411258630.9
- Authority / Receiving Office
- CN · China
- Patent Type
- Applications(China)
- Current Assignee / Owner
- Filing Date
- 2024-09-09
- Publication Date
- 2025-01-21
AI Technical Summary
In the prior art, the overall loading efficiency of page resources is low, resulting in poor user experience.
By adding a tag loader to the web page code, the tag loader automatically configures priority tags for each resource to be loaded in the web page, thereby giving priority to some resources to be loaded.
It significantly reduces the use of the user's overall resource loading when opening the webpage, which improves the user's browsing experience, and improves the page resource loading efficiency of page resources during page development.
Smart Images

Figure CN119336402A_ABST
Abstract
Description
Technical Field
[0001] The present application relates to the field of data processing technology, and in particular to a page resource loading method, device, equipment and storage medium. Background Art
[0002] In the field of Internet website development, each web page of the website usually contains multiple resources to be loaded, such as external pictures, videos, link addresses and texts. These contents that need to be loaded will be loaded at the same time as the user enters the web page. When there are many resources to be loaded in the web page, the loading time will be long, or even the page cannot be loaded, which leads to a poor user experience.
[0003] In the related art, developers will add priority tags to the resources to be loaded in the web page code, so as to load some resources in the page in advance or in priority according to the priority tags, thereby improving the loading speed when users browse the web page. However, the addition of priority tags depends on the manual completion of the developer, but this method has low processing efficiency, resulting in low overall loading efficiency of page resources and poor user experience in actual use. Summary of the invention
[0004] The present application provides a page resource loading method, device, equipment and storage medium, which are used to solve the problems of low overall loading efficiency of page resources and poor user experience in the prior art.
[0005] In a first aspect, the present application provides a page resource loading method, comprising: determining reference information of a tag loader contained in a target page, wherein the tag loader is used to add a priority tag to a target resource to be loaded in the target page, and the tag loader information is configured with priority tag rule information, the priority tag rule information includes identification rule parameters of the target resource to be loaded and a corresponding priority tag type, and the target resource to be loaded is used to represent a resource to be loaded to which a priority tag needs to be added; based on the reference information, calling the tag loader, wherein the tag loader is used to determine the target resource to be loaded based on the identification rule parameters, and add a priority tag of a corresponding type to the target resource to be loaded, so as to complete the loading of the resource to be loaded based on the priority tag in the target page.
[0006] In one possible design, the reference information is obtained in the following manner: generating an environment configuration file corresponding to the label loader, the environment configuration file is used to record the environment information required for the operation of the label loader; determining parameter information of the label loader, the parameter information includes priority label rule information; generating the label loader based on the parameter information; and determining the reference information corresponding to the label loader.
[0007] In one possible design, generating an environment configuration file corresponding to a tag loader includes: determining configuration information of the tag loader in the directory where a target page is located, wherein the configuration information includes a file name of the tag loader; and generating an environment configuration file corresponding to the tag loader based on the configuration information.
[0008] In one possible design, parameter information of a tag loader is determined, including: determining target page parameters corresponding to the tag loader, wherein the target page parameters include identification information of the target page and path information of the target web page in the corresponding web page project; determining identification rule parameters of target resources to be loaded corresponding to each priority tag, wherein the identification rule parameters are used to identify target resources to be loaded that need to add priority tags from the resources to be loaded.
[0009] In a possible design, the resources to be loaded include static resources to be loaded and domain names to be resolved, and the types of priority tags include: a pre-retrieval tag for preferentially loading static resources to be loaded in a sub-page corresponding to a current page; a pre-load tag for preferentially loading static resources to be loaded in the current page; a pre-connection tag for preferentially loading domain names to be resolved in a sub-page corresponding to the current page in a first type of browser; and a DNS pre-retrieval tag for preferentially loading domain names to be resolved in a sub-page corresponding to the current page in a second type of browser, wherein the second type of browser supports different page code versions from the first type of browser.
[0010] In one possible design, identification rule parameters corresponding to the target resource to be loaded corresponding to each priority tag are determined, including: based on the file name rule of the static resource to be loaded and the path information of the target page corresponding to the static resource to be loaded, determining the identification rule parameters corresponding to the pre-retrieval tag and the pre-loading tag; based on the file name or file name rule of the domain name to be resolved, determining the identification rule parameters corresponding to the resource to be loaded by the pre-connection tag and the DNS pre-retrieval tag.
[0011] In a possible design, generating a tag loader based on the parameter information includes: adding the parameter information to a pre-generated code template of the tag loader to obtain the tag loader.
[0012] In a possible design, after determining the reference information corresponding to the tag loader, the method further includes: entering the reference information corresponding to the tag loader into the code of the target page.
[0013] In a second aspect, the present application provides a page resource loading device, comprising: a determination module, used to determine reference information of a tag loader contained in a target page, wherein the tag loader is used to add a priority tag to a target resource to be loaded in the target page, and the tag loader information is configured with priority tag rule information, the priority tag rule information includes identification rule parameters of the target resource to be loaded and a corresponding priority tag type, and the target resource to be loaded is used to indicate a resource to be loaded to which a priority tag needs to be added; a processing module, used to call the tag loader based on the reference information, wherein the tag loader is used to determine the target resource to be loaded based on the identification rule parameters, and add a priority tag of a corresponding type to the target resource to be loaded, so as to complete the loading of the resource to be loaded based on the priority tag in the target page.
[0014] In a third aspect, an embodiment of the present application provides an electronic device, comprising: at least one processor and a memory; the memory stores computer execution instructions; the at least one processor executes the computer execution instructions stored in the memory, so that the at least one processor executes the page resource loading method described in the first aspect and various possible designs of the first aspect.
[0015] In a fourth aspect, an embodiment of the present application provides a computer-readable storage medium, in which computer execution instructions are stored. When a processor executes the computer execution instructions, the page resource loading method described in the first aspect and various possible designs of the first aspect is implemented.
[0016] In a fifth aspect, an embodiment of the present application provides a computer program product, including a computer program. When the computer program is executed by a processor, it implements the page resource loading method described in the first aspect and various possible designs of the first aspect.
[0017] The page resource loading method, device, equipment and storage medium provided by the present application, by determining the reference information of the tag loading program contained in the target page, and then based on the reference information, calling the tag loading program, so that the tag loading program determines the target resource to be loaded based on the identification rule parameters, and then adds the corresponding type of priority tag to the target resource to be loaded, so as to complete the loading of the resource to be loaded based on the priority tag in the target page. Thus, by calling the tag loading program, the priority processing of the resources to be loaded in the target page and its subpages can be completed, so that by giving priority to some resources to be loaded, the overall resource loading time when the user opens the web page can be significantly reduced, thereby improving the user's browsing experience, and the configuration of the identification rule parameters is flexible and convenient, and the corresponding priority tags can be configured for specific resources or specific types of resources, and the priority tag configuration can be realized quickly and in batches without manual addition, which significantly improves the efficiency of page resource loading priority configuration in the page development process, improves the page development efficiency and maintenance efficiency, and saves the labor intensity of developers. BRIEF DESCRIPTION OF THE DRAWINGS
[0018] The accompanying drawings, which are incorporated in and constitute a part of this specification, illustrate embodiments consistent with the present application and, together with the description, serve to explain the principles of the present application.
[0019] Figure 1 An application scenario diagram for loading page resources of the prior art;
[0020] Figure 2 It is an application scenario diagram of the page resource loading method applicable to the embodiment of the present application;
[0021] Figure 3 The process of the page resource loading method provided in the embodiment of the present application Figure 1 ;
[0022] Figure 4a The process of the page resource loading method provided in the embodiment of the present application Figure 2 ;
[0023] Figure 4b for Figure 4a A flow chart of a method for generating an environment configuration file provided in the illustrated embodiment;
[0024] Figure 4c for Figure 4a A flow chart of a method for determining parameter information provided in the illustrated embodiment;
[0025] Figure 4d for Figure 4a A flow chart of a method for determining identification rule parameters corresponding to different priority tags provided in the illustrated embodiment;
[0026] Figure 5A schematic diagram of the structure of a page resource loading device provided in an embodiment of the present application;
[0027] Figure 6 A schematic diagram of the structure of an electronic device provided in an embodiment of the present application.
[0028] The above drawings have shown clear embodiments of the present application, which will be described in more detail later. These drawings and text descriptions are not intended to limit the scope of the present application in any way, but to illustrate the concept of the present application to those skilled in the art by referring to specific embodiments. DETAILED DESCRIPTION
[0029] Exemplary embodiments will be described in detail herein, examples of which are shown in the accompanying drawings. When the following description refers to the drawings, the same numbers in different drawings represent the same or similar elements unless otherwise indicated. The implementations described in the following exemplary embodiments do not represent all implementations consistent with the present application. Instead, they are merely examples of devices and methods consistent with some aspects of the present application as detailed in the appended claims.
[0030] In the technical solution of this application, the collection, storage, use, processing, transmission, provision and disclosure of information such as financial data or user data involved shall comply with the provisions of relevant laws and regulations and shall not violate public order and good morals.
[0031] It should be noted that in the embodiments of the present application, certain software, components, models and other existing solutions in the industry may be mentioned, and they should be regarded as exemplary. Their purpose is only to illustrate the feasibility of implementing the technical solution of the present application, but it does not mean that the applicant has or will necessarily use the solution.
[0032] Figure 1 The application scenario diagram for the page resource loading of the prior art. Figure 1 As shown, the application scenario includes: a developer 110 , a web page 120 , and a browser 130 .
[0033] In the prior art, in the field of Internet websites or web page development, each web page of the website usually contains multiple resources to be loaded, such as external images, videos, link addresses, text and other resources. These resources will be loaded at the same time as the user enters the web page by default (for the link address, it is actually necessary to parse the address when the user enters the web page). When there are many resources to be loaded in a web page, or there are large resources, the overall loading time of the page will be long, so that the user needs to wait for a long time to view the specific information content in the page, or even the page cannot be successfully loaded due to the long loading time, thereby resulting in a poor user experience when the user browses such web pages.
[0034] In the related art, when the developer 110 develops the web page 120, he will manually add different priority tags for the resources to be loaded in the web page code, such as tags for preloading resources, so as to load some of the resources to be loaded in the page in advance or preferentially according to such priority tags, thereby improving the loading speed when the user browses the web page 120 through the browser 130. However, the addition of priority tags depends on the developer's manual completion. For pages with a large number of resources to be loaded or website projects with a large number of pages, this method will have the problem of low processing efficiency; another method is to use existing front-end tools, such as webpack, vite, etc., to select a certain type of resources to be loaded in a certain page (such as all image resources), and uniformly add the same tag. This method has poor flexibility and cannot be configured differently for different resources. It also relies on the corresponding front-end tools, making the page development process more cumbersome, which leads to low overall loading efficiency of page resources and poor user experience in the actual development process.
[0035] In response to the above technical problems, the present application proposes the following technical concept: by adding a tag loader to the webpage code, the tag loader automatically configures priority tags for each resource to be loaded in the webpage, so as to give priority to some resources to be loaded according to the priority tags. In this way, the problem of low overall loading efficiency of page resources and poor user experience in the prior art can be solved.
[0036] The technical solution of the present application and how the technical solution of the present application solves the above-mentioned technical problems are described in detail below with specific embodiments. The following specific embodiments can be combined with each other, and the same or similar concepts or processes may not be repeated in some embodiments. The embodiments of the present application will be described below in conjunction with the accompanying drawings.
[0037] Figure 2 FIG. 1 is an application scenario diagram of the page resource loading method applicable to the embodiment of the present application. Figure 2 As shown, the application scenario includes: a developer 210, a tag loader 220, a web page 230, and a browser 240. Among them, the tag loader 220 and the web page 230 may belong to the same server, and the server may be a single server or a server cluster including multiple servers. The browser 240 may be set in a browser application in a computer, a mobile terminal, or a smart device that can communicate on the Internet. At this time, the developer 210 adds the tag loader 220 to the code of the web page 230, so that when the browser 240 opens the web page 230, it automatically calls the tag loader 210 to add priority tags to the relevant resources, and completes the resource priority loading process according to the priority tag, thereby completing the page resource loading process.
[0038] based on Figure 2In the application scenario shown, an embodiment of the present application also provides a page resource loading method. Figure 3 The process of the page resource loading method provided in the embodiment of the present application Figure 1 .like Figure 3 As shown, the page resource loading method includes:
[0039] Step S301: Determine that the target page contains reference information of the tag loader.
[0040] Among them, the tag loader is used to add priority tags to the target resources to be loaded in the target page. The tag loader information is configured with priority tag rule information. The priority tag rule information includes the identification rule parameters of the target resources to be loaded and the corresponding priority tag type. The target resources to be loaded are used to indicate the resources to be loaded that need to add priority tags.
[0041] The execution subject of the method of this embodiment may be Figure 2 The browser shown in , and does not require any additional front-end tools.
[0042] Specifically, the target page is a page that needs to configure the loading order (or loading priority) of external resources (resources to be loaded) by adding priority tags.
[0043] There may be a large number of resources to be loaded in the target page (in this case, priority tags are needed to configure the loading order of different resources), or a small number of resources to be loaded (in this case, priority tags can be used to load the corresponding sub-pages to be loaded in advance when the user browses the current page, so as to reduce the overall loading time of the sub-pages when the user browses the sub-pages). Selecting some (or all) of the resources to be loaded as target resources to be loaded and adding priority tags to them can enable them to be loaded or parsed first, so that users can see these resources first when browsing web pages, such as pictures at the top of the web page, the web page player and its corresponding video.
[0044] When the target page (code) contains reference information of the tag loader, when the browser opens the target page, it will read the reference information, call the tag loader, and add a priority tag to the target resource to be loaded in the target page.
[0045] For a website project (including multiple web pages and corresponding databases) or a web page project (a part of a website project, including at least one web page), the number of target pages can be arbitrary, that is, there can be only one target page with reference information added, or there can be multiple target pages. When there are multiple target pages, the code of each target page needs to contain reference information.
[0046] When there are multiple target pages containing reference information in the same website project, the reference information between different target pages can be the same (such as based on the same priority tag rule information) or different (such as configuring the corresponding priority tag rule information according to the characteristics of the resources to be loaded corresponding to different target pages, and obtaining the corresponding tag loader, and the reference information between different tag loaders is different).
[0047] The reference information is the information required to call the tag loader, such as the program name of the tag loader and the path address of the tag loader relative to the target page. Different target pages can be configured with corresponding tag loaders separately. In this case, the priority tag information in the tag loaders corresponding to different target pages is different, and the corresponding reference information is also different. There may also be multiple target pages that share the same tag loader (for example, if these target pages are display pages corresponding to the same type of information, such as a campus news display page, and the elements contained therein are of the same type and named in the same way, then the same tag loader can be used for resource preloading). In this case, the reference information corresponding to the target pages that share the same tag loader is the same.
[0048] Step S302: Based on the reference information, call the label loading program.
[0049] Among them, the tag loading program is used to determine the target resource to be loaded based on the identification rule parameters, and add a priority tag of the corresponding type to the target resource to be loaded, so as to complete the loading of the resource to be loaded based on the priority tag in the target page.
[0050] Specifically, the identification rule parameters record the characteristics of the target resources to be loaded, such as all containing specific file noun suffixes. For example, there are five resources to be loaded in a target page, A1.jpg, A2.jpg, A3.jpg, B1.mp4, and B2.mp4, of which the first three are image resources and are the target resources to be loaded. Then the identification rule can be that among the resources to be loaded corresponding to the target page, all resources whose file names contain A are determined as target resources to be loaded.
[0051] Recording the recognition rule in code form (such as recording it in a regular expression) is the recognition rule parameter.
[0052] When the tag loader is called based on the reference information, the tag loader will determine the target resources to be loaded according to the identification rule parameters, and add corresponding priority tags to these target resources to be loaded according to the priority tag rule information. At this time, the browser can load the corresponding types of target resources to be loaded in order according to the priority tags.
[0053] This embodiment determines the reference information of the tag loader contained in the target page, and then calls the tag loader based on the reference information, so that the tag loader determines the target resource to be loaded based on the identification rule parameters, and then adds the corresponding type of priority tag to the target resource to be loaded, so as to complete the loading of the resource to be loaded based on the priority tag in the target page. Thus, by calling the tag loader, the priority processing of the resources to be loaded in the target page and its subpages can be completed, so that by giving priority to some resources to be loaded, the overall resource loading time when the user opens the web page can be significantly reduced, thereby improving the user's browsing experience, and the configuration of the identification rule parameters is flexible and convenient, and the corresponding priority tags can be configured for specific resources or specific types of resources, and the priority tag configuration can be realized quickly and in batches without manual addition, which significantly improves the efficiency of the page resource loading priority configuration in the page development process, improves the page development efficiency and maintenance efficiency, and saves the labor intensity of developers.
[0054] Figure 4a The process of the page resource loading method provided in the embodiment of the present application Figure 2 .like Figure 4a As shown, the page resource loading method includes the following steps:
[0055] Step S401: Generate an environment configuration file corresponding to the tag loading program.
[0056] The environment configuration file is used to record the environment information required for the tag loader to run.
[0057] Specifically, this embodiment further describes in detail the complete method flow of page resource loading.
[0058] Before calling the tag loader, you need to generate the tag loader and add its reference information to the corresponding page.
[0059] Generating a label loader mainly involves generating an environment configuration file corresponding to the label loader and determining parameter information required in the label loader.
[0060] In one embodiment of the present disclosure, the tag loader is a scaffolding tool program based on the javascript language. At this time, the environment configuration file is a package.json file, and the environment information is the information recorded in the package.json file, which is further described below.
[0061] like Figure 4b As shown, it is a flow chart of a method for generating an environment configuration file, which includes the following steps:
[0062] Step S4011, determine the configuration information of the tag loader in the directory where the target page is located.
[0063] The configuration information includes the file name of the tag loader.
[0064] Specifically, the label loader needs to contain the corresponding file name, which can be recorded in the environment configuration file through the bin field. The file name is also required when the label loader is called by reference information. Therefore, before generating the label loader, its file name needs to be determined and entered into the environment configuration file.
[0065] For example, add the code "bin": ". / bin / a.js" in the package.json file, that is, the file name of the tag loader is a.js, where the bin field can be used to record the local file name that can be directly called by an external command, that is, the file name of the tag loader, and ". / bin / " is used to indicate the specific installation path of the tag loader in the root directory corresponding to the target page. In actual applications, the path information can be configured according to requirements. The relevant principles are common knowledge in the field of javascript programming and will not be repeated here.
[0066] According to the needs of developers, other configuration information can also be added to the environment configuration file, such as the version of the tag loader, comment information, and supported browser types, etc. There is no restriction here.
[0067] Step S4012: Generate an environment configuration file corresponding to the tag loader based on the configuration information.
[0068] Specifically, combined with the determined configuration information, an environment configuration file of the tag loader (such as the package.json file in the above example) can be obtained. During the startup of the target page, the browser can be guided to correctly run the tag loader based on the environment configuration file.
[0069] Step S402: Determine parameter information of the label loading program.
[0070] The parameter information includes priority label rule information.
[0071] Specifically, after determining the environment configuration file, it is necessary to further determine the parameter information required by the tag loader, including priority tag rule information such as files that need to add priority tags, the path of the target page corresponding to the resource to be loaded, and other information.
[0072] like Figure 4c As shown, it is a flow chart of a method for determining parameter information, which includes the following steps:
[0073] Step S4021, determining the target page parameters corresponding to the tag loading program.
[0074] The target page parameters include identification information of the target page and path information of the target web page in the corresponding web page item.
[0075] Specifically, to ensure that the tag loader can run on the specified target page, it is necessary to determine the identification information of the target page (such as the webpage name or webpage code) and the relative path of the target webpage in the corresponding webpage project or website project.
[0076] For example, in the tag loader, two parameters can be used to express the information required for the target page parameters, namely DistPath and ProjectRootPath. The former is used to indicate the path of the target page to which the tag output by the tag loader belongs, that is, the identification information of the target page; the latter is used to indicate the path of the root directory (of the website project) where the target page is located.
[0077] In some embodiments, if the tag loader can be applied to multiple target pages, the identification information of the corresponding target pages may include the web page names or codes of all target pages to which it can be applied (i.e., listing all target pages), or may include the naming rules of the identification information of all applicable target pages. For example, a regular expression may be used to limit the value of DistPath to all pages whose page names contain testpoint, so that the tag loader can be applied to multiple pages with the file names testpoint1.html, testpoint2.html, and testpoint3.html.
[0078] In some embodiments, if the tag loading program is applicable to multiple target pages, the path information corresponding parameter of the relevant target page in the corresponding web page item may also list all paths that may correspond to the target page or the corresponding path defined by a regular rule.
[0079] Furthermore, the resource to be loaded is usually recorded in a fixed position in the target web page code in the form of a link (such as in the head part of the HTML document corresponding to the target web page), so there is no need to additionally determine the position of the resource to be loaded relative to the target web page.
[0080] Step S4022: Determine identification rule parameters corresponding to the target resource to be loaded for each priority tag.
[0081] The identification rule parameter is used to identify the target resource to be loaded to which a priority tag needs to be added from the resources to be loaded.
[0082] Specifically, there are multiple priority tags used to prompt the browser to prioritize loading of target resources to be loaded, and usually multiple target resources to be loaded can be added with the same priority tag. Therefore, in the tag loading program, the characteristics of the target resources to be loaded corresponding to each priority tag will be recorded in the form of identification rule parameters.
[0083] The combination of various priority labels corresponding to identification rule parameters is the priority label rule information.
[0084] Furthermore, the resources to be loaded include static resources to be loaded and domain names to be resolved, and the types of priority tags include: a pre-retrieval tag for preferentially loading static resources to be loaded in a sub-page corresponding to the current page; a pre-loading tag for preferentially loading static resources to be loaded in the current page; a pre-connection tag for preferentially loading domain names to be resolved in sub-pages corresponding to the current page in a first type of browser; a DNS pre-retrieval tag for preferentially loading domain names to be resolved in sub-pages corresponding to the current page in a second type of browser, wherein the second type of browser supports different page code versions from the first type of browser.
[0085] Specifically, static resources to be loaded are resources such as fonts, images, and videos that obtain corresponding files from access links, and domain names to be resolved are resources that need to obtain corresponding IP addresses from DNS servers based on domain names in access links (and establish TCP and LCS links). The two types of target resources to be loaded require different processing methods, so their corresponding priority tags are also different.
[0086] A subpage is a page that can be jumped to through the current page (also known as the target page) and belongs to the same web page project as the current page.
[0087] For static resources to be loaded, you can configure pre-fetch tags or pre-load tags for processing. For domain names to be resolved, you can configure pre-connect tags or DNS pre-fetch tags for processing.
[0088] Exemplarily, the format of the pre-retrieval tag can be <link rel="prefetch" href=" / main.js"> , where prefetch means pre-fetch action, href means resource path, so main.js is the static resource to be loaded that needs to be pre-fetched.
[0089] Exemplarily, the format of the preload tag can be <link rel="preload" as="font" href=" / main.woff">, where preload means pre-fetching action, as="font" means the resource type of the static resource to be loaded is a font file, and main.woff is the file name of the static resource to be loaded that needs to be pre-fetched. Resources with the preload tag applied are usually loaded first in the web page with a higher priority (high priority), and the loading order is second only to the page document itself, so that the font can be rendered and take effect earlier in the page.
[0090] For the above two types of tags, corresponding functions or parameters can be used to record the resource information to be loaded corresponding to the tags, that is, the corresponding values of the above as and href attributes.
[0091] Among them, the pre-fetch tag can not only give priority to loading the static resources to be loaded in the sub-page, but also be used to give priority to loading the resources with lower priority in the current page, such as font files based on external links.
[0092] The main difference between the pre-connection tag and the DNS pre-retrieval tag is that they identify different browser versions. When it is uncertain what version of the browser the user will use to access the target page, a pre-connection tag and a DNS pre-retrieval tag are usually added to the domain name to be resolved (that is, the domain name to be resolved is entered twice in the code of the target page, and two tags are added respectively). When the browser processes the domain name to be resolved corresponding to one of the tags, when it encounters the domain name to be resolved corresponding to the other tag, it will skip it directly without repeated processing.
[0093] For example, the format of the pre-connection tag is as follows: <link rel="preconnect" href="https: / / xxx"> , where preconnect means preconnection action, and https: / / xxx is the domain name that needs to be preconnected; the format of the DNS prefetch tag is similar to that of the preconnect tag, except that rel="dns-prefetch" replaces rel="preconnect" in the above tag to indicate the DNS prefetch action. By adding these two types of tags, DNS addressing, TCP link establishment, and TLS handshake can be completed in advance, reducing the connection time when accessing the target domain name (i.e. "https: / / xxx") in the future, thereby improving the user experience.
[0094] In some embodiments, since pre-connection tags and DNS pre-retrieval tags are usually used at the same time, in the identification rule parameters, a function or parameter can be used to record the resource information to be loaded that needs to add these two types of tags (i.e., the assignment corresponding to the above-mentioned href attribute) to improve processing efficiency.
[0095] The following is a further description of the identification rule parameters corresponding to the above tags. Figure 4dAs shown, it is a flow chart of a method for determining identification rule parameters corresponding to different priority tags, which includes the following steps:
[0096] Step A1: determining identification rule parameters corresponding to the pre-retrieval tag and the pre-load tag based on the file name rule of the static resource to be loaded and the path information of the target page corresponding to the static resource to be loaded.
[0097] Specifically, there are usually a large number of files corresponding to pre-retrieval tags and pre-loading tags, and the naming has certain rules, so the file name rules and path information can be recorded through regular expressions or the like (some static resources to be loaded may have been pre-loaded in other pages. In this case, you only need to specify the resource through the path information and call it directly without having to load it repeatedly). The recorded file name rules and path information can be used as identification rule parameters corresponding to the pre-retrieval tags and pre-loading tags.
[0098] Step A2: Based on the file name or file name rule of the domain name to be resolved, determine the identification rule parameters of the pre-connection tag and the DNS pre-retrieval tag corresponding to the resource to be loaded.
[0099] Specifically, since the domain name to be resolved usually directly corresponds to the target page, there is no need to consider the path information. The naming of different domain names to be resolved may be quite different, making it difficult to summarize their rules. In this case, the file name (i.e., domain name) can be directly used as the identification rule parameter corresponding to the pre-connection tag and the DNS pre-retrieval tag.
[0100] If there are certain rules in the naming of the domain names to be resolved (such as they are all obtained from similar addresses of a specific website), the corresponding file name rules can be extracted and used as corresponding identification rule parameters.
[0101] In some embodiments, in addition to the above-mentioned types of parameters, the parameter information may also include a tag loader file name parameter, an environment configuration file name parameter, an interaction support parameter, etc. The first two are used to record the file name of the tag loader applied by the configuration information and the file name of the environment configuration file of the environment to ensure that the parameter information is called correctly and effectively. The interaction support parameter is used to indicate whether the resource to be loaded can feed back the user's interactive operations to the resources in the source address corresponding to the resource to be loaded (such as interactive form resources, modifications in a certain target page will synchronize the modification results to the corresponding database server).
[0102] Step S403: Generate a label loading program based on the parameter information.
[0103] Specifically, by determining the above parameter information, a tag loading program for adding a corresponding priority tag to the target resource to be loaded can be obtained.
[0104] Furthermore, the parameter information is added to the code template of the pre-generated label loader program to obtain the label loader program.
[0105] Specifically, except for the above-mentioned parameter information, other parts of the code between different label loaders can remain unchanged. Therefore, a code template of the label loader can be generated in advance, so that the corresponding label loader can be directly obtained by filling the parameter information into the code template, thereby improving the generation efficiency of the label loader.
[0106] Step S404: Determine reference information corresponding to the tag loader.
[0107] Specifically, after obtaining the tag loader, the program name of the tag loader and the path address of the tag loader relative to the target page and other information can be obtained as reference information to call the tag loader.
[0108] Step S405: Enter the reference information corresponding to the tag loading program into the code of the target page.
[0109] Specifically, after obtaining the reference information corresponding to the tag loader, the reference information can be entered into the target page (the specific location is usually in the head part of the HTML document). Thus, when the browser loads the HTML document of the target page, the tag loader can be automatically called to add a priority tag to the target resource to be loaded.
[0110] Step S406: Determine whether the target page contains reference information of the tag loader.
[0111] Step S407: Based on the reference information, call the label loading program.
[0112] Specifically, step S406 to step S407 are the same as the corresponding steps in the aforementioned embodiment and will not be repeated here.
[0113] This embodiment first generates the environment configuration information and parameter information corresponding to the tag loader, obtains the tag loader, extracts its reference information, and then enters the reference information into the target page, so that when the browser opens the target page, the tag loader is automatically called. In this way, it can be ensured that when different types of target pages and different types of target resources to be loaded are processed in a corresponding manner, these target resources to be loaded can be prioritized, thereby reducing the time required for the overall opening of the web page, improving the web page loading efficiency, and further improving the user's web browsing experience.
[0114] Figure 5 This is a schematic diagram of the structure of the page resource loading device provided in the embodiment of the present application. Figure 5As shown, the page resource loading device 500 includes: a determination module 510 and a processing module 520;
[0115] The determination module 510 is used to determine the reference information of the tag loader in the target page, wherein the tag loader is used to add a priority tag to the target resource to be loaded in the target page, and the tag loader information is configured with priority tag rule information, and the priority tag rule information includes identification rule parameters of the target resource to be loaded and the corresponding priority tag type, and the target resource to be loaded is used to indicate the resource to be loaded that needs to add a priority tag;
[0116] Processing module 520 is used to call the tag loading program based on the reference information, wherein the tag loading program is used to determine the target resource to be loaded based on the identification rule parameters, and add a priority tag of the corresponding type to the target resource to be loaded, so as to complete the loading of the resource to be loaded based on the priority tag in the target page.
[0117] In some embodiments, the determination module 510 is specifically used to: obtain reference information in the following manner: generate an environment configuration file corresponding to the label loader, the environment configuration file is used to record the environment information required for the operation of the label loader; determine parameter information of the label loader, the parameter information includes priority label rule information; based on the parameter information, generate the label loader; determine the reference information corresponding to the label loader.
[0118] In some embodiments, the determination module 510 is specifically used to: determine the configuration information of the tag loader in the directory where the target page is located, wherein the configuration information includes the file name of the tag loader; and generate an environment configuration file corresponding to the tag loader based on the configuration information.
[0119] In some embodiments, the determination module 510 is specifically used to: determine the target page parameters corresponding to the tag loading program, wherein the target page parameters include the identification information of the target page and the path information of the target web page in the corresponding web page project; determine the identification rule parameters of the target resources to be loaded corresponding to each priority tag, and the identification rule parameters are used to identify the target resources to be loaded that need to add priority tags from the resources to be loaded.
[0120] In some embodiments, the determination module 510 specifically includes: the resources to be loaded include static resources to be loaded and domain names to be resolved, and the types of priority tags include: a pre-retrieval tag for preferentially loading static resources to be loaded in a sub-page corresponding to the current page; a pre-loading tag for preferentially loading static resources to be loaded in the current page; a pre-connection tag for preferentially loading domain names to be resolved in sub-pages corresponding to the current page in a first type of browser; a DNS pre-retrieval tag for preferentially loading domain names to be resolved in sub-pages corresponding to the current page in a second type of browser, wherein the second type of browser supports different page code versions from the first type of browser.
[0121] In some embodiments, the determination module 510 is specifically used to: determine the identification rule parameters corresponding to the pre-retrieval tag and the pre-loading tag based on the file name rule of the static resource to be loaded and the path information of the target page corresponding to the static resource to be loaded; determine the identification rule parameters of the resource to be loaded corresponding to the pre-connection tag and the DNS pre-retrieval tag based on the file name or file name rule of the domain name to be resolved.
[0122] In some embodiments, the determination module 510 is specifically used to: add the parameter information to a code template of a pre-generated label loader program to obtain the label loader program.
[0123] In some embodiments, the determination module 510 is further used to: after determining the reference information corresponding to the tag loader, enter the reference information corresponding to the tag loader into the code of the target page.
[0124] The page resource loading device provided in the embodiment of the present application can be used to execute the technical solution of the page resource loading method in the above embodiment. Its implementation principle and technical effect are similar and will not be repeated here.
[0125] It should be noted that it should be understood that the division of the various modules of the above device is only a division of logical functions. In actual implementation, they can be fully or partially integrated into one physical entity, or they can be physically separated. And these modules can all be implemented in the form of software calling through processing elements; they can also be all implemented in the form of hardware; some modules can also be implemented in the form of software calling through processing elements, and some modules can be implemented in the form of hardware. For example, the determination module 510 can be a separately established processing element, or it can be integrated in a chip of the above device for implementation. In addition, it can also be stored in the memory of the above device in the form of program code, and called and executed by a processing element of the above device. The function of the above determination module 510. The implementation of other modules is similar. In addition, these modules can be fully or partially integrated together, or they can be implemented independently. The processing element here can be an integrated circuit with signal processing capabilities. In the implementation process, each step of the above method or each module above can be completed by an integrated logic circuit of hardware in the processor element or instructions in the form of software.
[0126] Figure 6 This is a schematic diagram of the structure of an electronic device provided in an embodiment of the present application. Figure 6 As shown, the electronic device may include: a transceiver 61 , a processor 62 , and a memory 63 .
[0127] The processor 62 executes the computer execution instructions stored in the memory, so that the processor 62 executes the scheme in the above embodiment. The processor 62 can be a general-purpose processor, including a central processing unit CPU, a network processor (NP), etc.; it can also be a digital signal processor DSP, an application-specific integrated circuit ASIC, a field programmable gate array FPGA or other programmable logic devices, discrete gates or transistor logic devices, discrete hardware components.
[0128] The memory 63 is connected to the processor 62 via a system bus and completes communication between them. The memory 63 is used to store computer program instructions.
[0129] The transceiver 61 may be used to obtain tasks to be executed and configuration information of the tasks to be executed.
[0130] The system bus can be a peripheral component interconnect (PCI) bus or an extended industry standard architecture (EISA) bus, etc. The system bus can be divided into an address bus, a data bus, a control bus, etc. For ease of representation, only one thick line is used in the figure, but it does not mean that there is only one bus or one type of bus. The transceiver is used to realize the communication between the database access device and other computers (such as clients, read-write libraries, and read-only libraries). The memory may include random access memory (RAM) and may also include non-volatile memory.
[0131] The electronic device provided in the embodiment of the present application may be the terminal device of the above embodiment.
[0132] An embodiment of the present application also provides a chip for running instructions, which is used to execute the technical solution of the page resource loading method in the above embodiment.
[0133] An embodiment of the present application also provides a computer-readable storage medium, in which computer instructions are stored. When the computer instructions are executed on a computer, the computer executes the technical solution of the page resource loading method of the above embodiment.
[0134] An embodiment of the present application also provides a computer program product, which includes a computer program stored in a computer-readable storage medium. At least one processor can read the computer program from the computer-readable storage medium. When at least one processor executes the computer program, it can implement the technical solution of the page resource loading method in the above embodiment.
[0135] In the several embodiments provided in the present application, it should be understood that the disclosed devices and methods can be implemented in other ways. For example, the device embodiments described above are only schematic, for example, the division of modules is only a logical function division, and there may be other division methods in actual implementation, such as multiple modules can be combined or integrated into another system, or some features can be ignored or not executed. Another point is that the mutual coupling or direct coupling or communication connection shown or discussed can be an indirect coupling or communication connection through some interfaces, devices or modules, which can be electrical, mechanical or other forms.
[0136] The modules described as separate components may or may not be physically separated, and the components shown as modules may or may not be physical units, that is, they may be located in one place or distributed on multiple network units. Some or all of the modules may be selected according to actual needs to implement the solution of this embodiment.
[0137] In addition, each functional module in each embodiment of the present application can be integrated into one processing unit, or each module can exist physically separately, or two or more modules can be integrated into one unit. The above-mentioned module-composed unit can be implemented in the form of hardware or in the form of hardware plus software functional units.
[0138] The above-mentioned integrated module implemented in the form of a software function module can be stored in a computer-readable storage medium. The above-mentioned software function module is stored in a storage medium, including a number of instructions for enabling a computer device (which can be a personal computer, a server, or a network device, etc.) or a processor to perform some steps of the methods of various embodiments of the present application.
[0139] It should be understood that the above processor can be a central processing unit (CPU), or other general-purpose processors, digital signal processors (DSP), application-specific integrated circuits (ASIC), etc. A general-purpose processor can be a microprocessor or any conventional processor. The steps of the method disclosed in the invention can be directly embodied as being executed by a hardware processor, or can be executed by a combination of hardware and software modules in the processor.
[0140] The memory may include a high-speed RAM memory, and may also include a non-volatile storage NVM, such as at least one disk memory, and may also be a USB flash drive, a mobile hard disk, a read-only memory, a magnetic disk or an optical disk, etc.
[0141] The bus can be an Industry Standard Architecture (ISA) bus, a Peripheral Component Interconnect (PCI) bus, or an Extended Industry Standard Architecture (EISA) bus, etc. The bus can be divided into an address bus, a data bus, a control bus, etc. For ease of representation, the bus in the drawings of this application is not limited to only one bus or one type of bus.
[0142] The above storage medium can be implemented by any type of volatile or non-volatile storage device or a combination thereof, such as static random access memory (SRAM), electrically erasable programmable read-only memory (EEPROM), erasable programmable read-only memory (EPROM), programmable read-only memory (PROM), read-only memory (ROM), magnetic memory, flash memory, magnetic disk or optical disk. The storage medium can be any available medium that can be accessed by a general or special purpose computer.
[0143] An exemplary storage medium is coupled to a processor so that the processor can read information from the storage medium and write information to the storage medium. Of course, the storage medium can also be a component of the processor. The processor and the storage medium can be located in an application specific integrated circuit (ASIC). Of course, the processor and the storage medium can also exist as discrete components in an electronic control unit or a main control device.
[0144] Those skilled in the art can understand that all or part of the steps of implementing the above-mentioned method embodiments can be completed by hardware related to program instructions. The aforementioned program can be stored in a computer-readable storage medium. When the program is executed, the steps of the above-mentioned method embodiments are executed; and the aforementioned storage medium includes: ROM, RAM, disk or optical disk and other media that can store program codes.
[0145] Finally, it should be noted that the above embodiments are only used to illustrate the technical solutions of the present application, rather than to limit it. Although the present application has been described in detail with reference to the aforementioned embodiments, those skilled in the art should understand that they can still modify the technical solutions described in the aforementioned embodiments, or replace some or all of the technical features therein with equivalents. However, these modifications or replacements do not cause the essence of the corresponding technical solutions to deviate from the scope of the technical solutions of the embodiments of the present application.
Claims
1. A page resource loading method, characterized in that: include: Determine reference information of a tag loader program included in a target page, wherein the tag loader program is used to add a priority tag to a target resource to be loaded in the target page, and the tag loader program information is configured with priority tag rule information, and the priority tag rule information includes identification rule parameters of the target resource to be loaded and a corresponding priority tag type, and the target resource to be loaded is used to indicate a resource to be loaded that needs to be added with a priority tag; Based on the reference information, a tag loading program is called, wherein the tag loading program is used to determine the target resource to be loaded based on the identification rule parameters, and add a priority tag of a corresponding type to the target resource to be loaded, so as to complete the loading of the resource to be loaded based on the priority tag in the target page.
2. The method according to claim 1, characterized in that: The reference information is obtained in the following manner: Generate an environment configuration file corresponding to the label loading program, wherein the environment configuration file is used to record the environment information required for the label loading program to run; Determining parameter information of the label loading program, the parameter information including the priority label rule information; Based on the parameter information, generating the label loading program; Determine reference information corresponding to the tag loader.
3. The method according to claim 2, characterized in that The step of generating an environment configuration file corresponding to the label loader program includes: Determine configuration information of the tag loader in the directory where the target page is located, wherein the configuration information includes a file name of the tag loader; Based on the configuration information, an environment configuration file corresponding to the label loader is generated.
4. The method according to claim 2, characterized in that: The determining of parameter information of the label loading program includes: Determine the target page parameters corresponding to the tag loading program, wherein the target page parameters include identification information of the target page and path information of the target web page in the corresponding web page item; An identification rule parameter corresponding to each priority tag of a target resource to be loaded is determined, wherein the identification rule parameter is used to identify the target resource to be loaded to which a priority tag needs to be added from the resources to be loaded.
5. The method according to claim 4, characterized in that The resources to be loaded include static resources to be loaded and domain names to be resolved. The types of priority labels include: A pre-fetch tag for preferentially loading the static resources to be loaded in the subpage corresponding to the current page; Preload tags used to prioritize loading of static resources to be loaded in the current page; A pre-connection tag for preferentially loading the domain name to be resolved in the subpage corresponding to the current page in the first type of browser; A DNS pre-fetch tag for preferentially loading a domain name to be resolved in a subpage corresponding to a current page in a second-category browser, wherein the second-category browser supports a different page code version than the first-category browser.
6. The method according to claim 5, characterized in that The step of determining the identification rule parameters of the target resource to be loaded corresponding to each priority tag includes: Determine identification rule parameters corresponding to the pre-retrieval tag and the pre-load tag based on the file name rule of the static resource to be loaded and the path information of the target page corresponding to the static resource to be loaded; Based on the file name or file name rule of the domain name to be resolved, identification rule parameters of the resources to be loaded corresponding to the pre-connection tag and the DNS pre-retrieval tag are determined.
7. The method according to any one of claims 2 to 6, characterized in that The step of generating the label loading program based on the parameter information includes: The parameter information is added to a code template of a pre-generated label loader program to obtain the label loader program.
8. The method according to any one of claims 2 to 6, characterized in that After determining the reference information corresponding to the tag loader, the method further includes: The reference information corresponding to the tag loader is entered into the code of the target page.
9. A page resource loading device, characterized in that: include: A determination module, used for determining reference information of a tag loader program included in a target page, wherein the tag loader program is used for adding a priority tag to a target resource to be loaded in the target page, and the tag loader program information is configured with priority tag rule information, wherein the priority tag rule information includes identification rule parameters of the target resource to be loaded and a corresponding priority tag type, and the target resource to be loaded is used for indicating a resource to be loaded that needs to be added with a priority tag; A processing module is used to call a tag loading program based on the reference information, wherein the tag loading program is used to determine the target resource to be loaded based on the identification rule parameters, and add a priority tag of a corresponding type to the target resource to be loaded, so as to complete the loading of the resource to be loaded based on the priority tag in the target page.
10. An electronic device, characterized in that: include: A processor, and a memory communicatively connected to the processor; The memory stores computer-executable instructions; The processor executes the computer-executable instructions stored in the memory to implement the method according to any one of claims 1 to 8.
11. A computer-readable storage medium, characterized in that: The computer-readable storage medium stores computer-executable instructions, which are used to implement the method according to any one of claims 1 to 8 when executed by a processor.
12. A computer program product, characterized in that The invention comprises a computer program, which implements the method according to any one of claims 1 to 8 when being executed by a processor.