ArkJS-based lightweight front-end micro-application loading method and device

Abstract

The invention provides a lightweight front-end micro-application loading method and device based on ArkJS, and relates to the field of computers.The method comprises the steps that in the running process of a main application, a loading request for a target sub-application is obtained; the main application searches a mapping relation between different sub-application paths stored in a public dependency resource library and corresponding sub-application running resources; when it is determined that the sub-application running resources corresponding to the sub-application paths exist, the sub-application running resources are sent to the target sub-application; the target sub-application runs according to the sub-application running resources. The main application can load the needed micro-front-end application according to needs, and necessary resources are loaded only when needed, so that the initial loading time is shortened, and browser request waiting and consumed bandwidth are reduced.

Description

Technical Field

[0001] This application relates to the field of computers. Specifically, it relates to a lightweight front-end micro-application loading method and device based on ArkJS. Background Art

[0002] In existing micro-applications, a main application contains multiple functional modules, that is, one main application corresponds to multiple sub-applications; the functional code corresponding to the main framework project functions is an independent Git repository, maintained by independent developers, and the memory occupancy cannot be uniformly managed, resulting in low project R & D efficiency and poor version iteration timeliness. Summary of the Invention

[0003] The purpose of the embodiments of this application is to provide a lightweight front-end micro-application loading method and device based on ArkJS, which solves the above problems existing in the prior art and can quickly respond to user requirements.

[0004] In a first aspect, a lightweight front-end micro-application loading method based on ArkJS is provided. This method is applied to a loading system composed of a main application and at least one sub-application. The method may include:

[0005] During the operation of the main application, a loading request for a target sub-application is obtained; the loading request includes the sub-application path of the target sub-application;

[0006] The main application looks up the mapping relationship between different sub-application paths and the corresponding sub-application running resources stored in the common dependency resource library;

[0007] When it is determined that there are sub-application running resources corresponding to the sub-application path, the sub-application running resources are sent to the target sub-application;

[0008] The target sub-application runs according to the sub-application running resources.

[0009] In a possible implementation, after obtaining the loading request for the target sub-application, the method further includes:

[0010] When it is determined that there are no sub-application running resources corresponding to the sub-application path, according to the sub-application path, target sub-application running resources are obtained from the application platform, and the target sub-application running resources are sent to the target sub-application; the application platform is a platform for storing resources of each sub-application;

[0011] The target sub-application loads the target sub-application running resources, and stores the sub-application path, the target sub-application running resources, and the mapping relationship between the sub-application path and the target sub-application running resources in the common dependency resource library.

[0012] In a possible implementation, the loading of the target sub-application's running resources by the target sub-application includes:

[0013] Initializing the target instance of the target sub-application according to the target sub-application's running resources;

[0014] Mounting the target instance into the target container specified by the target sub-application's program file, so that the target sub-application's program file can load the target sub-application's running resources.

[0015] In a possible implementation, the construction of the common dependency resource library includes:

[0016] Packaging the target instance based on the general module definition specification to obtain a target component;

[0017] Publishing the target component to the content distribution memory according to the addresses of the content distribution memory of each component created in advance;

[0018] Dynamically loading the script code file in the target component through the content distribution memory, and mounting the selection object of the target component corresponding to the script code file to be registered under the global window.

[0019] In a possible implementation, a preset number of cached sub-application program files is provided in the common dependency resource library;

[0020] Before storing the sub-application path, the target sub-application's running resources, and the mapping relationship between the sub-application path and the target sub-application's running resources into the common dependency resource library, the method further includes:

[0021] If the main application detects that the number of cached sub-application program files in the common dependency resource library reaches the preset number, remove the sub-application program files that meet the preset conditions, so that the number of sub-application program files in the common dependency resource library is less than the preset number.

[0022] In a possible implementation, after storing the sub-application path, the target sub-application's running resources, and the mapping relationship between the sub-application path and the target sub-application's running resources into the common dependency resource library, the method further includes:

[0023] Marking the sub-application path, the target sub-application resources, and the mapping relationship between the sub-application path and the target sub-application resources as external dependencies.

[0024] In a possible implementation, data communication is performed between each sub-application and between each main application and its corresponding sub-application through a pre-constructed global event bus.

