¿Cuál es la diferencia entre el patrón de diseño MVC, MVP y MVVM en términos de codificación c #

202

Si buscamos en Google usando la frase "¿Cuál es la diferencia entre el patrón de diseño MVC, MVP y MVVM", entonces podemos obtener algunas URL que discuten la diferencia entre el patrón de diseño MVC MVP y MVVM teóricamente como :

MVP

Úselo en situaciones en las que el enlace a través de un contexto de datos no sea posible. Windows Forms es un ejemplo perfecto de esto. Para separar la vista del modelo, se necesita un presentador. Dado que la vista no puede vincularse directamente con el presentador, la información debe pasarse a la vista a través de una interfaz (IView).

MVVM

Úselo en situaciones donde es posible la vinculación a través de un contexto de datos. ¿Por qué? Se eliminan las diversas interfaces IView para cada vista, lo que significa menos código para mantener. Algunos ejemplos en los que es posible MVVM incluyen proyectos WPF y javascript que usan Knockout.

MVC

Úselo en situaciones donde la conexión entre la vista y el resto del programa no siempre está disponible (y no puede emplear MVVM o MVP de manera efectiva). Esto describe claramente la situación en la que una API web se separa de los datos enviados a los navegadores del cliente. ASP.NET MVC de Microsoft es una gran herramienta para administrar tales situaciones y proporciona un marco MVC muy claro


Pero no he encontrado un solo artículo que discuta la diferencia teóricamente junto con el código de muestra.

Sería realmente bueno si recibiera un artículo que discuta la diferencia entre estos 3 patrones de diseño (MVC, MVP y MVVM) junto con el código.

Me gustaría tener en mis manos el código fuente de 3 aplicaciones CRUD similares implementadas por estos tres patrones de diseño (MVC, MVP y MVVM). Para poder leer el código y entender cómo se debe escribir el código para estos tres patrones de diseño (MVC, MVP y MVVM).

Entonces, si existe algún artículo que discuta cómo el código se vería diferente para estos 3 patrones de diseño (MVC, MVP y MVVM), por favor, redirígeme a ese artículo.

Thomas
fuente
14
En TechEd 2011 hubo una presentación buena pero simple sobre estos 3 patrones. El orador hizo y mostró ejemplos sobre el mismo modelo de negocio usando C # y Visual Studio. Aquí está el video en el canal 9 MVC, MVP y MVVM: Una comparación de patrones arquitectónicos
Marco Medrano
2
Aquí está el artículo: realm.io/news/eric-maxwell-mvc-mvp-and-mvvm-on-android . Muy bien escrito y claro OMI. También tiene un repositorio Github con una rama para cada patrón.
cuddlecheek
Esto fue interesante: cirw.in/blog/time-to-move-on
Andrew

Respuestas:

100

Algunas diferencias básicas se pueden escribir en resumen:

MVC:

MVC tradicional es donde hay un

  1. Modelo: actúa como modelo para datos
  2. Ver: se ocupa de la vista para el usuario que puede ser la IU
  3. Controlador: controla la interacción entre el Modelo y la Vista, donde la vista llama al controlador para actualizar el modelo. View puede llamar a múltiples controladores si es necesario.

MVP:

Similar al MVC tradicional pero el controlador es reemplazado por el presentador. Pero el presentador, a diferencia del controlador, también es responsable de cambiar la vista. La vista generalmente no llama al presentador.

MVVM

La diferencia aquí es la presencia de View Model. Es una especie de implementación de Observer Design Pattern, donde los cambios en el modelo también están representados en la vista, por la VM. Por ejemplo: si se cambia un control deslizante, no solo se actualiza el modelo, sino que también se actualizan los datos que pueden ser un texto que se muestra en la vista. Por lo tanto, hay un enlace de datos bidireccional.

Pritam Banerjee
fuente
1
Pequeño detalle: puede elegir si es un enlace de datos bidireccional o también puede definir un enlace unidireccional.
Jviaches
10
"¿La vista generalmente no llama al presentador"? ¿Puedes explicar más sobre esta oración? si ui view no llamará al presentador, ¿quién lo hará?
Amir Ziarati
3
@AmirZiarati El presentador vigila los eventos. En caso de eventos, el presentador entra en juego y toma las acciones necesarias.
Pritam Banerjee
Sí, siempre y cuando tenga una referencia para ver. Me equivoqué, pensé que querías decir que la vista ni siquiera necesita llamar a un presentador inicialmente, aunque debería hacerlo al menos una vez. gracias;)
Amir Ziarati
1
@PritamBanerjee, a partir de la explicación, tanto MVP como MVVM tienen casi la misma funcionalidad. P o VM actualizan ambos M y V.
Manohar Reddy Poreddy
43

