Différence entre MVC et MVVM

MVC et MVVM sont des architectures plus populaires. Où MVC signifie Model-View-Controller et MVVM signifie Model-View-ViewModel. Tous ces architectures aident à développer des applications qui sont librement couplées, faciles à tester et à entretenir.

• Model : code qui s’occupe de la façon dont les données sont stockées
• View : code qui s’occupe de la façon dont les données sont affichées
• Controller : code qui qui s’occupe de la façon dont les données sont créées / mises à jour / supprimées
• ViewModel : code qui s’occupe à la fois de la façon dont les données sont stockées et de la façon dont elles sont affichées

L’architecture MVC

MVC est un design pattern de logiciels, introduit dans les années 1970. Cela provoque une séparation de préoccupations, ce qui signifie que le modèle et la logique du contrôleur sont séparés de l’interface utilisateur (vue). En conséquence, la maintenance et les tests de l’application deviennent simples et faciles. Le design pattern MVC divise une application en trois aspects principaux: Modèle, Vue et Contrôleur.
 

Modèle:

Le modèle représente une collection de classes qui explique la logique métier, c’est-à-dire le modèles des objets métier et le modèle de données (opérations d’accès aux données). Il définit également les règles métier pour les moyens de données comme la manière dont les données peuvent être modifiées et manipulées.
 

Vue:

La vue représente les composants de l’interface utilisateur tels que CSS, jQuery, HTML, etc. La vue affiche les données reçues du contrôleur comme résultat. Cela modifie également le(s) modèle(s) dans l’interface utilisateur.
 

Contrôleur:

La responsabilité du contrôleur est de traiter les requêtes entrantes. Il obtient l’entrée des utilisateurs via la vue, puis traite les données de l’utilisateur via le modèle, en renvoyant les résultats à la vue. Il agit normalement comme médiateur entre la vue et le modèle.

L’architecture MVVM

Le modèle MVVM prend en charge la liaison de données(data binding) bidirectionnelle entre View et ViewModel. Cela permet la propagation automatique des modifications, à l’intérieur de l’état de ViewModel vers la vue. Généralement, le ViewModel utilise le pattern observer pour informer les modifications du ViewModel au modèle.
 

 

Modèle:

Le modèle représente une collection de classes qui explique la logique métier, c’est-à-dire le modèles des objets métier et le modèle de données (opérations d’accès aux données). Il définit également les règles métier pour les moyens de données comme la manière dont les données peuvent être modifiées et manipulées.
 

Vue:

La vue représente les composants de l’interface utilisateur tels que CSS, jQuery, HTML, etc. La vue affiche les données reçues du contrôleur comme résultat. Cela modifie également le(s) modèle(s) dans l’interface utilisateur.
 

ViewModel:

Le ViewModel est responsable de l’affichage des méthodes, commandes et autres fonctions qui aident à maintenir l’état de la vue, à manipuler le modèle à la suite des actions sur la vue et à déclencher les événements dans la vue elle-même.

Conclusion

En regardant simplement leurs noms, il apparaît que la principale différence entre MVC et MVVM est qu’un contrôleur est remplacé par un ViewModel. Cette idée est fausse.

Les deux contiennent un contrôleur. En fait, chaque projet logiciel a un contrôleur, car chaque projet logiciel manipule des données.

Les deux contiennent également ViewModel, car les deux architectures nécessitent que les données soient mappées d’un Modèle à une Vue.

La principale différence entre les deux architectures réside dans la richesse et la complexité du ViewModel.

Dans un projet plus MVVM, le ViewModel est important. Il garde une trace de son propre état interne, c’est-à-dire que le client peut effectuer des manipulations de données temporaires qui ne sont pas communiquées au contrôleur. À titre d’exemple, les projets React et Angular entrent dans cette catégorie.