[0025] In a possible implementation, the sub-application path includes a protocol header, a host address, a listening port, a main application access address, a sub-application access address, a sub-application service route, and service URL parameters.

[0026] In a second aspect, a lightweight front-end micro-application loading device based on ArkJS is provided. The device is applied to a loading system composed of a main application and at least one sub-application. The device may include:

[0027] An obtaining unit, configured to, during the running of the main application, obtain a loading request for a target sub-application; the loading request includes a sub-application path of the target sub-application;

[0028] A searching unit, configured to, for the main application, search for a mapping relationship between different sub-application paths stored in a common dependency resource library and corresponding sub-application running resources;

[0029] A sending unit, configured to, when it is determined that there are sub-application running resources corresponding to the sub-application path, send the sub-application running resources to the target sub-application;

[0030] A running unit, configured to run the target sub-application according to the sub-application running resources.

[0031] In a third aspect, a device is provided, characterized in that the device includes a micro-application distribution and processing center, a communication protocol interface, a data storage center, and a message communication bus. Among them, the micro-application distribution and processing center, the communication protocol interface, and the data storage center complete data circulation with each other through the message communication bus;

[0032] The data storage center is configured to store loaded and parsed functions, as well as store execution results and page structures;

[0033] The micro-application distribution and processing center is configured to schedule programs in each task stack according to the cache policy of the data storage center.

[0034] A lightweight front-end micro-application loading method based on ArkJS provided by this application includes that during the running of the main application, a loading request for a target sub-application is obtained; the main application searches for a mapping relationship between different sub-application paths stored in a common dependency resource library and corresponding sub-application running resources; when it is determined that there are sub-application running resources corresponding to the sub-application path, the sub-application running resources are sent to the target sub-application; the target sub-application runs according to the sub-application running resources. The main application can load the required micro-front-end applications on demand, and only load the necessary resources when needed, thereby reducing the initial loading time, browser request waiting, and bandwidth consumption. Description of the Drawings

[0035] To more clearly illustrate the technical solutions of the embodiments of the present application, the following will briefly introduce the accompanying drawings required for use in the embodiments of the present application. It should be understood that the following drawings only show some embodiments of the present application and should not be regarded as limiting the scope. For those of ordinary skill in the art, without creative efforts, other relevant drawings can also be obtained based on these drawings.

[0036] Figure 1 It is a system architecture diagram of a lightweight front-end micro-application loading method applied to ArkJS provided by an embodiment of the present application;

[0037] Figure 2 It is a schematic flowchart of a lightweight front-end micro-application loading method based on ArkJS provided by an embodiment of the present application;

[0038] Figure 3 It is a schematic diagram of the process when the main application loads the sub-application provided by an embodiment of the present application;

[0039] Figure 4 It is a schematic diagram of the process when caching the sub-application program file provided by an embodiment of the present application;

[0040] Figure 5 It is a schematic diagram of data communication between the main application and the sub-application provided by an embodiment of the present application;

[0041] Figure 6 It is a schematic structural diagram of a lightweight front-end micro-application loading device based on ArkJS provided by an embodiment of the present application;

[0042] Figure 7 It is a schematic structural diagram of a device provided by an embodiment of the present application. Detailed implementation manners

[0043] The following will clearly and completely describe the technical solutions in the embodiments of the present application with reference to the accompanying drawings in the embodiments of the present application. Obviously, the described embodiments are only some embodiments of the present application, not all embodiments. Based on the embodiments of the present application, all other embodiments obtained by those of ordinary skill in the art without creative efforts belong to the scope of protection of the present application.

[0044] The lightweight front-end micro-application loading method based on ArkJS provided by the embodiments of the present application can be applied in Figure 1 the system architecture shown, as Figure 1As shown in the figure, the system may include: a server and a terminal. The server may be a physical server, or a server cluster or a distributed system composed of multiple physical servers. It may also be a cloud server that provides basic cloud computing services such as cloud services, cloud databases, cloud computing, cloud functions, cloud storage, network services, cloud communications, middleware services, domain name services, security services, Content Delivery Network (CDN), as well as big data and artificial intelligence platforms. The terminal may be a user equipment (UE) such as a mobile phone, a smart phone, a laptop computer, a digital broadcast receiver, a personal digital assistant (PDA), a tablet computer (PAD), a handheld device, a vehicle-mounted device, a wearable device, a computing device or other processing devices connected to a wireless modem, a mobile station (MS), a mobile terminal, etc. The terminal and the server may be directly or indirectly connected through wired or wireless communication methods, which are not limited in this application.

