Understanding of MVVM and MVC development patterns

1、MVVM

MVVM was first proposed by Microsoft. It draws on the MVC idea of ​​desktop applications. In the front-end page, the Model is represented by a pure JavaScript object, and the View is responsible for the display. The two are separated to the maximum extent, and the Model and View are associated. It is the ViewModel.
ViewModel is responsible for synchronizing the data of the Model to the View for display, and is also responsible for synchronizing the modification of the View back to the Model. The synchronization between the View and the Model is completely automatic without human intervention (completed by the viewModel). Therefore, developers only need to pay attention to business logic, do not need to manually operate DOM, and do not need to pay attention to the synchronization of data status. Complex data status maintenance is completely managed by MVVM.

2、MVC

MVC includes model data layer, view view layer, and controller control layer. Communication between parts is unidirectional.
Model, that is, the data model, is responsible for data-related tasks, including adding, deleting, modifying and checking data.
view, that is, the view layer, that is, the interface that users can see.
Controller, that is, the controller, is responsible for listening to user events, and then calls model and view to update data and views.

3. The difference between MVVM and MVC

1. Controller in mvc evolves into viewModel in mvvm.
2. Mvvm uses data to drive the display of the view layer rather than node operations.
3. The Model and View in mvc can directly deal with each other, resulting in a high degree of coupling between the Model layer and the View layer. In mvvm, the Model and View do not interact directly, but are synchronized through the intermediate bridge ViewModel.
4. mvvm mainly solves the problem that a large number of DOM operations in mvc reduce page rendering performance, slow down loading speed, and affect user experience.