A sub-application running method, device and equipment based on a micro-frontend architecture

Abstract

The application discloses a sub-application running method based on a micro-frontend architecture, which comprises the following steps: in response to a trigger request of loading a target sub-application, loading application resources of a main application and an application core package of the main application, and simultaneously loading application resources of a candidate sub-application; reading and analyzing static resources of the target sub-application through a candidate resource entrance of the main application, obtaining parsed text corresponding to the static resources, and inserting the parsed text into a header of the main application, so as to load the static resources while loading the application resources of the main application; determining resource cache data according to the static resources, loading data of the application resources of the main application, the application core package of the main application and loading data of the application resources of the candidate sub-application; loading the target sub-application according to the resource cache data and running cache information of the target sub-application, and performing application data bridging on the main application and the target sub-application after the target sub-application is loaded. The response efficiency of the sub-application based on the micro-frontend architecture can be improved.

Description

Technical Field

[0001] The embodiments of the present invention relate to the field of computers, and in particular to a method, apparatus, device and storage medium for running sub-applications based on a micro-frontend architecture. Background Technology

[0002] The development trend of modern front-end applications is becoming increasingly functional and interactive. Micro-frontends, drawing inspiration from microservice architecture, break down a large front-end application into multiple independent and flexible smaller applications. Each application can be developed, run, and deployed independently, and then these smaller applications are combined into a complete application. Micro-frontends can both integrate multiple projects into one and reduce coupling between projects, improving project scalability.

[0003] Currently, micro-frontend solutions still have many areas that need improvement and optimization, especially for more complex B2B projects. Users launching sub-applications of B2B projects through the base project consumes a significant amount of time, system memory, and CPU resources, resulting in low sub-application response efficiency. Therefore, improving the response efficiency of sub-applications based on the micro-frontend architecture and reducing the workload on system memory and CPU is a problem that needs to be solved. Summary of the Invention

[0004] This invention provides a method, apparatus, and device for running sub-applications based on a micro-frontend architecture, which can improve the response efficiency of sub-applications and reduce the workload of system memory and CPU when running sub-applications based on a micro-frontend architecture.

[0005] According to one aspect of the present invention, a method for running a sub-application based on a micro-frontend architecture is provided, comprising:

[0006] In response to a trigger request to load the target sub-application, load the application resources and core package of the main application, and simultaneously load the application resources of the candidate sub-applications when idle.

[0007] By reading and parsing the static resources of the target sub-application through the candidate resource entry of the main application, obtaining the parsed text corresponding to the static resources, and inserting the parsed text into the header of the main application, so as to load the static resources at the same time as loading the application resources of the main application;

[0008] Based on the static resources, the loading data of the application resources of the main application, the application core package of the main application, and the loading data of the application resources of the candidate sub-applications, the resource cache data is determined;

[0009] The target sub-application is loaded based on the resource cache data and the runtime cache information of the target sub-application, and after the target sub-application is loaded, application data bridging is performed between the main application and the target sub-application.

[0010] According to another aspect of the present invention, a sub-application running device based on a micro-frontend architecture is provided, the device comprising:

[0011] The application resource loading module is used to respond to the trigger request to load the target sub-application, load the application resources of the main application and the application core package of the main application, and load the application resources of the candidate sub-applications when idle.

[0012] The static resource parsing module is used to read and parse the static resources of the target sub-application through the candidate resource entry of the main application, obtain the parsed text corresponding to the static resources, and insert the parsed text into the header of the main application, so as to load the static resources at the same time as loading the application resources of the main application;

[0013] The resource cache data determination module is used to determine resource cache data based on the static resources, the loading data of the application resources of the main application, the application core package of the main application, and the loading data of the application resources of the candidate sub-applications.

[0014] The application data bridging module is used to load the target sub-application based on the resource cache data and the runtime cache information of the target sub-application, and to perform application data bridging between the main application and the target sub-application after the target sub-application is loaded.

[0015] According to another aspect of the present invention, an electronic device is provided, the electronic device comprising:

[0016] At least one processor; and

[0017] A memory communicatively connected to the at least one processor; wherein,

[0018] The memory stores a computer program that can be executed by the at least one processor, which enables the at least one processor to execute the sub-application running method based on the micro-frontend architecture as described in any embodiment of the present invention.

[0019] According to another aspect of the present invention, a computer-readable storage medium is provided, the computer-readable storage medium storing computer instructions for causing a processor to execute and implement the sub-application running method based on a micro-frontend architecture as described in any embodiment of the present invention.

[0020] The technical solution of this invention, in response to a trigger request to load a target sub-application, loads the application resources and core package of the main application, while simultaneously loading the application resources of candidate sub-applications. Through the candidate resource entry point of the main application, it reads and parses the static resources of the target sub-application, obtains the parsed text corresponding to the static resources, and inserts the parsed text into the header of the main application, so that static resources are loaded simultaneously with the application resources of the main application. Based on the static resources, the loading data of the main application's application resources, the loading data of the main application's core package, and the loading data of the candidate sub-applications' application resources, resource cache data is determined. The target sub-application is loaded based on the resource cache data and the runtime cache information of the target sub-application, and after the target sub-application is loaded, application data bridging is performed between the main application and the target sub-application. This solution solves the problem of low response efficiency caused by the significant time consumption and high system memory and CPU usage when launching sub-applications of B-end projects through a base project. It improves the loading speed of the target sub-application, thereby improving the running efficiency of sub-applications based on the micro-frontend architecture, reducing the CPU workload on system memory during sub-application operation, and enhancing the user experience.

