MVP vs MVC vs MVVM - Choosing Web Architecture for your Project
Tags: architecture, webdev
Published: 2020-07-23 13:49:10

App development is trending these days, thanks to the rising number of mobile phones around the world. Seeing the huge rise in mobile users, companies have started to shift their business towards the online platform. 

This has given a good opportunity of employment to Android developers. Thanks to this, many people are learning Android app development these days. 

One of the important elements of Android is its architecture, its basic design. Android architecture is basically of three types: MVC(Model View Control), MVP(Model View Presenter), and MVVM(Model View View-Model).

So in this blog, we are going to discuss MVP, MVC, and MVVM and do a comparison between them. 

But before that, let us see why we need design patterns.

1. It removes the boilerplate code
2. Easy to Test & Maintain the code
3. Time-saving or less time consuming
4. Build a more responsive and error-free application
5. Separate the UI and business logic

Now that we're clear with the need for design patterns, let us start the design frameworks.

<h2>Model View Controller(MVC)</h2>

<img src="https://codersera.com/blog/wp-content/uploads/2019/07/mvc-1.png">

Model–view–controller (usually known as MVC) is a software design pattern commonly used for developing user interfaces that divide the related program logic into three interconnected elements. 

The MVC design pattern forms the basis for the first architectural solution of the first programming environment with a graphical user interface – Smalltalk-80.

The architecture of Model-View-Controller is such that it allows you to segregate the data model, user interface, and control logic into three individual components. Since the three components are individuals, any change in a component won’t be reflected in others.

This type of architecture is well suited for those who are working on large app development projects as a team. 

MVC consists of three components–

1. Model
2. View 
3. Controller

<b>Model</b> – It basically represents the data that is to be displayed on the screen. In most cases, this refers to the communication between the databases. This communication can be in the form of adding new data, changing existing ones, or selecting specific data. It performs operations on the raw data. The data displayed by it to the user could be in any form.

<b>View</b> – View is used for displaying the data taken as input by the model to the user. It represents the User Interface components like HTML and XML. It receives at the input a set of raw data that must be transmitted to the user and formats it following the requirements of the user.

<b>Controller</b> – As the name suggests, the Controller is responsible for handling all the processes, that is, it is responsible for resolving all the external requests and fulfills these requests. It takes the user’s data through the model to view, acting as a mediator between the two.

<h2>Model View Presenter</h2>

<img src="https://codersera.com/blog/wp-content/uploads/2020/06/mvp-1.jpg">

Model–view–presenter (MVP) is a derivation of the model–view–controller (MVC) architectural pattern. Since it is a derivation of MVC, it has many features similar to it. It appeared for the first time in IBM and then in Taligent during the 90s. 

MVP consists of three components-

1. Model
2. View
3. Presenter

<b>Model</b> – The Model represents a set of classes that describes the business logic and data. It also defines business rules for data means how the data can be changed and manipulated. 

<b>View</b> – View is used for making interactions with users like XML, Activity, fragments. It has got nothing to do with the logic that is to be implemented in the process.

<b>Presenter</b> – It is the processing unit of the system. The presenter gets the input from the View, processes the data with the help of Model, and passes the results back to View after the processing is done. 

To simplify the MVP model, the presenter responds to the input data and returns it to View after the processing is done. View and Presenter are not related to each other and interact only through the interface. 

<h2>Model View View-Model</h2>

<img src="https://codersera.com/blog/wp-content/uploads/2020/06/mvvm-1-1024x176.jpg">

Model–view–view model (MVVM) is a software architectural pattern that facilitates the separation of the development of the graphical user interface (the view) – be it via a markup language or GUI code – from the development of the business logic or back-end logic (the model) so that the view is not dependent on any specific model platform. 

It has three main components-

1. Model
2. View
3. View-Model

<b>Model</b> – The model used in MVVM is similar to the model used in MVC, consisting of the basic data required to run the software.

<b>View</b> –  View is a graphical interface between the user and the design pattern, similar to the one in MVC. It displays the output of the data processed.

<b>View-Model</b> – View-Model is on one side an abstraction of the View and, on the other, provides a wrapper of the Model data to be linked. That is, it comprises a Model that is converted to a View, and it also contains commands that the View can use to influence the Model.

With that, we have covered the basics of all the three design frameworks of Android. Now, we move towards the comparison.

<h2>Comparison between MVC, MVP, and MVVM</h2>

The comparison between <a href="https://codersera.com/blog/mvc-vs-mvp-vs-mvvm/">MVC, MVP, and MVVM</a> are mentioned below-

1. Performance Evaluation – When we are testing the UI performance, MVP turns out to be the one with the highest reliability and lowest hindrance when it comes to rendering frames. Data binding in MVVM creates an additional overload that could drastically affect its performance when performing complex tasks.

2. Compatibility – When testing the patterns based on their compatibility, MVVM was the best of the lot due to its data binding which had a positive impact. MVP fared better than MVC, which had serious restating issues.

3. Modifiability – When we talk about design patterns, it is evident that it should be modifiable since that gives us the option of adding new features and strategies into our app. Based on these factors, we observed that changes are very less in MVP and MVVM, with MVVM contributing a lot towards maintainability. MVC tends to increase the number of changes in the majority of the cases.

4. References – In MVC, the view doesn’t have reference to the Controller while in MVP, the view has reference to the presenter and in MVVM, the view has reference to the view-model.

<h2>Conclusion</h2>

Android development is a promising field for the future. It is bound to grow at high rates. The basic architecture of Android contains design patterns - MVC, MVP, and MVVM. They are quite similar but have a few differences which make them distinct. Hope this helped you in getting the basic idea of architecture.