Evaluating the Performance of Architectural Patterns in Web Application Development

This study explores the performance and maintainability of three key architectural patterns, Model-View-Controller (MVC), Model-View-Presenter (MVP), and Model-View-ViewModel (MVVM) across frontend frameworks Angular, React, Vue.js, and Plain HTML/JS. Focusing on crucial metrics like load time, response time, and memory usage, we uncover the trade-offs between simplicity and advanced functionality. Our findings reveal that pairing MVC with Plain HTML/JS delivers the fastest load times and best memory efficiency, making it an excellent choice for simple, resource-efficient applications. However, its limitations in handling complex interactions are clear. React with MVVM stands out as the most balanced approach, offering robust performance and easy maintenance for dynamic, interactive web apps. While equipped for large-scale enterprise solutions, Angular with MVVM requires significant resources and adds complexity to maintenance. These insights emphasize the need to match architectural patterns and frontend frameworks to project needs carefully, ensuring optimal performance, scalability, and long-term sustainability.