[0021] It should be understood that the description in this section is not intended to identify key or essential features of the embodiments of the present invention, nor is it intended to limit the scope of the invention. Other features of the invention will become readily apparent from the following description. Attached Figure Description

[0022] To more clearly illustrate the technical solutions in the embodiments of the present invention, the accompanying drawings used in the description of the embodiments will be briefly introduced below. Obviously, the accompanying drawings described below are only some embodiments of the present invention. For those skilled in the art, other drawings can be obtained based on these drawings without creative effort.

[0023] Figure 1 A flowchart illustrating a sub-application running method based on a micro-frontend architecture, provided in Embodiment 1 of the present invention;

[0024] Figure 2 A flowchart illustrating a sub-application running method based on a micro-frontend architecture, provided in Embodiment 2 of the present invention;

[0025] Figure 3 A flowchart illustrating a sub-application running method based on a micro-frontend architecture, provided in Embodiment 3 of the present invention;

[0026] Figure 4 This is a schematic diagram of the structure of a sub-application running device based on a micro-frontend architecture, provided in Embodiment 4 of the present invention.

[0027] Figure 5This is a schematic diagram of the structure of an electronic device provided in Embodiment 5 of the present invention. Detailed Implementation

[0028] To enable those skilled in the art to better understand the present invention, the technical solutions of the present invention will be clearly and completely described below with reference to the accompanying drawings of the embodiments of the present invention. Obviously, the described embodiments are only some embodiments of the present invention, and not all embodiments. Based on the embodiments of the present invention, all other embodiments obtained by those skilled in the art without creative effort should fall within the scope of protection of the present invention.

[0029] It should be noted that the terms "candidate" and "target," etc., in the specification, claims, and accompanying drawings of this invention are used to distinguish similar objects and are not necessarily used to describe a specific order or sequence. It should be understood that such data can be interchanged where appropriate so that embodiments of the invention described herein can be implemented in orders other than those illustrated or described herein. Furthermore, the terms "comprising" and "etc.", and any variations thereof, are intended to cover a non-exclusive inclusion; for example, a process, method, system, product, or apparatus that comprises a series of steps or units is not necessarily limited to those steps or units explicitly listed, but may include other steps or units not explicitly listed or inherent to such processes, methods, products, or apparatus.

[0030] Example 1

[0031] Figure 1 This document provides a flowchart of a sub-application running method based on a micro-frontend architecture, as described in Embodiment 1 of the present invention. This embodiment is applicable to situations involving the management of sub-application running using a micro-frontend architecture. This method can be executed by a sub-application running device based on a micro-frontend architecture, which can be implemented in hardware and / or software and can be configured in an electronic device. Figure 1 As shown, the method includes:

[0032] S110. In response to the trigger request to load the target sub-application, load the application resources and application core package of the main application, and at the same time load the application resources of the candidate sub-application when idle.

[0033] In this system, a sub-application is a web application that performs a specific task. A sub-application is part of a complete front-end project, and a well-developed sub-application should be able to run independently of the main application. The target sub-application is the one the user needs to trigger. Candidate sub-applications are all the sub-applications the user has access to after successfully logging into the micro-application management system website. Application resources can include system resources and dynamic resources. System resources are used to track application execution. Dynamic resources are data that can change in response to user requests. The application core package is the cdn.core core package. Candidate sub-applications are the sub-applications the user has access to.

[0034] It's important to note that the target sub-application is a sub-application of a B2B project. B2B projects are more complex than B2C projects, using more components and containing more sub-applications, resulting in a larger overall size. B2B projects refer to platforms, software, or other services primarily serving enterprises or other commercial projects; their main characteristic is that they are business-oriented, not providing services to ordinary customers. B2C projects, on the other hand, refer to platforms, software, or other services used by general consumers. B2C projects are services that ordinary users can access and use, addressing the needs of general consumers.

[0035] Specifically, in response to a user's trigger request for a target sub-application, the application resources of the main application corresponding to the target sub-application, as well as the application core package of the main application, are loaded. Based on user permissions, candidate sub-applications corresponding to the user are determined, and while the main application's application resources and application core package are being loaded, the application resources of the candidate sub-applications are loaded.

[0036] S120. Through the candidate resource entry of the main application, read and parse the static resources of the target sub-application, obtain the parsed text corresponding to the static resources, and insert the parsed text into the header of the main application, so as to load the static resources at the same time as loading the application resources of the main application.

[0037] Static resources refer to fixed pages on the front end. When the concurrency reaches a certain level, the static resources of the target sub-application need to be saved to a dedicated server. Static resources mainly include images, videos, JS, CSS, and some resource files. Generally, static resources can be accessed using a dedicated domain name. The candidate resource entry point is the sub-application's index.html file.

