VIP Architecture in Swift with easy explanation

Recently I joined a project where the architecture follows the Clean-Swift VIP Pattern. This article is an overview and some thoughts from a mobile developer’s perspective who have NEVER touched the VIP architecture before. This article will show the basic concepts of VIP Architecture and how are they work, hope to help someone who puts their hands on this like me.

Why VIP Architecture

As a government project, there are several developers working on the same repo, and there are many PR and merging happening every day. The VIP architecture is more suitable for a project if:

  1. Many developers are working on the same repo
  2. Time is quite tight, there are deadlines for each of small functions/features
  3. Testing more and code less

Components

VIP architecture is consist of three core components:

  • ViewController: Here the ViewController is the UIViewController we saw many times in development, but slightly different, ViewController now interact with users' input (tap button, input text and so on) and rendering views.
  • Interactor: Business logic, this is the place we normal do some jobs, such as call an API to get a list of products.
  • Presenter: Validate the data and rendering the views. Here Presenter doesn't directly draw the views on the screen, instead, it will call ViewController to do that by passing the data.

There are also some other components such as Worker, Router and etc which we will talk about later.

Scene and VIP Circle

The workflow of VIP pattern is working like this:

ViewController → Interactor → Presenter → ViewController

In VIP Architecture, the app consists of many scenes, and each scene follows a VIP cycle. Scene here refers to business logic. For example, a login is a scene, showing a list of products on the screen. There are no specific rules about what a scene is, as every project is different, we can have as many as we want for each project.

Data Flow

The data flow of VIP Architecture is unidirectional.

  1. ViewController get users' input and pass the data to Interactor as an request.
  2. Then Interactor process (such as verify users' data with an API call) and pass the data to Presenter as an Response.
  3. Presenter process (such as data validation, i.e phone number, email and etc) and pass the data to ViewController, in other words, rendering on the screen.

What is Next:

In the coming article, let have a simple example to get more details from a code level prospective.

Reference

comments powered by Disqus