[0045] A terminal is used for relevant personnel to trigger a loading request for a target sub-application and send the loading request to the server.

[0046] A server is used for receiving the loading request and sending the loading request to the main application to execute a lightweight front-end micro-application loading method based on ArkJS provided in this application.

[0047] With the substantial improvement of the level of medical informatization, the logic and front-end interaction of medical operating systems have become increasingly complex, and the organization and development architecture have also become increasingly large. There are co-existing operating systems such as inpatient doctor stations, nurse stations, outpatient doctor stations, nurse stations, children's and maternal and child specialty stations, as well as various configuration centers and terminology management centers in the existing business. Some functions or systems were even developed a long time ago, with outdated technologies (developed with jQuery / jsp), low project R & D efficiency, a large time difference in version iteration timeliness, a high release risk coefficient, and no unified management of memory occupancy.

[0048] Therefore, this application proposes a lightweight front-end micro-application loading method based on ArkJS, which solves the above problems existing in the prior art and can quickly respond to user requirements.

[0049] The following describes the preferred embodiments of this application with reference to the accompanying drawings of the specification. It should be understood that the preferred embodiments described here are only used to illustrate and explain this application and are not used to limit this application. And without conflict, the embodiments in this application and the features in the embodiments can be combined with each other.

[0050] Figure 2Schematic flow diagram of a lightweight front - end micro - application loading method provided by an embodiment of the present application. As Figure 2 shown, the method may include:

[0051] Step S210: During the operation of the main application, obtain a loading request for the target sub - application.

[0052] Among them, the loading request includes the sub - application path of the target sub - application.

[0053] In the present application, the sub - application path is divided into seven parts, which may specifically include: protocol header, host address, listening port, main - application access address, sub - application access address, sub - application service route, and service URL parameters.

[0054] For example, the sub - application path is divided into Http: / 172.16.7.27:8080 / web - jindal / webui - inputient - ordersearch / orderCard?openMode = router

[0055] The access process of the sub - application path is as follows:

[0056] Perform DNS lookup for the accessed server to obtain the target server;

[0057] Lookup the Nginx configuration proxy directory to obtain the target proxy directory;

[0058] Enter the main - application project route BaseUrl;

[0059] Lookup / webui - inputient - ordersearch in the route table;

[0060] Trigger the Ark sub - application activation rule to load the sub - application;

[0061] Render and mount the sub - application to the secondary sub - application Vnode node.

[0062] Enter the webui - inputient - ordersearch sub - application;

[0063] Lookup the sub - application route / orderCard;

[0064] Enter the orderCard page and read the URL parameters;

[0065] Execute the URL parameters.

[0066] Step S220: The main application looks up the mapping relationship between different sub - application paths and the corresponding sub - application running resources stored in the common dependency resource library, and determines the loading method of the sub - application according to the lookup result.

[0067] Since ArkJs mainly has two modules, MasterAPP and MicroApp, which respectively refer to the specific functional applications of the main framework application (main application) and sub-businesses (sub-applications).

[0068] The framework life cycle of ArkJs includes A, the loading stage, B, the running stage, and C, the unloading stage.

[0069] Among them, A, the loading stage can specifically include:

[0070] a. The creation stage (bootstrap): In this stage, the vue instance of the micro application will be created, and usually the basic settings and configurations required for the application will be initialized.

[0071] b. The mounting stage (mount): This stage is to mount the dom on the page to the instantiated vue object.

[0072] B, the running stage can specifically include:

[0073] The update stage (update): This stage is to update the data on the page again after the first load.

[0074] C, the unloading stage (unmount) can specifically include: When the micro application is unloaded, some cleanup operations can be performed to ensure that the resources are correctly released.

[0075] Furthermore, in Ark, these life cycle hooks are usually defined in the entry file of the micro application, such as main.js or app.js. The main application specifies the entry file and mounting container of the micro application through the configuration file, and then Ark will manage the loading and unloading of the micro application according to these configurations.

[0076] Step S220 can specifically include:

[0077] To optimize the loading of the main application and sub-applications for the common dependency resource library (such as vue / vuex / vue-router), when the main application looks up the mapping relationship between the different sub-application paths stored in the common dependency resource library and the corresponding sub-application running resources, and determines that there are sub-application running resources corresponding to the sub-application path, the sub-application running resources will be sent to the target sub-application; then, the target sub-application runs according to the sub-application running resources. That is to say, if it has been loaded, it will not be loaded again, thus avoiding repeated loading and wasting resources.

[0078] When the main application determines that there is no running resource of the sub-application corresponding to the sub-application path in the public dependency resource library, it obtains the target sub-application running resource from the application platform according to the sub-application path, and sends the target sub-application running resource to the target sub-application; wherein, the application platform is the platform for storing the resources of each sub-application.

[0079] The target sub-application loads the target sub-application running resource, and stores the sub-application path, the target sub-application running resource, and the mapping relationship between the sub-application path and the target sub-application running resource into the public dependency resource library. This method can ensure the reuse of the loaded resource information in the public dependency resource library.

[0080] In some embodiments, for the use stability of the public dependency resource library, a preset number of cached sub-application program files is set. Before storing the sub-application path, the target sub-application running resource, and the mapping relationship between the sub-application path and the target sub-application running resource into the public dependency resource library, the main application detects whether the number of cached sub-application program files in the public dependency resource library reaches the preset number;

[0081] If not, it indicates that sub-application program files can continue to be stored in the public dependency resource library. It should be noted that the sub-application path, the target sub-application running resource, and the mapping relationship between the sub-application path and the target sub-application running resource can be regarded as a sub-application program file.

[0082] If it reaches, the sub-application program files that meet the preset conditions are removed to make the number of sub-application program files in the public dependency resource library less than the preset number. Among them, the preset condition can be set to the minimum usage frequency in the cycle, that is, the sub-application program file corresponding to the minimum usage frequency is removed.

[0083] For example: As shown in Figure 3 By initializing and configuring the maximum number of cached sub-applications (preset number) of Ark when the main application loads the sub-application, it is first determined whether the cache pool (public dependency resource library) is full when loading and activating the sub-application. If it is full, the least frequently used one overflows. Otherwise, the combination or application in the current active state is stored in the browser memory. If the maximum cache number is set to 3, then the least frequently used A is removed from the cache area (eliminating A), and the currently latest active one is the D project. Next, if A is accessed again, its own life cycle will be restarted. After that, when B is used again, the usage time of C is the farthest from the current time, so C is eliminated.

[0084] After that, the running stage is executed according to the framework life cycle of ArkJs, that is, the target instance of the target sub-application is initialized according to the target sub-application running resource;

[0085] Mount the target instance into the target container specified by the target sub-application file, so that the sub-application file of the target sub-application can load the running resources of the target sub-application.

[0086] Furthermore, in the build configuration of the sub-application, use the externals option to mark these core common dependencies (sub-application path, target sub-application resources, and the mapping relationship between the sub-application path and target sub-application resources) as external dependencies. In this way, during the build process of the sub-application, these dependencies will not be packaged into the output of the sub-application, but are introduced at runtime through the script tag.

[0087] Furthermore, the construction of the common dependency resource library includes:

[0088] Package the target instance based on the Universal Module Definition specification to obtain the target component;

[0089] Publish the target component to the content distribution memory according to the address of the content distribution memory of each component created in advance;

[0090] Dynamically load the script code file in the target component through the content distribution memory, and mount the selection object of the target component corresponding to the script code file that needs to be registered under the global window.

[0091] In this method, the script code in the target component can be dynamically loaded through the content distribution network, and the selection object of the target instance corresponding to the script code is mounted under the global window, which improves the speed and compatibility of mounting the target instance under the global window. And by mounting under the global window, after a global component registration is completed, all registered dynamic component configurations can be obtained, enhancing the reusability of dynamic components;

[0092] In some embodiments, as shown in Figure 4 where the master app is the main application, determine whether the main application is loaded for the first time. If so, instantiate vueRouter to obtain the router; if not, when the cache is hit, obtain the cached sub-application vnode and use the cache to instantiate the application instance. When the cache is not hit, instantiate vueRouter to obtain the router; then, instantiate the application instance, and finally render the sub-application. When caching the sub-application program file, the instance realizes application-level caching by caching the vnode; similarly, the keep-alive component can also realize component-level caching by caching the vnode.