[0038] Specifically, the target resource entry point for the target sub-application is determined from the candidate resource entry points of the main application. The target sub-application's index.html file is then read through this entry point, parsed, and the corresponding parsed text (URL) for the static resources is obtained. After obtaining the parsed text for all static resources, it is inserted into the header of the main application to load static resources simultaneously with the main application's application resources.

[0039] For example, a method for obtaining the parsed text corresponding to static resources could be as follows: after the application resources of the main application are loaded, the main application is run, and the user's permissions are verified by the main application based on the user's login information. Based on the verification result, it is determined whether the user has the application permissions of the target sub-application. If so, the target resource entry corresponding to the target sub-application is determined from the candidate resource entry of the main application, and the static resources of the target sub-application are read and parsed through the target resource entry to obtain the parsed text corresponding to the static resources.

[0040] Specifically, after the main application's resources are loaded, the main application is run. The main application verifies the user's permissions based on their login information from the micro-application management system website, and determines whether the user has the necessary permissions for the target sub-application based on the verification result. If the user has the necessary permissions, the target resource entry point for the target sub-application is determined from the main application's candidate resource entry points. The static resources of the target sub-application are then read and parsed through this target resource entry point to obtain the corresponding parsed text URL.

[0041] Understandably, verifying user permissions before reading and parsing the static resources of the target sub-application can improve system security and prevent resource leaks.

[0042] S130. Determine resource cache data based on static resources, the loading data of application resources of the main application, the application core package of the main application, and the loading data of application resources of candidate sub-applications.

[0043] Specifically, static resources, the loading data of the main application's application resources, the application core package of the main application, and the loading data of the application resources of candidate sub-applications can be stored as resource cache data in the resource storage disk cache.

[0044] S140. Load the target sub-application based on the resource cache data and the runtime cache information of the target sub-application, and after the target sub-application is loaded, bridge the application data between the main application and the target sub-application.

[0045] Among them, the runtime cache information of the target sub-application refers to the application resources of the target sub-application extracted from the application resources of the candidate sub-applications.

[0046] Specifically, the runtime cache information of the target sub-application is extracted from the application resources of the candidate sub-applications. The target sub-application is then loaded based on the resource cache data in the disk cache and the runtime cache information of the target sub-application. After the target sub-application is loaded, application data bridging is performed between the main application and the target sub-application.

[0047] Understandably, when running the target sub-application, the browser can directly read the loaded static resources through the disk cache, without having to load the static resources of the target sub-application through HTTP requests. This can significantly improve loading speed, reduce white screen time, and thus improve user experience.

[0048] The technical solution provided in this embodiment, in response to a trigger request to load a target sub-application, loads the application resources and core package of the main application, while simultaneously loading the application resources of candidate sub-applications. Through the candidate resource entry point of the main application, it reads and parses the static resources of the target sub-application, obtains the parsed text corresponding to the static resources, and inserts the parsed text into the header of the main application, so that static resources are loaded simultaneously with the application resources of the main application. Based on the loading data of the static resources, the application resources of the main application, the application core package of the main application, and the application resources of the candidate sub-applications, resource cache data is determined. The target sub-application is loaded based on the resource cache data and the runtime cache information of the target sub-application, and after the target sub-application is loaded, application data bridging is performed between the main application and the target sub-application. This solution solves the problem of low response efficiency caused by the significant time consumption and high system memory and CPU usage when launching sub-applications of B-end projects through the base project. It improves the loading speed of the target sub-application, thereby improving the running efficiency of sub-applications based on the micro-frontend architecture, reducing the CPU workload on system memory during sub-application operation, and improving the user experience.

[0049] Example 2

[0050] Figure 2 This is a flowchart illustrating a sub-application running method based on a micro-frontend architecture, provided in Embodiment 2 of the present invention. This embodiment optimizes the above embodiments and provides a preferred implementation method for bridging application data between the main application and the target sub-application. Specifically, as shown... Figure 2 As shown, the method includes:

[0051] S210. In response to the trigger request to load the target sub-application, load the application resources and application core package of the main application, and at the same time load the application resources of the candidate sub-application when idle.

[0052] S220. Through the candidate resource entry of the main application, read and parse the static resources of the target sub-application, obtain the parsed text corresponding to the static resources, and insert the parsed text into the header of the main application, so as to load the static resources at the same time as loading the application resources of the main application.

[0053] S230. Determine resource cache data based on static resources, the loading data of application resources of the main application, the application core package of the main application, and the loading data of application resources of candidate sub-applications.

[0054] S240. Load the target sub-application based on the resource cache data and the runtime cache information of the target sub-application. After the target sub-application is loaded, store the common data of the main application and the target sub-application in the state manager of the main application and initialize the common data.

[0055] Public data refers to the same data used by the main application and the target sub-application.

[0056] Specifically, the target sub-application is loaded based on the resource cache data and the runtime cache information of the target sub-application. After the target sub-application is loaded, the common data between the main application and the target sub-application is determined, the common data is stored in the state manager of the main application, and the common data is initialized through the state manager of the main application.

[0057] S250. Based on the trigger request of the target sub-application, determine the opening method of the target sub-application; the opening method includes direct opening and indirect opening through the main application.

