Building Scalable iOS Application Using VIP Architecture Pattern (CleanSwift)
VIP architecture basically consists of three main layers with unidirectional communication through each declared protocol.
Hi everyone, how it’s going today? I hope everything just going well for you guys and stay healthy in this current pandemic situation.
And yes it take a really long time to make me write an article again :] because I have pretty busy with my full time job right now as an iOS Engineer at one of education tech company in Indonesia. Sorry, just a little bit of show off.
So basically in this article, I want to write about how to build scalable iOS application using VIP clean architecture. Disclaimer, the reason that I use VIP architecture not because it is the best architecture that we can use for build a scalable iOS application. In my opinion, whatever architecture that you use actually it doesn’t really matter. You can also pick MVC, MVVM, MVP, or VIPER as an architecture for your project. The important thing is how you design and architect it, not the architecture it self. For example, you can still have a problem like massive view model if you use MVVM not properly or you implement VIPER for create todo-list application because it is really over-engineering. So I think the best option is just pick the right technology or architecture for the right project.
A Bit Overview of VIP Architecture
VIP Architecture or Clean Swift is derived from Clean Architecture concept proposed by Uncle Bob. Basically it have three main layers with the unidirectional communication flow through protocol and make it loose coupling between each others. Of course in a real implementation, we still need some additional layers like networking layer, or maybe coordinator/router layer for handling navigation properly.
View controller has some responsibilities to display data to the user, receive UI event from user, and escalate the request to the interactor. View controller will communicate to the interactor through protocol for give some data or request from user. Interactor main job is to manage application business logic and receive a request from view controller. Interactor should ask the model layer or network service to do some job related from view controller request. If the network service has finished the job for retrieved some data from web service, or after the model layer has finished decode the data, then it will return the data to interactor and ask the presenter layer to prepare the presentation. When presenter already received the data from interactor, then the presenter have the responsibility to transform the data into ready-consumable data in order to passing the data back to the view controller. For more complete explanation about VIP, you can visit this here.
Implementation
I have already made a sample project for implement this VIP architecture.
You can visit my github and clone the project here:
Also don’t forget to register yourself for get the API key from Movie DB API.
A bit overview to the project. The project contains some folder like Scenes, Service, Model, and Base. Scenes folder contains the list of use case in application. For example if we create Instagram application, then maybe there are some use cases like login, feeds, explore, stories, etc. In this sample app, I just created one use case that is show list of movies. Let’s dive to each layer one by one.
ListMovieViewController
As we already talked before. View controller responsibility only show data to user and escalate the request to interactor. It ask the interactor to fetch the movies in ViewDidAppear function. Give a notice to the setup() function at line number 47. You can see that the VIP cycle is initiated on setup() function and it get called every view controller is initiated on theinit function.
Again, each layers in VIP architecture are conform to the protocol. This implementation provide a better abstraction and the application would be loose coupling. View controller only need to implement the contract function from ListMovieDataLogic protocol for communicating to the interactor, it doesn’t need to know how the real implementation behind the scene, as well as how the interactor will communicate to the presenter and presenter communicate to the view controller.
ListMovieInteractor
Interactor layer manage a business logic of application. From my implementation it conforms two protocols that is ListMovieDataLogic protocol which is used for communication between view controller and interactor, and ListMovieDataStore for providing movies array. Interactor will ask the movie service for fetch movies from web service, and if the result is success then it will ask presenter to prepare the movies data otherwise it will ask presenter to prepare error message that would be displayed to view controller.
ListMoviePresenter
Presenter will prepare the data given from the interactor and will transform it to ready-consumable data. In the code above, it conforms ListMoviePresentationLogic protocol that providing two function for display movies and display error messages. The presenter has view controller property that already setup in view controller initiation, remember the VIP cycle in setup() function on ListMovieViewController. If everything goes well, then presenter will ask view controller to display movies or display error message through ListMovieDisplayLogic that already conformed by ListMovieViewController.
MovieService & MovieDataStore
MovieService is simple implementation for network layer. For make it loose coupling, I created additional class called MovieDataStore conform to MovieStoreProtocol and then we can inject it to the MovieService init function. Then the MovieDataStore will request to the web service and the result would be given to the MovieService.
Unit Test
As our previous discussion, we build the application using protocol for each layer and it make our job become more easier to create the unit test. For example, let’s dive to the code for test ListMovieViewController.
We have subject under test that is ListMovieViewController. We setup all stuff needed in setupWithError function. There are some behaviour that we want to test in ListMovieViewController, one of it is we will make sure that the interactor will fetch the movies when view did appear.
Instead of using the real interactor object which is ListMovieInteractor, we created the mock interactor called MockListMovieInteractor. We don’t have to implement real fetch movie to the web service because it doesn’t efficient for testing because we may have a problem like network latency so we just create some boolean variable called fetchMoviesCalled for make sure the behaviour is already suitable.
For the implementation, you can see the line number 39. When the view did appear is called, then the mock interactor will execute fetchMovies function and the fetchMoviesCalled value will turn to true so it will pass the test case. For other test case you can explore by yourself.
Where to go from here
This article would be long if I explain all things about VIP architecture pattern in my sample project. You can explore by yourself to read more deep about VIP or other architecture, also you can explore about the unit test it self. From here, I encourage you to go more deep about my sample code. Create another scenes, and also create the unit test for it.
Thank you for reading this article. Of course this article is not perfect and any feedback from you really appreciated. See ya :]
