DEV Community

Cover image for MVC vs MVP vs MVVM Design Patterns
Vincent Tsen
Vincent Tsen

Posted on • Updated on • Originally published at vtsen.hashnode.dev

MVC vs MVP vs MVVM Design Patterns

High-level differences between Model-View-Controller(MVC), Model-View-Presenter(MVP), and Model-View-ViewModel(MVVM) for Android development.

It looks like I have been using MVP without knowing it. In fact, I thought I was using MVC. I came to know about this MVVM while learning Android. I like MVVM because of the unidirectional data flow, which makes the architecture a lot cleaner.

The diagram below gives you side-by-side comparisons between them.

mvc_mvp_mvvm.drawio.png

Model-View-Controlle (MVC)

  • Dependencies direction: View -> Model, Controller -> Model and View
  • View knows about Model (e.g. data binding), Controller knows everything, Model knows nothing
  • Controller observes UI event from View, writes data to the Model and tells the View what to update
  • View retrieves the data from model to display

There are different variations of MVC out there. So what I shared here is based on my understanding which I have tweaked a bit from the original MVC design.

Model-View-Presenter (MVP)

  • Dependencies direction: Presenter -> Model and View
  • Presenter knows everything, View and Model know nothing
  • Presenter observes UI event from View, writes data to the Model, read the data from Model and provides data to the View for display

MVP is similar to MVC except the View doesn't depends on the Model. The Presenter takes care of reading/writting the data and passsing the data to the View.

Model-View-ViewModel (MVVM)

  • Dependencies direction: View -> View Model -> Model
  • View knows about View Model, View Model knows about Model, Model knows nothing
  • When there is a UI event, View informs the View Model about the UI event.
  • View Model performs some logics and writes data to the Model
  • View Model observes the data changes from Model and update its own data
  • View observes the data changes from View Model. If there are any changes, View is responsible to update the UI

Please note that the Activity/Fragment has been moved up to View. Also, the dependency and data flow are unidirectional.

Summary

I have personally seen hybrid MVC and MVP usage at my work. It makes the architecture very messy. We should really just stick to either one.

MVVM is better than MVC/MVP because of its unidirectional data and dependency flow. Dependency is one way, thus it is a lot easier to decouple it when we need to. It is also easier for testing.

All my projects(written in Kotlin for Android app) are based on MVVM.


Originally published at https://vtsen.hashnode.dev.

Oldest comments (4)

Collapse
 
bigbott profile image
bigbott

Very nicely written. Pitty that article did not get attention it deserves and there is no discussion available.

Collapse
 
siril profile image
Cyrille Dakhlia

For many weeks I have browsed the web in quest of a clear explanation of the differences between these architectural design patterns.
I asked ChatGPT repeatedly and in different ways: no success encountered.
I could only found contradictions here and there... until I found your article.

It is, by far, the clearest explanation I have ever read, and it finally made me grasp the differences.
Thank you very much sir.

Collapse
 
vtsen profile image
Vincent Tsen

Awesome, I'm glad it helps, and thanks for letting me know.

Collapse
 
siril profile image
Cyrille Dakhlia

It just helped me explain clearly those differences in an interview, I am really grateful!

I have already shared your article twice since this my post, and I'll continue every time I'll see someone struggling with the same matter.