[0058] Direct activation refers to the method by which the user can directly activate the target sub-application without going through the main application.

[0059] Specifically, based on the trigger request of the target sub-application, the method of opening the target sub-application is determined from either direct opening or indirect opening through the main application.

[0060] S260. If the enabling method is to enable indirectly through the main application, the initialized common data is passed through the bridged data storage to the state manager of the target sub-application to achieve application data bridging.

[0061] This refers to the process of forwarding network data packets based on the link layer address of the OSI (Open Systems Interconnection) network model. Transparent transmission, or pass-through transmission, refers to a data transmission method that, regardless of the content of the transmitted service, only transmits the content from the source address to the destination address without altering the service data content.

[0062] Specifically, if the target sub-application is opened indirectly through the main application, the initialized common data is passed through the bridged data storage to the state manager of the target sub-application. The main application's store will be synchronized to the state manager of the target sub-application to achieve application data bridging.

[0063] Optionally, if the enabling method is direct enabling, the target sub-application is controlled to send a remote data acquisition request to the main application, so that the main application can synchronize the initialized public data to the state manager of the target sub-application through the data interface, thereby realizing application data bridging.

[0064] Understandably, the above solution provides a method for determining the application data bridging between the main application and the target sub-application based on the way the target sub-application is enabled, thereby improving the flexibility of application data bridging.

[0065] S270. After the data bridging is completed, if the target sub-application has a need to modify public data, the public data stored in the state manager of the main application is modified through the target sub-application based on the public data passed through to the target sub-application.

[0066] Specifically, after the data bridging is completed, if the target sub-application has a need to modify common data, then the store object passed down is determined based on the common data passed to the target sub-application stored in the target sub-application's state manager, and the target sub-application modifies the common data stored in the main application's state manager based on the store object.

[0067] The technical solution of this embodiment, in response to a trigger request to load the target sub-application, loads the application resources and core package of the main application, while simultaneously loading the application resources of candidate sub-applications; through the candidate resource entry point of the main application, it reads and parses the static resources of the target sub-application, obtains the parsed text corresponding to the static resources, and inserts the parsed text into the header of the main application, so as to load static resources while loading the application resources of the main application; based on the static resources, the loading data of the application resources of the main application, the loading data of the application core package of the main application, and the loading data of the application resources of the candidate sub-applications, it determines resource cache data; based on the resource cache data and the runtime cache information of the target sub-application, it loads the target sub-application and loads it in the target application. After the target application is loaded, the common data of the main application and the target application is stored in the state manager of the main application, and the common data is initialized. Based on the trigger request of the target application, the opening method of the target application is determined; the opening method includes direct opening and indirect opening through the main application. If the opening method is indirect opening through the main application, the initialized common data is passed through the bridging data storage to the state manager of the target application to achieve application data bridging. After data bridging is completed, if the target application has a need to modify the common data, the common data stored in the state manager of the main application is modified through the target application based on the common data passed through to the target application. This scheme, by recording the common data of the main application and the target application in the state manager of the main application, avoids secondary loading of the common data when loading the target application, thereby further improving the loading efficiency of the target application. Meanwhile, it provides a complete data bridging method, which can connect the data relationship between the main application and the target sub-application, so that the target sub-application can run on the basis of the main application or run independently of the main application, and can modify the common data in the state manager of the main application, thereby improving the running flexibility of the target sub-application.

[0068] Example 3

[0069] Figure 3 This is a flowchart of a sub-application running method based on a micro-frontend architecture provided in Embodiment 3 of the present invention. This embodiment optimizes the above embodiments and provides a preferred implementation scheme for determining resource cache data based on static resources, the loading data of the main application's application resources, the application core package of the main application, and the loading data of the application resources of candidate sub-applications. Specifically, as shown... Figure 3 As shown, the method includes:

[0070] S310. In response to the trigger request to load the target sub-application, load the application resources and application core package of the main application, and at the same time load the application resources of the candidate sub-application when idle.

[0071] S320. Through the candidate resource entry of the main application, read and parse the static resources of the target sub-application, obtain the parsed text corresponding to the static resources, and insert the parsed text into the header of the main application, so as to load the static resources at the same time as loading the application resources of the main application.

[0072] S330. Identify duplicate plugins for the main application and the target sub-application from the application core package of the main application.

[0073] Duplicate plugins refer to the same plugins that the main application and the target sub-application depend on.

[0074] It should be noted that since both the main application and the target sub-application are independent applications, when the main application and the target sub-application are developed under the same micro-frontend framework, the same code will be loaded twice during packaging and release, which means that duplicate plugins will be loaded twice, resulting in a waste of resources.

[0075] S340. Package and release duplicate plugins to the content delivery network, and add linkers to the header of the main application and the header of the target sub-application respectively.

[0076] Among them, the Content Delivery Network (CDN) can avoid bottlenecks and links on the Internet that may affect the speed and stability of data transmission, making content transmission faster and more stable.

[0077] Specifically, you can use webpack's externals feature to remove duplicate plugins when loading the target sub-application, then bundle the duplicate plugins separately using rollup and distribute them to the content delivery network, adding linkers to the headers of both the main application and the target sub-application. Webpack is a code compilation tool.

