Open AccessA Framework for Implementing Micro Frontend Architecture
Author(s) -
Sylvester Timona Wanjala
Publication year - 2021
Publication title -
international journal of computer applications technology and research
Language(s) - English
Resource type - Journals
ISSN - 2319-8656
DOI - 10.7753/ijcatr1012.1002
Subject(s) - computer science , architecture , microservices , front and back ends , implementation , web application , simple (philosophy) , payload (computing) , computer architecture , embedded system , architecture framework , operating system , software engineering , computer network , cloud computing , art , philosophy , epistemology , network packet , visual arts
Web applications are an indispensable part of any enterprise information system. In the recent past, we have seen maturity in technologies that enable the separation of frontend and backend, with the backend adopting microservices architecture style. The front end has maintained the traditional monolithic architecture. Micro frontends have come up as a solution to the conventional monolithic frontend, which has received much attention. Still, so far, there is no straightforward approach to implementation that satisfies different practical requirements of a modern web application. This paper proposes an architectural pattern for implementing micro frontends to address challenges experienced in earlier implementations, such as inconsistent user experience, managing security, and complexity. We developed two simple web applications, one using the proposed architectural pattern, and another using the monolithic architecture and compared the performance. We used Google lighthouse to measure the performance of two applications. The landing page for the application developed using micro frontend architecture showed a higher performance score of 99 against 86 for a similar page in an application developed using the monolithic architecture. The proposed framework showed outstanding performance in handling the issues of consistent layout with a Cumulative Layout shift of 0. Breaking down the frontend with lazy loading of micro frontends improved the web application's performance, while the proposed framework reduced development complexity. However, more research is needed to provide seamless integration of micro frontends into the main application with the support of loading shared libraries in the main application; this will significantly reduce the payload size.