A New Integration Approach to support the Development of Build-time Micro Frontend Architecture Applications
Resumo
The Micro Frontend Architecture (MFA) is an innovative, scalable, and flexible architectural model supporting frontend software development. Despite the advantages of this architectural model, technologies that depend on packaging applications in compile time benefit from MFA using a build-time approach by splitting Micro Frontend Applications (MFApps) in packages, which makes this application incapable of performing a runtime interpretation of other MFApps. This paper introduces a new integration approach to support the development of build-time MFApps to overcome limitations related to the coupling of these applications. The proposed approach employs the concept of remote component rendering and the Backend for Frontend pattern to solve continuous delivery issues, provide runtime integration, and help teams scale their development process of MFApps. As a result, we observed that our integration approach enables the developers to work with MFA in a build-time approach as a runtime integration of MFApps.
Palavras-chave:
Micro Frontend, Integration Approach, Build-time
Referências
Amr S. Abdelfattah and Tomás Cerný. 2023. Filling The Gaps in Microservice Frontend Communication: Case for New Frontend Patterns. In Proceedings of the 13th International Conference on Cloud Computing and Services Science, CLOSER 2023, Prague, Czech Republic, April 26-28, 2023, Maarten van Steen and Claus Pahl (Eds.). SCITEPRESS, Prague, Czech Republic, 184–193. DOI: 10.5220/0011812500003488
Markus Ast and Martin Gaedke. 2017. Self-contained web components through serverless computing. In Proceedings of the 2nd International Workshop on Serverless Computing (Las Vegas, Nevada) (WoSC ’17). Association for Computing Machinery, New York, NY, USA, 28–33. DOI: 10.1145/3154847.3154849
Yan Bian, Dechao Ma, Qing Zou, and Weirui Yue. 2022. A Multi-way Access Portal Website Construction Scheme. In The 5th International Conference on Artificial Intelligence and Big Data, ICAIBD 2022. Institute of Electrical and Electronics Engineers Inc., Chengdu, China, 589 – 592. DOI: 10.1109/ICAIBD55127.2022.9820236
Fabian Bühler, Johanna Barzen, Lukas Harzenetter, Frank Leymann, and Philipp Wundrack. 2022. Combining the Best of Two Worlds: Microservices and Micro Frontends as Basis for a New Plugin Architecture. Communications in Computer and Information Science 1603 CCIS (2022), 3 – 23. DOI: 10.1007/978-3-031-18304-1_1
Frameworkless. 2024. Frameworkless movement. on-line. Avaliable: [link], acessed on July 26, 2024.
E. Garcia-Lopez, A. Garcia-Cabot, A. Castillo-Martinez, A. Gutierrez-Escolar, J.A. Medina, J.M. Gutierrez-Martinez, , and J.J. Martinez-Herraiz. 2014. Mobile Usability: An Experiment to Check Whether Current Mobile Devices are Ready to Support Frames and iFrames. In Information Systems Development: Transforming Organisations and Society through Information Systems (ISD2014 Proceedings), V. Strahonja, N. Vrček., D. Plantak Vukovac, C. Barry, M. Lang, H. Linger, and C. Schneider (Eds.). Information Systems Development: Transforming Organisations and Society through Information Systems (ISD2014 Proceedings), Varaždin, Croatia: Faculty of Organization and Informatics, 234–241.
Michael Geers. 2020. Micro frontends in action. Manning Publications, New York, NY.
Cam Jackson. 2019. Micro Frontends. on-line. Avaliable: [link], acessed on July 26, 2024.
Sarath KCM. 2024. react-native-remote-components. on-line. Avaliable: [link], acessed on July 26, 2024.
Microsoft. 2024. Visual Studio App Center documentation. on-line. Avaliable: [link], acessed on July 26, 2024.
Fernando Rodrigues Moraes, Gabriel Nagassaki Campos, Nathalia Rodrigues Almeida, and Frank José Affonso. 2024. Micro frontend-based Development: Concepts, Motivations, Implementation Principles, and an Experience Report. In Proceedings of the 26th International Conference on Enterprise Information Systems. INSTICC, SciTePress, Angers, France, 175–184. DOI: 10.5220/0012627300003690
Sam Newman. 2015. Pattern: Backends For Frontends. on-line. Avaliable: [link], acessed on July 26, 2024.
Andrey Pavlenko, Nursultan Askarbekuly, Swati Megha, and Manuel Mazzara. 2020. Micro-frontends: Application of microservices to web front-ends. Journal of Internet Services and Information Security 10, 2 (2020), 49 – 66. DOI: 10.22667/JISIS.2020.05.31.049
Severi Peltonen, Luca Mezzalira, and Davide Taibi. 2021. Motivations, benefits, and issues for adopting Micro-Frontends: A Multivocal Literature Review. Information and Software Technology 136 (2021), 106571. DOI: 10.1016/j. infsof.2021.106571
PUB.DEV. 2024. Remote Flutter Widgets. on-line. Avaliable: [link], acessed on July 26, 2024, version rfw: 1.0.26.
Chris Richardson. 2024. Variation: Backends for frontends. on-line. Avaliable: [link], acessed on July 26, 2024.
Emilija Stefanovska and Vladimir Trajkovik. 2022. Evaluating Micro Frontend Approaches for Code Reusability. Communications in Computer and Information Science 1740 CCIS (2022), 93 – 106. DOI: 10.1007/978-3-031-22792-9_8
Guangliang Yang, Jeff Huang, and Guofei Gu. 2019. Iframes/Popups Are Dangerous in Mobile WebView: Studying and Mitigating Differential Context Vulnerabilities. In 28th USENIX Security Symposium (USENIX Security 19). USENIX Association, Santa Clara, CA, 977–994. [link]
Markus Ast and Martin Gaedke. 2017. Self-contained web components through serverless computing. In Proceedings of the 2nd International Workshop on Serverless Computing (Las Vegas, Nevada) (WoSC ’17). Association for Computing Machinery, New York, NY, USA, 28–33. DOI: 10.1145/3154847.3154849
Yan Bian, Dechao Ma, Qing Zou, and Weirui Yue. 2022. A Multi-way Access Portal Website Construction Scheme. In The 5th International Conference on Artificial Intelligence and Big Data, ICAIBD 2022. Institute of Electrical and Electronics Engineers Inc., Chengdu, China, 589 – 592. DOI: 10.1109/ICAIBD55127.2022.9820236
Fabian Bühler, Johanna Barzen, Lukas Harzenetter, Frank Leymann, and Philipp Wundrack. 2022. Combining the Best of Two Worlds: Microservices and Micro Frontends as Basis for a New Plugin Architecture. Communications in Computer and Information Science 1603 CCIS (2022), 3 – 23. DOI: 10.1007/978-3-031-18304-1_1
Frameworkless. 2024. Frameworkless movement. on-line. Avaliable: [link], acessed on July 26, 2024.
E. Garcia-Lopez, A. Garcia-Cabot, A. Castillo-Martinez, A. Gutierrez-Escolar, J.A. Medina, J.M. Gutierrez-Martinez, , and J.J. Martinez-Herraiz. 2014. Mobile Usability: An Experiment to Check Whether Current Mobile Devices are Ready to Support Frames and iFrames. In Information Systems Development: Transforming Organisations and Society through Information Systems (ISD2014 Proceedings), V. Strahonja, N. Vrček., D. Plantak Vukovac, C. Barry, M. Lang, H. Linger, and C. Schneider (Eds.). Information Systems Development: Transforming Organisations and Society through Information Systems (ISD2014 Proceedings), Varaždin, Croatia: Faculty of Organization and Informatics, 234–241.
Michael Geers. 2020. Micro frontends in action. Manning Publications, New York, NY.
Cam Jackson. 2019. Micro Frontends. on-line. Avaliable: [link], acessed on July 26, 2024.
Sarath KCM. 2024. react-native-remote-components. on-line. Avaliable: [link], acessed on July 26, 2024.
Microsoft. 2024. Visual Studio App Center documentation. on-line. Avaliable: [link], acessed on July 26, 2024.
Fernando Rodrigues Moraes, Gabriel Nagassaki Campos, Nathalia Rodrigues Almeida, and Frank José Affonso. 2024. Micro frontend-based Development: Concepts, Motivations, Implementation Principles, and an Experience Report. In Proceedings of the 26th International Conference on Enterprise Information Systems. INSTICC, SciTePress, Angers, France, 175–184. DOI: 10.5220/0012627300003690
Sam Newman. 2015. Pattern: Backends For Frontends. on-line. Avaliable: [link], acessed on July 26, 2024.
Andrey Pavlenko, Nursultan Askarbekuly, Swati Megha, and Manuel Mazzara. 2020. Micro-frontends: Application of microservices to web front-ends. Journal of Internet Services and Information Security 10, 2 (2020), 49 – 66. DOI: 10.22667/JISIS.2020.05.31.049
Severi Peltonen, Luca Mezzalira, and Davide Taibi. 2021. Motivations, benefits, and issues for adopting Micro-Frontends: A Multivocal Literature Review. Information and Software Technology 136 (2021), 106571. DOI: 10.1016/j. infsof.2021.106571
PUB.DEV. 2024. Remote Flutter Widgets. on-line. Avaliable: [link], acessed on July 26, 2024, version rfw: 1.0.26.
Chris Richardson. 2024. Variation: Backends for frontends. on-line. Avaliable: [link], acessed on July 26, 2024.
Emilija Stefanovska and Vladimir Trajkovik. 2022. Evaluating Micro Frontend Approaches for Code Reusability. Communications in Computer and Information Science 1740 CCIS (2022), 93 – 106. DOI: 10.1007/978-3-031-22792-9_8
Guangliang Yang, Jeff Huang, and Guofei Gu. 2019. Iframes/Popups Are Dangerous in Mobile WebView: Studying and Mitigating Differential Context Vulnerabilities. In 28th USENIX Security Symposium (USENIX Security 19). USENIX Association, Santa Clara, CA, 977–994. [link]
Publicado
30/09/2024
Como Citar
MORAES, Fernando Rodrigues de; AFFONSO, Frank José.
A New Integration Approach to support the Development of Build-time Micro Frontend Architecture Applications. In: SIMPÓSIO BRASILEIRO DE ENGENHARIA DE SOFTWARE (SBES), 38. , 2024, Curitiba/PR.
Anais [...].
Porto Alegre: Sociedade Brasileira de Computação,
2024
.
p. 637-643.
DOI: https://doi.org/10.5753/sbes.2024.3585.