[0078] S350. Based on static resources, the loading data of the main application's application resources, the loading data of the candidate sub-applications' application resources, and the duplicate plugins introduced by the linker from the content delivery network, determine the resource cache data.

[0079] Specifically, static resources, application resource loading data of the main application, application resource loading data of candidate sub-applications, and packaged duplicate plugins introduced by the linker from the content delivery network are stored as resource cache data in the resource storage disk cache.

[0080] S360: Load the target sub-application based on the resource cache data and the runtime cache information of the target sub-application, and after the target sub-application is loaded, bridge the application data between the main application and the target sub-application.

[0081] For example, a method for loading a target sub-application based on resource cache data and runtime cache information of the target sub-application may be as follows: while loading the target sub-application based on resource cache data and runtime cache information of the target sub-application, determine whether there is a duplicate plugin cached in the resource cache data; if so, select the target cache resource of the target sub-application based on the resource cache data, and load the target sub-application based on the target cache resource; if not, send a remote data acquisition request to the main application to obtain the duplicate plugin fed back by the main application based on the remote data acquisition request, select the target cache resource of the target sub-application from the resource cache data, and load the target sub-application based on the duplicate plugin and the target cache resource.

[0082] The above solution further improves the loading efficiency of the target sub-application.

[0083] The technical solution of this embodiment, in response to a trigger request to load a target sub-application, loads the application resources and core package of the main application, while simultaneously loading the application resources of candidate sub-applications. Through the candidate resource entry point of the main application, it reads and parses the static resources of the target sub-application, obtains the parsed text corresponding to the static resources, and inserts the parsed text into the header of the main application, so that static resources are loaded simultaneously with the application resources of the main application. It identifies duplicate plugins between the main application and the target sub-application from the application core package of the main application. These duplicate plugins are packaged and released to the content delivery network, and linkers are added to the headers of both the main application and the target sub-application. Based on the static resources, the loading data of the application resources of the main application, the loading data of the application resources of the candidate sub-applications, and the duplicate plugins introduced by the linkers from the content delivery network, resource cache data is determined. The target sub-application is loaded based on the resource cache data and the runtime cache information of the target sub-application, and application data bridging is performed between the main application and the target sub-application after the target sub-application is loaded. This solution solves the problem of dependency overlap when loading the main application and the target sub-application, which leads to a large project size and wasted resources. This avoids the need for reloading duplicate plugins, saves system resources, and improves the loading efficiency of target sub-applications.

[0084] Example 4

[0085] Figure 4 This is a schematic diagram of a sub-application running device based on a micro-frontend architecture, provided in Embodiment 4 of the present invention. This embodiment is applicable to situations where the running of sub-applications based on a micro-frontend architecture is managed. Figure 4 As shown, the sub-application running device based on the micro-frontend architecture includes: an application resource loading module 410, a static resource parsing module 420, a resource cache data determination module 430, and an application data bridging module 440.

[0086] The application resource loading module 410 is used to load the application resources of the main application and the application core package of the main application in response to the trigger request to load the target sub-application, and at the same time load the application resources of the candidate sub-application when idle.

[0087] The static resource parsing module 420 is used to read and parse the static resources of the target sub-application through the candidate resource entry of the main application, obtain the parsing text corresponding to the static resources, and insert the parsing text into the header of the main application so as to load the static resources at the same time as loading the application resources of the main application.

[0088] The resource cache data determination module 430 is used to determine resource cache data based on static resources, the loading data of application resources of the main application, the application core package of the main application, and the loading data of application resources of candidate sub-applications.

[0089] The application data bridging module 440 is used to load the target sub-application based on the resource cache data and the runtime cache information of the target sub-application, and to perform application data bridging between the main application and the target sub-application after the target sub-application is loaded.

[0090] The technical solution provided in this embodiment, in response to a trigger request to load a target sub-application, loads the application resources and core package of the main application, while simultaneously loading the application resources of candidate sub-applications. Through the candidate resource entry point of the main application, it reads and parses the static resources of the target sub-application, obtains the parsed text corresponding to the static resources, and inserts the parsed text into the header of the main application, so that static resources are loaded simultaneously with the application resources of the main application. Based on the loading data of the static resources, the application resources of the main application, the application core package of the main application, and the application resources of the candidate sub-applications, resource cache data is determined. The target sub-application is loaded based on the resource cache data and the runtime cache information of the target sub-application, and after the target sub-application is loaded, application data bridging is performed between the main application and the target sub-application. This solution solves the problem of low response efficiency caused by the significant time consumption and high system memory and CPU usage when launching sub-applications of B-end projects through the base project. It improves the loading speed of the target sub-application, thereby improving the running efficiency of sub-applications based on the micro-frontend architecture, reducing the CPU workload on system memory during sub-application operation, and improving the user experience.

[0091] For example, the application data bridging module 440 includes:

[0092] The common data initialization unit is used to store the common data of the main application and the target sub-application in the state manager of the main application and to initialize the common data.

[0093] The activation method determination unit is used to determine the activation method of the target sub-application based on the trigger request of the target sub-application; the activation method includes direct activation and indirect activation through the main application;