[0093] Compared with keep-alive, the vnode cache needs to be updated during the loading and update phases of the lifecycle. In the application-level cache, we only need to actively cache the vnode of the entire instance when the sub-application is unloaded.

[0094] In some embodiments, the specific implementation process of the sub-application for destroying and recording the cache is as follows: after caching the vnode in memory, unload the original instance, and when re-entering the sub-application, the cached vnode can be used for rendering through the render function.

[0095] In some embodiments, the data communication between the main application and the corresponding sub-applications, as well as between the sub-applications in the main application, is carried out through a pre-constructed global event bus. That is to say, there are many component sharings, data coexistences, and plugin sharings among the applications, and the data within the application and the data between the applications are also distinguished. Ark has well-organized and standardized the shared data. If the business data of the non-shared subsystem needs to be synchronized and reported to notify the main application or other applications, it is transmitted and monitored through event_bus communication, combined with Figure 5 As shown, for the message communication between the main application Web-Jindal and other sub-applications webui, the data to be transmitted is manually triggered and sent by window.event_bus.

[0096] In some embodiments, it can be combined with the visual CICD operation interface of the WiNEX operation and maintenance platform. After configuration, developers only need to click the corresponding instructions to quickly deploy and operate and maintain.

[0097] Due to the complexity of the medical system, from the previous monolithic applications to the current situation where high autonomy can be achieved among various applications / systems / modules; through a lightweight front-end micro-application loading method based on ArkJS provided by this application, various application programs can be split into multiple smaller modules or microservices; so that each module is developed and operated independently, which helps the team to carry out parallel development and maintenance in different parts of the application. Further, in addition to organizational management autonomy among systems, deployment and operation and maintenance also show a distributed operation, which is integrated and taken over by the main application. The sub-applications are each deployed on independent physical servers, and then the access links are handed over to the main application for loading. Finally, the main application will present all functions completely to the user. Further, without waiting for the progress of other teams, each micro-team can iterate on new requirements of its front-end application faster, gradually upgrade the new features of the existing micro-frontend application, without having to perform a large-scale overall rewrite, helping to respond to user needs and market changes faster; at the same time, each application is independently operated and maintained. Once a problem occurs in a certain micro-application, it does not affect the stability and availability of other front-end applications, improving the fault tolerance of the entire application and reducing the risk and cost of upgrading; supporting pluggable access functions, dynamically loading and unloading micro-applications or micro-modules, and other application programs that can be plugged in as needed during construction or runtime; splitting the application program into small modules improves the maintainability and reusability of the code. And different teams can also reuse modules, reducing duplicate code development; at the same time, the main application can load the required micro-frontend applications on demand, and only load the necessary resources when needed, thus reducing the initial loading time, browser request waiting, and bandwidth consumption.

[0098] Corresponding to the above method, an embodiment of this application also provides a lightweight front-end micro-application loading device based on ArkJS, as Figure 6 shown, the device includes:

[0099] An acquisition unit 610, configured to, during the operation of the main application, acquire a loading request for a target sub-application; the loading request includes the sub-application path of the target sub-application;

[0100] A search unit 620, configured to search, by the main application, for the mapping relationship between different sub-application paths stored in the common dependency resource library and the corresponding sub-application running resources;

[0101] A sending unit 630, configured to, when it is determined that there are sub-application running resources corresponding to the sub-application path, send the sub-application running resources to the target sub-application;

[0102] A running unit 640, configured to run the target sub-application according to the sub-application running resources.

[0103] The functions of the functional units of a lightweight front-end micro-application loading device based on ArkJS provided in the above embodiments of the present application can be implemented by the above method steps. Therefore, the specific working processes and beneficial effects of each unit in a lightweight front-end micro-application loading device based on ArkJS provided in the embodiments of the present application will not be repeated here.

[0104] The embodiments of the present application also provide a device, as Figure 7 shown, including a micro-application distribution and processing center 710, a communication protocol interface 720, a data storage center 730, and a message communication bus 740. Among them, the micro-application distribution and processing center 710, the communication protocol interface 720, and the data storage center 730 complete mutual communication through the message communication bus 740.

[0105] The data storage center 730 is used to store the loaded and parsed functions, as well as store the execution results and page structures;

