Design And Implementation Of Front-end Architecture MTCG Based On MVVM

With the development of Web front-end technology,the demand of users is increasing constantly,which leads to the problems of code scale expansion,difficulty in maintenance,low code reuse rate,high code repetition rate and poor code expansibility.Front-end framework is more and more worthy of the developer attention.In this paper,MVVM design patterns,combined with HTML5,JavaScript and other related front-end development technology,based on the object-oriented and modular development idea,the front-end frame MTCG based on MVVM is designed and implemented.With the modularization development as the main idea,the MVVM-based front-end framework separates the logic of different levels,reduces the coupling between modules,realizes the module integration of the code,and improves the code reusability and maintainability.The research process of the front-end framework MTCG mainly includes: Firstly,it analyzes the service requirements of the front-end frame,and analyzes the problems that may be encountered in the design and implementation of the MTCG front-end framework and the performance optimization of the framework;Secondly,based on the hierarchical thinking of MVVM and object-oriented programming,the design and implementation of each module of the front-end frame MTCG are detailed.The front-end framework MTCG is composed of three modules: model,view and view model.The functions of each module are designed in detail.The attributes and methods of each class are implemented in code,and the performance of the front-end framework is optimized.The front-end framework uses the front-end caching mechanism to reduce the number of HTTP requests,improve the rendering speed of the page,and use GZIP compression technology to improve the speed of file loading in the framework,thus improving the loading speed of the page.Finally,the MTCG framework and jQuery framework are compared and the front end framework is applied to the numerical simulation system of geology and hydrology.Through the performance testing of this framework,it can be concluded that the page load speed of the front-end framework MTCG has been greatly improved after performance optimization.MTCG front-end framework improves the code utilization of each module,which solves the problem of code organization confusion in the file,and brings forward a new solution for the design and development of front-end framework.