[0094] The public data pass-through unit is used to pass-through the initialized public data to the state manager of the target sub-application through the bridged data storage if the opening method is to be indirectly opened through the main application, so as to realize application data bridging.

[0095] The public data modification unit is used to modify the public data stored in the state manager of the main application by means of the public data passed to the target sub-application after the data bridging is completed, if the target sub-application has a public data modification requirement.

[0096] For example, the application data bridging module 440 further includes:

[0097] The public data synchronization unit, if the enabling mode is direct, controls the target sub-application to send a remote data acquisition request to the main application, so that the main application can synchronize the initialized public data to the state manager of the target sub-application through the data interface, thereby realizing application data bridging.

[0098] For example, the resource cache data determination module 430 includes:

[0099] The duplicate plugin identification unit is used to identify duplicate plugins of the main application and the target sub-application from the application core package of the main application.

[0100] The duplicate plugin release unit is used to package and release duplicate plugins to the content delivery network, and add linkers to the header of the main application and the header of the target sub-application respectively.

[0101] Based on static resources, the loading data of the main application's application resources, the loading data of the candidate sub-applications' application resources, and the duplicate plugins introduced by the linker from the content delivery network, the resource cache data is determined.

[0102] For example, the application data bridging module 440 is specifically used for:

[0103] While loading the target sub-application based on the resource cache data and the runtime cache information of the target sub-application, determine whether there are duplicate plugins cached in the resource cache data;

[0104] If so, select the target cache resource of the target sub-application based on the resource cache data, and load the target sub-application based on the target cache resource;

[0105] If not, a remote data retrieval request is sent to the main application to obtain the duplicate plugins returned by the main application based on the remote data retrieval request, and the target cache resource of the target sub-application is selected from the resource cache data. The target sub-application is then loaded based on the duplicate plugins and the target cache resource.

[0106] For example, the static resource parsing module 420 is specifically used for:

[0107] After the main application's application resources are loaded, the main application is run, and the main application verifies the user's permissions based on the user's login information. Based on the verification result, it is determined whether the user has the application permissions for the target sub-application.

[0108] If so, the target resource entry corresponding to the target sub-application is determined from the candidate resource entry of the main application, and the static resources of the target sub-application are read and parsed through the target resource entry to obtain the parsed text corresponding to the static resources.

[0109] The sub-application running device based on the micro-frontend architecture provided in this embodiment can be applied to the sub-application running method based on the micro-frontend architecture provided in any of the above embodiments, and has corresponding functions and beneficial effects.

[0110] Example 5

[0111] Figure 5 A schematic diagram of an electronic device 10 that can be used to implement embodiments of the present invention is shown. The electronic device is intended to represent various forms of digital computers, such as laptop computers, desktop computers, workstations, personal digital assistants, servers, blade servers, mainframe computers, and other suitable computers. The electronic device can also represent various forms of mobile devices, such as personal digital processors, cellular phones, smartphones, wearable devices (e.g., helmets, glasses, watches, etc.), and other similar computing devices. The components shown herein, their connections and relationships, and their functions are merely illustrative and are not intended to limit the implementation of the invention described and / or claimed herein.

[0112] like Figure 5As shown, the electronic device 10 includes at least one processor 11 and a memory, such as a read-only memory (ROM) 12 or a random access memory (RAM) 13, communicatively connected to the at least one processor 11. The memory stores computer programs executable by the at least one processor. The processor 11 can perform various appropriate actions and processes based on the computer program stored in the ROM 12 or loaded from storage unit 18 into the RAM 13. The RAM 13 may also store various programs and data required for the operation of the electronic device 10. The processor 11, ROM 12, and RAM 13 are interconnected via a bus 14. An input / output (I / O) interface 15 is also connected to the bus 14.

[0113] Multiple components in electronic device 10 are connected to I / O interface 15, including: input unit 16, such as keyboard, mouse, etc.; output unit 17, such as various types of displays, speakers, etc.; storage unit 18, such as disk, optical disk, etc.; and communication unit 19, such as network card, modem, wireless transceiver, etc. Communication unit 19 allows electronic device 10 to exchange information / data with other devices through computer networks such as the Internet and / or various telecommunications networks.

[0114] Processor 11 can be a variety of general-purpose and / or special-purpose processing components with processing and computing capabilities. Some examples of processor 11 include, but are not limited to, a central processing unit (CPU), a graphics processing unit (GPU), various special-purpose artificial intelligence (AI) computing chips, various processors running machine learning model algorithms, a digital signal processor (DSP), and any suitable processor, controller, microcontroller, etc. Processor 11 performs the various methods and processes described above, such as the sub-application execution method based on a micro-frontend architecture.

[0115] In some embodiments, the micro-frontend-based sub-application execution method can be implemented as a computer program tangibly contained in a computer-readable storage medium, such as storage unit 18. In some embodiments, part or all of the computer program can be loaded and / or installed on electronic device 10 via ROM 12 and / or communication unit 19. When the computer program is loaded into RAM 13 and executed by processor 11, one or more steps of the micro-frontend-based sub-application execution method described above can be performed. Alternatively, in other embodiments, processor 11 can be configured to execute the micro-frontend-based sub-application execution method by any other suitable means (e.g., by means of firmware).