[0106] The micro-application distribution and processing center 710 is used to schedule the programs in each task stack according to the cache policy of the data storage center 730, and implement the following steps:

[0107] During the operation of the main application, obtain the loading request for the target sub-application; the loading request includes the sub-application path of the target sub-application;

[0108] The main application searches for the mapping relationship between different sub-application paths stored in the common dependency resource library and the corresponding sub-application running resources;

[0109] When it is determined that there are sub-application running resources corresponding to the sub-application path, send the sub-application running resources to the target sub-application;

[0110] The target sub-application runs according to the sub-application running resources.

[0111] The communication bus mentioned above can be a Peripheral Component Interconnect (PCI) bus or an Extended Industry Standard Architecture (EISA) bus, etc. This communication bus can be divided into an address bus, a data bus, a control bus, etc. For the sake of convenience of representation, only a thick line is used in the figure, but it does not mean that there is only one bus or one type of bus.

[0112] The communication interface is used for communication between the above electronic device and other devices.

[0113] The memory may include a Random Access Memory (RAM), or may also include a Non-Volatile Memory (NVM), such as at least one disk memory. Optionally, the memory may also be at least one storage device located far from the aforementioned processor.

[0114] The aforementioned processor may be a general-purpose processor, including a Central Processing Unit (CPU), a Network Processor (NP), etc.; it may 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 gate or transistor logic devices, discrete hardware components.

[0115] Since the implementation manners and beneficial effects of the components of the electronic device in the above embodiments for solving problems can be seen from Figure 2 the steps in the embodiments shown, therefore, the specific working process and beneficial effects of the electronic device provided in the embodiments of the present application will not be elaborated herein.

[0116] In another embodiment provided by the present application, a computer-readable storage medium is further provided. Instructions are stored in the computer-readable storage medium. When it runs on a computer, it causes the computer to execute any one of the above-mentioned methods for loading a lightweight front-end micro application based on ArkJS.

[0117] In another embodiment provided by the present application, a computer program product containing instructions is further provided. When it runs on a computer, it causes the computer to execute any one of the above-mentioned methods for loading a lightweight front-end micro application based on ArkJS.

[0118] Those skilled in the art should understand that the embodiments in the embodiments of the present application can be provided as a method, a system, or a computer program product. Therefore, the embodiments in the present application can take the form of a complete hardware embodiment, a complete software embodiment, or an embodiment combining software and hardware aspects. Moreover, the embodiments in the present application can take the form of a computer program product implemented on one or more computer-usable storage media (including but not limited to disk memories, CD-ROMs, optical memories, etc.) containing computer-usable program codes.

[0119] Embodiments of the present application are described with reference to the flowcharts and / or block diagrams of methods, apparatus (systems), and computer program products according to embodiments of the present application. It should be understood that each flow and / or block in the flowchart and / or block diagram, and the combination of flows and / or blocks in the flowchart and / or block diagram, can be implemented by computer program instructions. These computer program instructions can be provided to the processor of a general-purpose computer, a special-purpose computer, an embedded processor, or other programmable data processing device to generate a machine, such that the instructions executed by the processor of the computer or other programmable data processing device generate a means for implementing the functions specified in one flow Figure 1 one flow or multiple flows and / or blocks Figure 1 or a means for implementing the functions specified in multiple blocks.

[0120] These computer program instructions can also be stored in a computer-readable memory that can direct a computer or other programmable data processing device to work in a specific manner, such that the instructions stored in the computer-readable memory generate a manufactured article including an instruction means that implements the functions specified in one flow Figure 1 one flow or multiple flows and / or blocks Figure 1 or a means for implementing the functions specified in multiple blocks.

[0121] These computer program instructions can also be loaded onto a computer or other programmable data processing device, such that a series of operation steps are executed on the computer or other programmable device to generate a computer-implemented process, so that the instructions executed on the computer or other programmable device provide steps for implementing the functions specified in one flow Figure 1 one flow or multiple flows and / or blocks Figure 1 or a means for implementing the functions specified in multiple blocks.

[0122] Although the preferred embodiments in the embodiments of the present application have been described, those skilled in the art can make additional changes and modifications once they know the basic creative concepts. Therefore, the embodiments of the present application are intended to be construed as including the preferred embodiments and all changes and modifications falling within the scope of the embodiments of the present application.

