RESEARCH INTO MICROFRONTEND ARCHITECTURE FOR BUILDING SCALABLE WEB SYSTEMS

Abstract

Introduction. Modern web applications have evolved from simple informational
pages into complex enterprise systems. With the growth in codebase and the number of development
teams, traditional monolithic frontend architectures exhaust their potential, creating barriers to
further product development. The concept of Micro Frontends emerged as an adaptation of
microservice architecture principles to the client side of web applications.
Purpose. The aim of this article is to substantiate a methodology for designing and
implementing scalable web systems based on microfrontend architecture using Module Federation
technology, and to compare its effectiveness with traditional approaches.
Results. A comparative analysis of microfrontend integration methods was conducted: Buildtime Integration, iframe-based isolation, and Run-time Integration. The Shell-Remote architectural
pattern was selected and implemented using Module Federation technology within the Nx monorepo
environment with the Rspack bundler. A monorepo structure was developed with a clear separation
into responsibility layers (Applications, Feature Libraries, Shared UI, Data Access). A solution to the
shared state problem was implemented using native React Context API combined with the Singleton
configuration for the React framework instance. An experimental study was conducted comparing
build performance and loading metrics between the proposed architecture and traditional Webpackbased monolith.
Conclusion. The experimental study confirmed the high effectiveness of the proposed
architecture: the transition to Rspack provided a 12-fold build speed increase compared to Webpack;
applying the Lazy Loading strategy reduced the initial page bundle size by 81%; Core Web Vitals
metrics were achieved (LCP < 1 second); the use of Nx tooling reduced CI/CD testing time by 5–6
times for local changes. The obtained results confirm the practical value of the investigated approach
for building enterprise-level web systems.