[0116] Various embodiments of the systems and techniques described above herein can be implemented in digital electronic circuit systems, integrated circuit systems, field-programmable gate arrays (FPGAs), application-specific integrated circuits (ASICs), application-specific standard products (ASSPs), systems-on-a-chip (SoCs), payload-programmable logic devices (CPLDs), computer hardware, firmware, software, and / or combinations thereof. These various embodiments may include implementations in one or more computer programs that can be executed and / or interpreted on a programmable system including at least one programmable processor, which may be a dedicated or general-purpose programmable processor, capable of receiving data and instructions from a storage system, at least one input device, and at least one output device, and transmitting data and instructions to the storage system, the at least one input device, and the at least one output device.

[0117] Computer programs used to implement the methods of the present invention may be written in any combination of one or more programming languages. These computer programs may be provided to a processor of a general-purpose computer, a special-purpose computer, or other programmable data processing device, such that when executed by the processor, the computer programs cause the functions / operations specified in the flowcharts and / or block diagrams to be performed. The computer programs may be executed entirely on a machine, partially on a machine, or as a standalone software package, partially on a machine and partially on a remote machine, or entirely on a remote machine or server.

[0118] In the context of this invention, a computer-readable storage medium can be a tangible medium that may contain or store a computer program for use by or in conjunction with an instruction execution system, apparatus, or device. A computer-readable storage medium may include, but is not limited to, electronic, magnetic, optical, electromagnetic, infrared, or semiconductor systems, apparatus, or devices, or any suitable combination thereof. Alternatively, a computer-readable storage medium may be a machine-readable signal medium. More specific examples of machine-readable storage media include electrical connections based on one or more wires, portable computer disks, hard disks, random access memory (RAM), read-only memory (ROM), erasable programmable read-only memory (EPROM or flash memory), optical fibers, portable compact disk read-only memory (CD-ROM), optical storage devices, magnetic storage devices, or any suitable combination thereof.

[0119] To provide interaction with a user, the systems and techniques described herein can be implemented on an electronic device having: a display device (e.g., a CRT (cathode ray tube) or LCD (liquid crystal display) monitor) for displaying information to the user; and a keyboard and pointing device (e.g., a mouse or trackball) through which the user provides input to the electronic device. Other types of devices can also be used to provide interaction with the user; for example, feedback provided to the user can be any form of sensory feedback (e.g., visual feedback, auditory feedback, or tactile feedback); and input from the user can be received in any form (including sound input, voice input, or tactile input).

[0120] The systems and technologies described herein can be implemented in computing systems that include backend components (e.g., as data servers), or computing systems that include middleware components (e.g., application servers), or computing systems that include frontend components (e.g., user computers with graphical user interfaces or web browsers through which users can interact with implementations of the systems and technologies described herein), or any combination of such backend, middleware, or frontend components. The components of the system can be interconnected via digital data communication of any form or medium (e.g., communication networks). Examples of communication networks include local area networks (LANs), wide area networks (WANs), blockchain networks, and the Internet.

[0121] A computing system can include clients and servers. Clients and servers are generally located far apart and typically interact through communication networks. The client-server relationship is created by computer programs running on the respective computers and having a client-server relationship with each other. The server can be a cloud server, also known as a cloud computing server or cloud host, which is a hosting product within the cloud computing service system to address the shortcomings of traditional physical hosts and VPS services, such as high management difficulty and weak business scalability.

[0122] It should be understood that the various forms of processes shown above can be used, with steps reordered, added, or deleted. For example, the steps described in this invention can be executed in parallel, sequentially, or in different orders, as long as the desired result of the technical solution of this invention can be achieved, and this is not limited herein.

[0123] The specific embodiments described above do not constitute a limitation on the scope of protection of this invention. Those skilled in the art should understand that various modifications, combinations, sub-combinations, and substitutions can be made according to design requirements and other factors. Any modifications, equivalent substitutions, and improvements made within the spirit and principles of this invention should be included within the scope of protection of this invention.

Claims

1. A method for running a sub-application based on a micro-frontend architecture, characterized in that, The application comprises the following steps: In response to a trigger request for loading a target sub-application, loading the application resources of the main application and the application core package of the main application, and idly loading the application resources of the candidate sub-application; Through the candidate resource entry of the main application, reading and parsing the static resources of the target sub-application, obtaining the parsed text corresponding to the static resources, and inserting the parsed text into the header of the main application, so as to load the static resources while loading the application resources of the main application; According to the static resources, the loading data of the application resources of the main application, the application core package of the main application and the loading data of the application resources of the candidate sub-application, determining the resource cache data; According to the resource cache data and the running cache information of the target sub-application, loading the target sub-application, and performing application data bridging on the main application and the target sub-application after the target sub-application is loaded; According to the static resources, the loading data of the application resources of the main application, the application core package of the main application and the loading data of the application resources of the candidate sub-application, determining the resource cache data, comprising: Identifying the repeated plug-ins of the main application and the target sub-application from the application core package of the main application, wherein the repeated plug-ins refer to the same plug-ins relied on by the main application and the target sub-application; Packing and publishing the repeated plug-ins to the content distribution network (CDN), and adding linkers to the headers of the main application and the target sub-application respectively, so as to introduce the repeated plug-ins through the content distribution network (CDN); Based on the static resources, the loading data of the application resources of the main application, the loading data of the application resources of the candidate sub-application, and the repeated plug-ins introduced from the content distribution network (CDN) through the linkers, determining the final resource cache data.

