top of page
Search
Kimshuka Blogs

MicroFrontend Architecture

Let us try to understand what Monolithic Architecture is first. with the help of E-

commerce application. In the earlier days when an application (consisting of many services) is designed and developed, all the business requirements were used to be in the same single application in one place(bundle) which was tightly coupled. The problem with this approach was as the business requirement grows architecture looked more complex, hence started consuming more time for development, and more dependency, so more time for system enhancement and system maintenance there by the reduced application agility.






Considering these problems in front-end, Microfrontend Architecture was proposed

MicroFrontend is an architecture where a complete application(front-end) is divided into

small and individual modules which are restricted to particular services and independently deployable modules and each benefit of these applications has an entry

point to be integrated by the aggregator application






Considering (Fig-1 and Fig-2),


We can understand that the E-commerce app had multiple services which were closely associated and are now made as separate services (User Profile, Cart, and so on). Hence by reducing the development dependencies, now the individual team can take up the changes/business requirements easily without waiting for the other services to get over and deployed thus increasing the speed of the application delivery. The other main advantage is these services can be independently developed in different languages and even can make use of different frameworks. Later they are integrated with the aggregator application manually or through some automated framework services. From where users can make use of each service effortlessly



These services can be integrated into the aggregator application at the time of request at

the server or compile time or run time

That is

1. Each service is hosted in separate servers are served based on the user request,

when the request is received, the aggregator calls the associated service, for example

when the user is trying to log in, the Aggregator calls the Auth service.

2. At the compilation Time, in this type aggregator application will be having

access to the service code, and the aggregator will be having reference to this as

a dependency in the dependency list but changes are to be redeployed if any this case

3. At the run time the integrator application has access to the code of the

integrated applications while running on the browser. Any changes do not need

the application to be redeployed, as the code of each service is dynamically

loaded. There are different implementations for this type of integration using

Iframes or scripts or using Webpack Module.

Considering all these we can conclude the Microfrontend features as

  • Independent Development and Deployment as services.

  • Flexibility in technology adaption.

  • Secured applications as services are separated from one another.

  • Easy adaption of new improvisations or requirements.

  • Minimal failure of the entire application as it is encapsulated and Isolated.

  • Ease of Maintenance.

  • Easy to fix as it is independent.

As it provides more benefits, a few things are to be considered when going for Microfrontend

  • Proper communication between the teams as they are independent.

  • Proper design strategies.

  • Implementation of proper test scenarios, versions, and other strategies.

53 views0 comments

Comments


bottom of page