Чистая архитектура с viper / Сергей Крапивенский...
TRANSCRIPT
![Page 1: Чистая архитектура с VIPER / Сергей Крапивенский (Rambler&Co)](https://reader034.vdocuments.net/reader034/viewer/2022042502/58729f401a28ab07208b562f/html5/thumbnails/1.jpg)
Чистая архитектура с VIPER
Сергей Крапивенский, ведущий iOS-разработчик
Rambler&Co
![Page 2: Чистая архитектура с VIPER / Сергей Крапивенский (Rambler&Co)](https://reader034.vdocuments.net/reader034/viewer/2022042502/58729f401a28ab07208b562f/html5/thumbnails/2.jpg)
Грязная архитектура
2
![Page 3: Чистая архитектура с VIPER / Сергей Крапивенский (Rambler&Co)](https://reader034.vdocuments.net/reader034/viewer/2022042502/58729f401a28ab07208b562f/html5/thumbnails/3.jpg)
Грязная архитектура
• Огромные классы с кучей ответственностей
• Сильная связанность компонентов
• Трудно дебажить
• Трудно вносить изменения
• Невозможно покрыть тестами
• Хочется все сжечь 🔥
3
![Page 4: Чистая архитектура с VIPER / Сергей Крапивенский (Rambler&Co)](https://reader034.vdocuments.net/reader034/viewer/2022042502/58729f401a28ab07208b562f/html5/thumbnails/4.jpg)
Чистая архитектура
• Простые компоненты с четкими обязанностями
• Слабая связанность
• Легко покрывается тестами
• Легко вносить изменения
• Просто понять
4
![Page 5: Чистая архитектура с VIPER / Сергей Крапивенский (Rambler&Co)](https://reader034.vdocuments.net/reader034/viewer/2022042502/58729f401a28ab07208b562f/html5/thumbnails/5.jpg)
MVC от Apple: ожидание
5
![Page 6: Чистая архитектура с VIPER / Сергей Крапивенский (Rambler&Co)](https://reader034.vdocuments.net/reader034/viewer/2022042502/58729f401a28ab07208b562f/html5/thumbnails/6.jpg)
MVC от Apple: реальность
6
![Page 7: Чистая архитектура с VIPER / Сергей Крапивенский (Rambler&Co)](https://reader034.vdocuments.net/reader034/viewer/2022042502/58729f401a28ab07208b562f/html5/thumbnails/7.jpg)
MVC от Apple
7
![Page 8: Чистая архитектура с VIPER / Сергей Крапивенский (Rambler&Co)](https://reader034.vdocuments.net/reader034/viewer/2022042502/58729f401a28ab07208b562f/html5/thumbnails/8.jpg)
Как появился VIPER
8
08.2012 12.2013 06.2014 05.20152014-2015
![Page 9: Чистая архитектура с VIPER / Сергей Крапивенский (Rambler&Co)](https://reader034.vdocuments.net/reader034/viewer/2022042502/58729f401a28ab07208b562f/html5/thumbnails/9.jpg)
Как появился VIPER
9
08.2012 12.2013 06.2014 05.20152014-2015
![Page 10: Чистая архитектура с VIPER / Сергей Крапивенский (Rambler&Co)](https://reader034.vdocuments.net/reader034/viewer/2022042502/58729f401a28ab07208b562f/html5/thumbnails/10.jpg)
Как появился VIPER
10
08.2012 12.2013 06.2014 05.20152014-2015
![Page 11: Чистая архитектура с VIPER / Сергей Крапивенский (Rambler&Co)](https://reader034.vdocuments.net/reader034/viewer/2022042502/58729f401a28ab07208b562f/html5/thumbnails/11.jpg)
Как появился VIPER
11
08.2012 12.2013 06.2014 05.20152014-2015
![Page 12: Чистая архитектура с VIPER / Сергей Крапивенский (Rambler&Co)](https://reader034.vdocuments.net/reader034/viewer/2022042502/58729f401a28ab07208b562f/html5/thumbnails/12.jpg)
Как появился VIPER
12
08.2012 12.2013 06.2014 05.20152014-2015
![Page 13: Чистая архитектура с VIPER / Сергей Крапивенский (Rambler&Co)](https://reader034.vdocuments.net/reader034/viewer/2022042502/58729f401a28ab07208b562f/html5/thumbnails/13.jpg)
Идея VIPER
• Приложение разбивается на блоки с однотипной структурой
• Принцип разбиения — по user story
• User story описывает поведение приложения
13
![Page 14: Чистая архитектура с VIPER / Сергей Крапивенский (Rambler&Co)](https://reader034.vdocuments.net/reader034/viewer/2022042502/58729f401a28ab07208b562f/html5/thumbnails/14.jpg)
User story
Пример — лента фото в Instagram
Задача — отобразить последние фото друзей
При необходимости можно перейти на другие истории
14
![Page 15: Чистая архитектура с VIPER / Сергей Крапивенский (Rambler&Co)](https://reader034.vdocuments.net/reader034/viewer/2022042502/58729f401a28ab07208b562f/html5/thumbnails/15.jpg)
User story
Список лайков к нашим фото — другая история
Это простые примеры: 1 экран = 1 история
15
![Page 16: Чистая архитектура с VIPER / Сергей Крапивенский (Rambler&Co)](https://reader034.vdocuments.net/reader034/viewer/2022042502/58729f401a28ab07208b562f/html5/thumbnails/16.jpg)
User story
На одном экране может быть несколько разных историй
16
![Page 17: Чистая архитектура с VIPER / Сергей Крапивенский (Rambler&Co)](https://reader034.vdocuments.net/reader034/viewer/2022042502/58729f401a28ab07208b562f/html5/thumbnails/17.jpg)
User story
На одном экране может быть несколько разных историй
1. Лента фотографий
17
1. Лента фотографий
2. Таб-бар для переключения ленты
3. Панель с информацией о пользователе
![Page 18: Чистая архитектура с VIPER / Сергей Крапивенский (Rambler&Co)](https://reader034.vdocuments.net/reader034/viewer/2022042502/58729f401a28ab07208b562f/html5/thumbnails/18.jpg)
User story
На одном экране может быть несколько разных историй
1. Лента фотографий
2. Таб-бар для переключения ленты
18
1. Лента фотографий
2. Таб-бар для переключения ленты
3. Панель с информацией о пользователе
![Page 19: Чистая архитектура с VIPER / Сергей Крапивенский (Rambler&Co)](https://reader034.vdocuments.net/reader034/viewer/2022042502/58729f401a28ab07208b562f/html5/thumbnails/19.jpg)
User story
На одном экране может быть несколько разных историй
1. Лента фотографий
2. Таб-бар для переключения ленты
3. Панель с информацией о пользователе
19
![Page 20: Чистая архитектура с VIPER / Сергей Крапивенский (Rambler&Co)](https://reader034.vdocuments.net/reader034/viewer/2022042502/58729f401a28ab07208b562f/html5/thumbnails/20.jpg)
Действия модуля
• Получает данные
• Преобразовывает данные для отображения
• Реагирует на действия пользователя
• Переходит на другие модули при необходимости
20
![Page 21: Чистая архитектура с VIPER / Сергей Крапивенский (Rambler&Co)](https://reader034.vdocuments.net/reader034/viewer/2022042502/58729f401a28ab07208b562f/html5/thumbnails/21.jpg)
Канонический модуль VIPER
E
PRESENTERVIEW INTERACTOR
WIREFRAME
E
21
![Page 22: Чистая архитектура с VIPER / Сергей Крапивенский (Rambler&Co)](https://reader034.vdocuments.net/reader034/viewer/2022042502/58729f401a28ab07208b562f/html5/thumbnails/22.jpg)
E
PRESENTERVIEW INTERACTOR
WIREFRAME
E
22
Канонический модуль VIPER
Отображает на экране полученные данные
Информирует модуль о действиях пользователя
![Page 23: Чистая архитектура с VIPER / Сергей Крапивенский (Rambler&Co)](https://reader034.vdocuments.net/reader034/viewer/2022042502/58729f401a28ab07208b562f/html5/thumbnails/23.jpg)
E
PRESENTERVIEW INTERACTOR
WIREFRAME
E
23
Канонический модуль VIPER
Содержит всю логику работы с данными
![Page 24: Чистая архитектура с VIPER / Сергей Крапивенский (Rambler&Co)](https://reader034.vdocuments.net/reader034/viewer/2022042502/58729f401a28ab07208b562f/html5/thumbnails/24.jpg)
E
PRESENTERVIEW INTERACTOR
WIREFRAME
E
24
Канонический модуль VIPER
Подготавливает данные для отображения View
Обрабатывает действия пользователя
![Page 25: Чистая архитектура с VIPER / Сергей Крапивенский (Rambler&Co)](https://reader034.vdocuments.net/reader034/viewer/2022042502/58729f401a28ab07208b562f/html5/thumbnails/25.jpg)
E
PRESENTERVIEW INTERACTOR
WIREFRAME
E
25
Канонический модуль VIPER
Отвечает за навигацию модуля
Инициализирует модуль и инжектирует зависимости
![Page 26: Чистая архитектура с VIPER / Сергей Крапивенский (Rambler&Co)](https://reader034.vdocuments.net/reader034/viewer/2022042502/58729f401a28ab07208b562f/html5/thumbnails/26.jpg)
E
PRESENTERVIEW INTERACTOR
WIREFRAME
E
26
Канонический модуль VIPER
Простые модельные объекты
Не содержат никакой логики
![Page 27: Чистая архитектура с VIPER / Сергей Крапивенский (Rambler&Co)](https://reader034.vdocuments.net/reader034/viewer/2022042502/58729f401a28ab07208b562f/html5/thumbnails/27.jpg)
Что мы изменили?
• Разделили Wireframe
• Добавили слой сервисов
• Сделали View слоем
• Формализовали переходы между модулями
• Написали тулзу для кодогенерации
27
![Page 28: Чистая архитектура с VIPER / Сергей Крапивенский (Rambler&Co)](https://reader034.vdocuments.net/reader034/viewer/2022042502/58729f401a28ab07208b562f/html5/thumbnails/28.jpg)
Разделили Wireframe
• Wireframe не удовлетворяет SRP
• Wireframe = Router + Assembly
• Router отвечает за навигацию
• Assembly отвечает за сборку модуля
• Dependency Injection с помощью Typhoon Framework
• https://github.com/appsquickly/Typhoon
28
![Page 29: Чистая архитектура с VIPER / Сергей Крапивенский (Rambler&Co)](https://reader034.vdocuments.net/reader034/viewer/2022042502/58729f401a28ab07208b562f/html5/thumbnails/29.jpg)
Добавили слой сервисов
• “Вся бизнес логика” звучит страшно 😱
• Сервисы — слой ниже интерактора
• 1 сервис = 1 тип сущностей (новости, сообщения, etc)
• Сервисы можно переиспользовать в разных модулях
• Сервисы зависят от объектов нижнего уровня
29
![Page 30: Чистая архитектура с VIPER / Сергей Крапивенский (Rambler&Co)](https://reader034.vdocuments.net/reader034/viewer/2022042502/58729f401a28ab07208b562f/html5/thumbnails/30.jpg)
Слой View
• Тяжелое наследие UIViewController
• Работа с коллекциями не должна быть во View
• Layout и анимации можно вынести из View
• Эти задачи относятся к отображению данных
• Так View превратился в слой
30
![Page 31: Чистая архитектура с VIPER / Сергей Крапивенский (Rambler&Co)](https://reader034.vdocuments.net/reader034/viewer/2022042502/58729f401a28ab07208b562f/html5/thumbnails/31.jpg)
Переходы между модулями
• То, о чем никто не говорит 🙊
• У каждого модуля есть <ModuleInput> и <ModuleOutput>
• Эти протоколы реализует презентер
• Пример: переход из модуля А в модуль B
• Роутер модуля А передает данные в презентер модуля B
• Презентер модуля B возвращает результат в презентер модуля А
31
![Page 32: Чистая архитектура с VIPER / Сергей Крапивенский (Rambler&Co)](https://reader034.vdocuments.net/reader034/viewer/2022042502/58729f401a28ab07208b562f/html5/thumbnails/32.jpg)
Кодогенерация
• С VIPER нужно создать кучу классов
• Каркас всех модулей однотипен
• Руками создавать долго и сложно
• Программисту лень писать руками? Нужен скрипт
• Generamba!
• https://github.com/rambler-ios/Generamba
32
![Page 33: Чистая архитектура с VIPER / Сергей Крапивенский (Rambler&Co)](https://reader034.vdocuments.net/reader034/viewer/2022042502/58729f401a28ab07208b562f/html5/thumbnails/33.jpg)
Что у нас получилось
33
![Page 34: Чистая архитектура с VIPER / Сергей Крапивенский (Rambler&Co)](https://reader034.vdocuments.net/reader034/viewer/2022042502/58729f401a28ab07208b562f/html5/thumbnails/34.jpg)
Что у нас получилось
34
![Page 35: Чистая архитектура с VIPER / Сергей Крапивенский (Rambler&Co)](https://reader034.vdocuments.net/reader034/viewer/2022042502/58729f401a28ab07208b562f/html5/thumbnails/35.jpg)
Афиша.Рестораны
Категории ресторанов
Рестораны в категории
Экран ресторана
35
![Page 36: Чистая архитектура с VIPER / Сергей Крапивенский (Rambler&Co)](https://reader034.vdocuments.net/reader034/viewer/2022042502/58729f401a28ab07208b562f/html5/thumbnails/36.jpg)
Афиша.Рестораны
36
![Page 37: Чистая архитектура с VIPER / Сергей Крапивенский (Rambler&Co)](https://reader034.vdocuments.net/reader034/viewer/2022042502/58729f401a28ab07208b562f/html5/thumbnails/37.jpg)
VIEW
Категории ресторанов
STORYBOARDsegue
VIEW
Рестораны в категории
instantiate
37
![Page 38: Чистая архитектура с VIPER / Сергей Крапивенский (Rambler&Co)](https://reader034.vdocuments.net/reader034/viewer/2022042502/58729f401a28ab07208b562f/html5/thumbnails/38.jpg)
VIEW
Категории ресторанов
STORYBOARDsegue
VIEW
Рестораны в категории
instantiate
ASSEMBLYbuild
38
![Page 39: Чистая архитектура с VIPER / Сергей Крапивенский (Rambler&Co)](https://reader034.vdocuments.net/reader034/viewer/2022042502/58729f401a28ab07208b562f/html5/thumbnails/39.jpg)
VIEW
Категории ресторанов
segueVIEW
Рестораны в категории
INTERACTOR
PRESENTER ROUTER
SERVICE
39
![Page 40: Чистая архитектура с VIPER / Сергей Крапивенский (Rambler&Co)](https://reader034.vdocuments.net/reader034/viewer/2022042502/58729f401a28ab07208b562f/html5/thumbnails/40.jpg)
VIEW
Рестораны в категории
INTERACTOR
PRESENTER ROUTER
SERVICE
VIEW
Экран ресторана
INTERACTOR
PRESENTERROUTER
SERVICE
categoryId
restaurants (Core Data)
restaurantId
restaurant (Core Data)
restaurant (PONSO)
restaurants (PONSO)
40
![Page 41: Чистая архитектура с VIPER / Сергей Крапивенский (Rambler&Co)](https://reader034.vdocuments.net/reader034/viewer/2022042502/58729f401a28ab07208b562f/html5/thumbnails/41.jpg)
Чистая архитектура
• Простые компоненты с четкими обязанностями
• Слабая связанность
• Легко покрывается тестами
• Легко подвергается изменениям
• Просто понять
41
![Page 42: Чистая архитектура с VIPER / Сергей Крапивенский (Rambler&Co)](https://reader034.vdocuments.net/reader034/viewer/2022042502/58729f401a28ab07208b562f/html5/thumbnails/42.jpg)
Чистая архитектура
• Простые компоненты с четкими обязанностями
• Слабая связанность
• Легко покрывается тестами
• Легко подвергается изменениям
• Просто понять
42
![Page 43: Чистая архитектура с VIPER / Сергей Крапивенский (Rambler&Co)](https://reader034.vdocuments.net/reader034/viewer/2022042502/58729f401a28ab07208b562f/html5/thumbnails/43.jpg)
Чистая архитектура
• Простые компоненты с четкими обязанностями
• Слабая связанность
• Легко покрывается тестами
• Легко подвергается изменениям
• Просто понять
43
![Page 44: Чистая архитектура с VIPER / Сергей Крапивенский (Rambler&Co)](https://reader034.vdocuments.net/reader034/viewer/2022042502/58729f401a28ab07208b562f/html5/thumbnails/44.jpg)
Чистая архитектура
• Простые компоненты с четкими обязанностями
• Слабая связанность
• Легко покрывается тестами
• Легко подвергается изменениям
• Просто понять
44
![Page 45: Чистая архитектура с VIPER / Сергей Крапивенский (Rambler&Co)](https://reader034.vdocuments.net/reader034/viewer/2022042502/58729f401a28ab07208b562f/html5/thumbnails/45.jpg)
Чистая архитектура
• Простые компоненты с четкими обязанностями
• Слабая связанность
• Легко покрывается тестами
• Легко подвергается изменениям
• Просто понять
45
![Page 46: Чистая архитектура с VIPER / Сергей Крапивенский (Rambler&Co)](https://reader034.vdocuments.net/reader034/viewer/2022042502/58729f401a28ab07208b562f/html5/thumbnails/46.jpg)
Чистая архитектура
• Простые компоненты с четкими обязанностями
• Слабая связанность
• Легко покрывается тестами
• Легко подвергается изменениям
• Просто понять
46
![Page 47: Чистая архитектура с VIPER / Сергей Крапивенский (Rambler&Co)](https://reader034.vdocuments.net/reader034/viewer/2022042502/58729f401a28ab07208b562f/html5/thumbnails/47.jpg)
Rambler 😍 VIPER
• Рамблер.Конференции — open-source приложение
• Generamba — кодогенератор
• VIPER McFlurry — набор полезных утилит
• The Book Of VIPER — все, что мы знаем о VIPER
• И еще некоторые плюшки
• https://github.com/rambler-ios
47
![Page 48: Чистая архитектура с VIPER / Сергей Крапивенский (Rambler&Co)](https://reader034.vdocuments.net/reader034/viewer/2022042502/58729f401a28ab07208b562f/html5/thumbnails/48.jpg)
Спасибо!serkrapiv
sergey.krapivenskiyrambler-ios