[0123] Obviously, those skilled in the art can make various changes and variations to the embodiments in the embodiments of the present application without departing from the spirit and scope of the embodiments in the embodiments of the present application. Thus, if these modifications and variations of the embodiments in the embodiments of the present application fall within the scope of the embodiments of the present application and their equivalent technologies, the embodiments of the present application are also intended to include these changes and variations.

Claims

1. A lightweight front-end micro-application loading method based on ArkJS, characterized in that, The method is applied to a loading system composed of a main application and at least one sub-application. The method includes: During the running of the main application, a loading request for a target sub-application is obtained. The loading request includes the sub-application path of the target sub-application. The main application looks up the mapping relationship between different sub-application paths and the corresponding sub-application running resources stored in the common dependency resource library. When it is determined that there are sub-application running resources corresponding to the sub-application path, the sub-application running resources are sent to the target sub-application. The target sub-application runs according to the sub-application running resources.

2. The method according to claim 1, characterized in that, After obtaining the loading request for the target sub-application, the method further includes: When it is determined that there are no sub-application running resources corresponding to the sub-application path, according to the sub-application path, the target sub-application running resources are obtained from the application platform, and the target sub-application running resources are sent to the target sub-application. The application platform is a platform for storing resources of each sub-application. The target sub-application loads the target sub-application running resources, and stores the sub-application path, the target sub-application running resources, and the mapping relationship between the sub-application path and the target sub-application running resources into the common dependency resource library.

3. The method according to claim 2, characterized in that, The target sub-application loading the target sub-application running resources includes: Initializing a target instance of the target sub-application according to the target sub-application running resources. Mounting the target instance into a target container specified by the target sub-application program file, so that the target sub-application program file of the target sub-application loads the target sub-application running resources.

4. The method according to claim 3, characterized in that, The construction of the common dependency resource library includes: Packaging the target instance based on the general module definition specification to obtain a target component. According to the addresses of the content distribution memory of each component created in advance, the target component is published to the content distribution memory. Through the content distribution memory, the script code file in the target component is dynamically loaded, and the selection object of the target component corresponding to the script code file that needs to be registered is mounted under the global window.

5. The method according to claim 2, characterized in that, A preset number of cached sub-application program files are provided in the common dependency resource library. Before storing the sub-application path, the target sub-application running resources, and the mapping relationship between the sub-application path and the target sub-application running resources into the common dependency resource library, the method further includes: If the main application detects that the number of cached sub-application program files in the common dependency resource library reaches the preset number, the sub-application program files that meet the preset conditions are removed, so that the number of sub-application program files in the common dependency resource library is less than the preset number.

6. The method according to claim 5, characterized in that, After storing the sub-application path, the target sub-application running resources, and the mapping relationship between the sub-application path and the target sub-application running resources into the common dependency resource library, the method further includes: Marking the sub-application path, the target sub-application resources, and the mapping relationship between the sub-application path and the target sub-application resources as external dependencies.

7. The method according to claim 1, characterized in that, Data communication is performed between each sub-application and between each main application and its corresponding sub-application through a pre-constructed global event bus.

8. The method according to claim 1, characterized in that, The sub-application path includes a protocol header, a host address, a listening port, a main-application access address, a sub-application access address, a sub-application service route, and a service URL parameter.

9. A lightweight front-end micro-application loading device based on ArkJS, characterized in that, The device is applied to a loading system composed of a main application and at least one sub-application, and the device includes: An obtaining unit, configured to obtain a loading request for a target sub-application during the running of the main application; the loading request includes the sub-application path of the target sub-application; A searching unit, configured to search, by the main application, for a mapping relationship between different sub-application paths stored in a common dependency resource library and corresponding sub-application running resources; A sending unit, configured to send the sub-application running resources to the target sub-application when it is determined that there are sub-application running resources corresponding to the sub-application path; A running unit, configured to run the target sub-application according to the sub-application running resources.

10. A device, characterized in that, The device includes a micro-application distribution and processing center, a communication protocol interface, a data storage center, and a message communication bus. Among them, the micro-application distribution and processing center, the communication protocol interface, and the data storage center complete the data circulation among each other through the message communication bus; The data storage center is configured to store loaded and parsed functions, as well as store execution results and page structures; The micro-application distribution and processing center is configured to schedule programs in each task stack according to the cache policy of the data storage center.

Images