40

I'm learning about MVVM and Clean Architecture. Then I found some articles present about MVVM + Clean Architecture, but I still didn't get it about the difference between mvvm with clean architecture and mvvm without clean architecture. Any summary about these stuff? Thank you.

Stefanus Anggara
  • 2,333
  • 2
  • 11
  • 7

7 Answers7

30

Clean architecture aims to separate the layers. Business Layer, Data Layer and Presentation Layer will be separate applications. Therefore you will increase the reusability for each one of them. MVVM as design pattern should be implemented in the Presentation Layer. Presentation Layer will interact with Business Layer (or Domain Layer) and the Business Layer will use Data Layer for sharing data.

Bojan Dinev
  • 411
  • 4
  • 6
  • 2
    Then how do you connect use sasese with mvvm layer ? What does "model" from mvvm represent when used together with "CA" – IronHide Dec 08 '21 at 16:58
20

MVVM is just part of the clean architecture in the presentation layer. It just a set of rules on how to display the data from UseCase.

One of the benefits of using clean architecture is we can change our design pattern in presentation layer without changing domain layer or use case.

So for example, if we're using let say MVI and then changing to MVVM, it can be done smoothly with ease.. :)

Faruk
  • 5,438
  • 3
  • 30
  • 46
  • Then how do you connect use sasese with mvvm layer ? What does "model" from mvvm represent when used together with "CA" – IronHide Dec 08 '21 at 16:58
  • @IronHide We can connect the useCase with MVVM layer by simply putting it in ViewModel. Model in MVVM (presentation layer) is the output of the useCase. Of course, the implementation in viewModel code depends on how you return the output of the useCase. – Faruk Dec 09 '21 at 11:30
  • ok interesting idea, i was thinking about Model using the usecase instead, for me the usecase is not just singel action it's a sequence of actions (steps ) probably methods that need to be called on it, so for me the model is used from the beginning and not as end result. – IronHide Dec 09 '21 at 12:31
  • i guess what you mean is that the model is simple DTO for uscase interaction and not modeling as in pure mvvm pattern ? pity uncle bob did not use mvvm in his examples – IronHide Dec 09 '21 at 12:40
  • If the DTO is not enough for you, then you can convert the DTO model to the model for UI, in the viewModel. And I agree UseCase shouldn't know anything about the model in the UI (MVVM) because UseCase is simply giving an output of a process. If useCase has no output, at least it has void return when the process is finished. – Faruk Dec 09 '21 at 13:07
  • Well... UseCase doesn't actually know it just knows about the interface but hmm according to "CA" all input and output interfaces need to be defined in the Domain layer where the Usecase is defined so it would be strange to have mvvm model definition there but implementation in the presentation layer... – IronHide Dec 09 '21 at 15:12
8

As I understand:

MVVM without clean architecture:

______________________________________________

UI
- - - - - - - - - - - - - - - - - - - - - - - 

Presenter/ViewModel        (Business Logic)
______________________________________________

Repository

DataSource
______________________________________________

MVVM with Clean Architecture:

______________________________________________

UI
                                                Presentation Layer
Presenter/ViewModel        
______________________________________________

UseCases + Entity          (Business Logic)    Domain/Business Layer
______________________________________________

Repository
                                                Data Layer
DataSource
______________________________________________
marc_s
  • 732,580
  • 175
  • 1,330
  • 1,459
Deven
  • 3,078
  • 1
  • 32
  • 34
6

MVVM is just a technique to manage the View layer of whatever architecture you're using.

Clean Architecture is a way of organizing communication between layers. They aren't mutually exclusive

The Layers of MVVM with Clean Architecture The code is divided into three separate layers:

  • Presentation Layer
  • Domain Layer
  • Data Layer

Presentation Layer
Is here, where the logic related with views and animations happens. It uses Model-View-ViewModel ( MVVM), but you can use any other pattern like MVC or MVP

Foroogh Varmazyar
  • 1,057
  • 1
  • 14
  • 18
  • 1
    Then how do you connect use sasese with mvvm layer ? What does "model" from mvvm represent when used together with "CA" ? – IronHide Dec 08 '21 at 16:57
  • In a clean architecture, the usecase is placed in the Domain layer, and then the usecase is aware of the Repository and the Viewmodel is aware of the usecase. – Foroogh Varmazyar Jan 08 '23 at 07:46