2. The method of claim 1, wherein, Performing application data bridging on the main application and the target sub-application, comprising: Storing the common data of the main application and the target sub-application in the state manager of the main application, and initializing the common data; According to the trigger request of the target sub-application, determining the opening mode of the target sub-application; the opening mode includes direct opening and indirect opening through the main application; If the opening mode is indirect opening through the main application, the initialized common data is transmitted to the state manager of the target sub-application through the bridging data storage, so as to realize application data bridging; After data bridging is completed, if the target sub-application has common data modification requirements, according to the common data transmitted to the target sub-application, the common data stored in the state manager of the main application is changed through the target sub-application.

3. The method of claim 2, wherein, After determining the opening mode of the target sub-application according to the trigger request of the target sub-application, it further comprises: If the opening mode is direct opening, the target sub-application sends a remote data acquisition request to the main application, so that the main application synchronizes the initialized common data to the state manager of the target sub-application through a data interface, so as to realize application data bridging.

4. The method of claim 1, wherein, loading the target sub-application according to the resource cache data and running cache information of the target sub-application, comprising: determining whether the repeated plug-in is cached in the resource cache data while loading the target sub-application according to the resource cache data and running cache information of the target sub-application; if yes, selecting a target cache resource of the target sub-application according to the resource cache data, and loading the target sub-application according to the target cache resource; if no, sending a remote data acquisition request to the main application to acquire the repeated plug-in fed back by the main application based on the remote data acquisition request, selecting a target cache resource of the target sub-application from the resource cache data, and loading the target sub-application according to the repeated plug-in and the target cache resource.

5. The method of claim 1, wherein, reading and parsing static resources of the target sub-application through a candidate resource entry of the main application, and acquiring parsed text corresponding to the static resources, comprising: running the main application after the application resources of the main application are loaded, verifying user authority according to user login information through the main application, and determining whether the user has application authority of the target sub-application according to a verification result; if yes, determining a target resource entry corresponding to the target sub-application from the candidate resource entry of the main application, and reading and parsing static resources of the target sub-application through the target resource entry to acquire parsed text corresponding to the static resources.

6. A sub-application running apparatus based on a micro-frontend architecture, characterized by, comprising: an application resource loading module, configured to load application resources of a main application and an application core package of the main application in response to a trigger request of loading a target sub-application, and load application resources of a candidate sub-application in an idle mode; a static resource parsing module, configured to read and parse static resources of the target sub-application through a candidate resource entry of the main application, acquire parsed text corresponding to the static resources, and insert the parsed text into a header of the main application, so as to load the static resources while loading the application resources of the main application; a resource cache data determination module, configured to determine resource cache data according to the static resources, loading data of the application resources of the main application, the application core package of the main application, and loading data of the application resources of the candidate sub-application; an application data bridging module, configured to load the target sub-application according to the resource cache data and running cache information of the target sub-application, and perform application data bridging between the main application and the target sub-application after the target sub-application is loaded; the resource cache data determination module comprises: a repeated plug-in determination unit, configured to identify a repeated plug-in of the main application and the target sub-application from an application core package of the main application, wherein the repeated plug-in refers to the same plug-in relied on by the main application and the target sub-application; a repeated plug-in publishing unit, configured to package and publish the repeated plug-in to a content distribution network (CDN), and add a linker to a header of the main application and a header of the target sub-application respectively, so as to introduce the repeated plug-in through the CDN. Determine final resource cache data based on the static resource, the application resource loading data of the main application, the application resource loading data of the candidate sub-application, and the repeated plug-in introduced from a content distribution network (CDN) through the linker.

7. The apparatus of claim 6, wherein, The application data bridging module further includes: A common data initialization unit configured to store common data of the main application and the target sub-application in a state manager of the main application, and initialize the common data; An opening mode determination unit configured to determine an opening mode of the target sub-application according to a trigger request of the target sub-application, the opening mode including direct opening and indirect opening through the main application; A common data transparent transmission unit configured to, if the opening mode is indirect opening through the main application, transparently transmit the initialized common data to a state manager of the target sub-application through a bridging data storage to realize application data bridging; A common data modification unit configured to, after the data bridging is completed, if the target sub-application has a common data modification requirement, modify the common data stored in the state manager of the main application through the target sub-application according to the common data transparently transmitted to the target sub-application.

8. An electronic device, comprising: The electronic device includes: at least one processor; and a memory connected with the at least one processor in communication; wherein The memory stores a computer program executable by the at least one processor, and the computer program is executed by the at least one processor to enable the at least one processor to execute the sub-application running method based on the micro-frontend architecture according to any one of claims 1-5.

9. A computer-readable storage medium, characterized in that, The computer readable storage medium stores computer instructions for enabling the processor to execute the sub-application running method based on the micro-frontend architecture according to any one of claims 1-5 when executed.

Images