Difference between MVC, MVP and MVVM

1. Enterprise Resource Planning
© Departmentof Information Technology, University Of The Punjab, Gujranwala
Campus. 1
University of the Punjab
Gujranwala Campus
Name: Ayesha Maqsood
Roll No: BT14013
Class: BS-IT 7th
SEM (M)
Assignment: MVC, MVP and MVVM
Submitted To: Sir Zahid Mughal

2. Enterprise Resource Planning
© Departmentof Information Technology, University Of The Punjab, Gujranwala
Campus. 2
Difference between MVC, MVP and MVVM
MVC, MVP and MVVM are most popular design patterns where MVC stands for Model-
View-Controller, MVP stands for Model-View-Presenter and MVVC stands for Model-View-
ViewModel. All these design patterns help developing applications that are loosely coupled, easy
to test and maintain.
MVC Design Pattern:
MVC design patterns divides application into three major aspects: Model, View and
Controller.
Model: represents collection of classes that define business logics i.e. business model and
data model. It also defines business rules for data as how a data can be altered or
manipulated.
View: represents User Interface components like HTML, CSS, jQuery etc. It displays the
data coming from controller as outcome. This also changes model in user interface.
Controller: It acts as bridge between model and view and processes incoming request from
user. It gets request from user via the View, then process user’s data through Model, and
passing back the result to View.
Properties:
 Input is directed at the controller first, not the view.
 There is one-to-many relationship between the Controller. That’s because a single
controller may select different views to be rendered based on the operation being executed.
 There is one way arrow from Controller to View. This is because the view doesn’t have
any knowledge of or reference to the Controller.
 The controller does pass back the Model, so there is knowledge between the View and the
expected Model being passed into it, but not the Controller serving it up.
 It limited support to Unit testing.
 It uses where the connection between view and the rest of program is not always available.
 There is loose coupling between Model and the View.

3. Enterprise Resource Planning
© Departmentof Information Technology, University Of The Punjab, Gujranwala
Campus. 3
 This pattern is used by well-known frameworks such as Ruby on Rails, Apple iOS
Development, ASP.NET MVC, etc.
MVP Design Pattern:
The MVP stands for Model-View-Presenter, this pattern is similar to the MVC pattern,
wherein the controller is replaced by the presenter. This pattern divides an application into three
major aspects: Model, View, and Presenter.
Model: The Model represents a collection of classes that explains the business model and
the data model. It also defines the business rules for data means as how the data can be
altered and manipulated.
View: The View represents the UI components like CSS, jQuery, html etc. It is only
responsible for displaying the data that is received from the presenter as the result. This
also transforms the model(s) into UI.
Presenter: The Presenter is responsible for handling all UI events on behalf of the view.
This receive input from users via the View, then process the user's data with the help of
Model and passing the results back to the View. Unlike view and controller, view and
presenter are completely decoupled from each other’s and communicate to each other’s by
an interface.
Properties:
 The input begins with the view, not the Presenter.
 There is one-to-one mapping between the view and the associated presenter means one
View is mapped to one Presenter.
 The view holds a reference to the Presenter. The presenter is also reacting to events
triggered from the View, so its aware of the View its associated with.
 The Presenter updates the view based on the requested action it performs on the Model,
but the View is not Model aware.
 It highly supports Unit testing.
 It uses where binding via a data context is not possible.
 View is more loosely coupled to the model. The presenter is responsible for binding the
model to the view.
 This pattern is used by frameworks such as for ASP.NET Web Forms applications.

4. Enterprise Resource Planning
© Departmentof Information Technology, University Of The Punjab, Gujranwala
Campus. 4
MVVM Design Pattern:
MVVM stands for Model-View-View Model. This pattern supports two-way data binding
between view and View model. This enables automatic propagation of changes, within the state of
view model to the View. Typically, the view model uses the observer pattern to notify changes in
the view model to model. This pattern divides an application into three major aspects: Model,
View, and View-Model.
Model: The Model represents a collection of classes that explains the business model and
the data model. It also defines the business rules for data means as how the data can be
altered and manipulated.
View: The View represents the UI components like CSS, jQuery, html etc. It is only
responsible for displaying the data that is received from the presenter as the result. This
also transforms the model(s) into UI.
View-Model: The View Model is responsible for exposing methods, commands, and other
properties that helps to maintain the state of the view, manipulate the model as the result
of actions on the view, and trigger events in the view itself.
Properties:
 Input begins with the view, not View Model.
 There is many-to-one relationship between View and View Model means many view can
be mapped to one View Model.
 View has no idea about the Model in MVVM pattern, this is because, as far as the View
knows, it Model is the ‘View Model’ (hence its name).
 There is rich communication between the View and View Model, isolating the View from
having to know anything about what’s really happening behind the scenes.
 It goes hand-in-hand with Unit testing.
 It uses where binding via a data context is possible.
 MVVM promotes separate concerns between view, user interaction logic, behavior and
model that leads to its loose coupling. By this, you can easily replace view without affecting
View Model.
 This pattern is used by frameworks such as WPF, Caliburn, Silverlight, nRoute, and more.