3

Clean Architecture is a set of rules and principles that helps you maintain and architect a software system. While MVVM is a Design Pattern (similarly like other ones MVP, MVC) that is originated from Clean Architecture.

As Clean Architecture strongly recommends to separate each layer UI, Controllers, Use-cases & Entities, MVVM does the same job as it separates each of them in:

  • UI -> View
  • Controllers -> ViewModel
  • Use-cases/Entities/APIs/Local/Repos/etc. -> Model

That's what I understood. Hope this helps :)

Shehroz Ali
  • 159
  • 5
2

Let's refer to the primary sources.

Main differences:

  1. MVVM (https://learn.microsoft.com/en-us/dotnet/architecture/maui/mvvm) is built around a "model" (business rules), where a database is a part of the "model". enter image description here
  2. The same goes for Android's "whatever name is" architecture (data<-domain<-UI) https://developer.android.com/topic/architecture. It is built around the "data" layer, making it very difficult to switch between databases, but allows easily manipulate with UI. enter image description here
  3. The clean architecture (https://blog.cleancoder.com/uncle-bob/2012/08/13/the-clean-architecture.html) is built around "business rules", where everything is very flexible and the database and UI are both can be replaced at any time. enter image description here

Here is a quote from the book "Clean Architecture: A Craftsman’s Guide to Software Structure and Design":

The architect can employ the Single Responsibility Principle and the Common Closure Principle to separate those things that change for different reasons, and to collect those things that change for the same reasons—given the context of the intent of the system. User interfaces change for reasons that have nothing to do with business rules. Business rules themselves may be closely tied to the application, or they may be more general. The database, the query language, and even the schema are technical details that have nothing to do with the business rules or the UI.

Thus we find the system divided into four decoupled horizontal layers — the application-independent business rules, Application-specific business rules, UI, and the Database.

Later in the book Robert Martin describes in detail how to build these 4 corresponding layers:

  1. Enterprise Business Rules (Entities)
  2. Application Business Rules (Use Cases)
  3. Interface Adapters
  4. Frameworks & Drivers.

Here is another quote, regarding View Model from the Clean Architecture:

If the application wants to display money on the screen, it might pass a Currency object to the Presenter. The Presenter will format that object with the appropriate decimal places and currency markers, creating a string that it can place in the View Model. If that currency value should be turned red if it is negative, then a simple boolean flag in the View model will be set appropriately. Anything and everything that appears on the screen, and that the application has some kind of control over, is represented in the View Model as a string, a boolean, or an enum. Nothing is left for the View to do other than to load the data from the View Model into the screen.

As you can see ViewModel from the clean architecture is more like a "state" of the View, and the logic of the View goes to the "Presenter". In MVVM on another hand, ViewModel holds both state and logic of the View.

In summary: MVVM and Clean Architecture are completely different and there is no way you can build a MVVM with the Clean Architecture.

Dmytro T
  • 111
  • 2
  • 5
  • Thanks for the different point of view. This architecture subject is so confusing to me. People say that you can use Clean Architecture with MVVM, or you can use just MVVM, but then they say that for some abstract reasons you should use it with CA. And then there is modular design, which can also be implemented. And "it all depends on the complexity of your app". – Tim Kochetkov Jun 08 '23 at 11:50
  • From some article that I've read: "MVVM separates your view (i.e. Activities and Fragments) from your business logic. MVVM is enough for small projects, but when your codebase becomes huge, your ViewModels start bloating. Separating responsibilities becomes hard. MVVM with Clean Architecture is pretty good in such cases. It goes one step further in separating the responsibilities of your code base. It clearly abstracts the logic of the actions that can be performed in your app." – Tim Kochetkov Jun 08 '23 at 11:51
0

Clean Architecture with MVVM

Three Layers

  1. Presentation (Model-View-ViewModel)
  2. Domain (or Business) Layer - [Use Case, Entity, Repository (for testing)]
  3. Data Layer - [Repository (Impl), Network (Retrofit), Local (Room)]