MVC, MVP, MVVM

MVC (uno viejo)

MVP (más modular debido a su bajo acoplamiento. Presenter es un mediador entre View y Model)

MVVM (ya tiene un enlace bidireccional entre VM y el componente de la interfaz de usuario, por lo que es más automatizado que MVP) ingrese la descripción de la imagen aquí

Otra imagen: ingrese la descripción de la imagen aquí

Uddhav Gautam
fuente
24
No solo copie imágenes, especialmente cuando no están de acuerdo entre ellas. Vea el navegador MVC (el antiguo que no ve) habla para ver en la imagen superior, pero habla con el controlador en la imagen inferior.
peter.fr
1
@UddhavGautam Es un poco confuso porque la primera imagen muestra Ver como el punto de entrada y la segunda muestra Controlador.
everlasto
1
En el primer diagrama, ¿cuál es la diferencia entre MVVM y MVP? Según lo veo, son solo los enlaces entre la V y la VM / P. Que en un caso tiene los mensajes de ida y vuelta como un enlace bidireccional y en el otro se representan como dos enlaces unidireccionales. No veo ninguna diferencia funcional entre ellos. ¿Qué me estoy perdiendo?
iCyberPaul
1
Navegador significa el usuario desde donde se produce la interacción entre usted y la aplicación.
Uddhav Gautam
44
Giro de la trama: nadie sabe realmente lo que está sucediendo. En realidad, todos son lo mismo. Jaja. No, pero realmente, incluso con estas imágenes "útiles", es difícil procesar lo que está pasando. Creo que eso es parte del problema / confusión.
Andrew
34

Gran explicación del enlace: http://geekswithblogs.net/dlussier/archive/2009/11/21/136454.aspx

Primero veamos MVC

La entrada se dirige primero al controlador, no a la vista. Esa entrada podría provenir de un usuario que interactúa con una página, pero también podría ser simplemente ingresando una URL específica en un navegador. En cualquier caso, es un controlador que está conectado para iniciar algunas funciones.

Existe una relación de muchos a uno entre el Controlador y la Vista. Esto se debe a que un solo controlador puede seleccionar diferentes vistas para representar en función de la operación que se ejecuta.

Hay una flecha unidireccional de Controlador a Vista. Esto se debe a que la Vista no tiene ningún conocimiento o referencia del controlador.

El Controlador devuelve el Modelo, por lo que hay conocimiento entre la Vista y el Modelo esperado que se le pasa, pero no el Controlador que lo sirve.

MVP - Presentador de vista de modelo

Ahora veamos el patrón MVP. Se ve muy similar a MVC, excepto por algunas distinciones clave:

La entrada comienza con la Vista, no con el Presentador.

Hay un mapeo uno a uno entre la Vista y el Presentador asociado.

La vista contiene una referencia al presentador. El presentador también está reaccionando a los eventos que se activan desde la Vista, por lo que está al tanto de la Vista a la que está asociada.

El presentador actualiza la vista en función de las acciones solicitadas que realiza en el modelo, pero la vista no tiene conocimiento del modelo.

MVVM - Vista Modelo Vista Modelo

Entonces, con los patrones MVC y MVP frente a nosotros, veamos el patrón MVVM y veamos qué diferencias tiene:

La entrada comienza con la Vista, no con el Modelo de vista.

Mientras que la Vista contiene una referencia al Modelo de vista, el Modelo de vista no tiene información sobre la Vista. Es por eso que es posible tener un mapeo de uno a muchos entre varias Vistas y un Modelo de Vista ... incluso a través de tecnologías. Por ejemplo, una vista WPF y una vista Silverlight podrían compartir el mismo modelo de vista.

taha027
fuente
77
"Esto se debe a que la Vista no tiene ningún conocimiento o referencia sobre el controlador" Esto no es cierto
Adam Wolski el
@AmirZiarati ViewModel no es parte del MVP sino del patrón MVVM.
Joe
Sería bueno si proporcionara ejemplos como dónde podríamos usar este patrón
JKA
3

La imagen a continuación es del artículo escrito por Erwin van der Valk:

imagen explicando MVC, MVP y MVVM - por Erwin Vandervalk

El artículo explica las diferencias y da algunos ejemplos de código en C #

Jboy Flaga
fuente
Las imágenes de arriba no son confusas, como en MVC ¿por qué VER directamente el acceso al Modelo? lo mismo para los demás?
smkrn110
En estos diagramas no está claro qué significan las flechas. ¿La flecha significa acceso o manipulación? En el diagrama MVC no está claro por qué no hay una flecha iniciando desde el Modelo
Pontios