Чистая архитектура с VIPER

- Что такое "чистая" архитектура приложений. Чем грозит "грязная" архитектура, чем от нее отличается "чистая" архитектура, и какой от нее профит.
- История появления VIPER.
- Идея VIPER. Как изменяется структура приложения при применении этого подхода.
- Опыт использования VIPER в Rambler&Co. Что мы изменили и добавили.
- Работа с VIPER на примере user story из реального приложения.
- Выводы: чем помогает VIPER и когда его использовать не стоит.

Transcript

1. Чистая архитектура с VIPER Сергей Крапивенский, ведущий iOS-разработчик Rambler&Co
2. Кто мы такие вообще • Rambler & Co - группа компаний • Рамблер, Афиша, Lenta.ru, Livejournal, Чемпионат и т.д. • Около 25 разработчиков под iOS • Все мобильные проекты стекаются к нам 2
3. Грязная архитектура 3
4. Грязная архитектура • Огромные классы с кучей ответственностей • Сильная связанность компонентов • Трудно дебажить • Трудно вносить изменения • Невозможно покрыть тестами • Хочется все сжечь ! 4
5. Чистая архитектура • Простые компоненты с четкими обязанностями • Слабая связанность • Легко покрывается тестами • Легко вносить изменения • Просто понять 5
6. MVC от Apple: ожидание 6
7. MVC от Apple: реальность 7
8. MVC от Apple 8
9. Как появился VIPER 9 08.2012 12.2013 06.2014 05.2015 2014-2015
10. Как появился VIPER 10 08.2012 12.2013 06.2014 05.2015 2014-2015
11. Как появился VIPER 11 08.2012 12.2013 06.2014 05.2015 2014-2015
12. Как появился VIPER 12 08.2012 12.2013 06.2014 05.2015 2014-2015
13. Как появился VIPER 13 08.2012 12.2013 06.2014 05.2015 2014-2015
14. Идея VIPER • Приложение разбивается на блоки с однотипной структурой • Принцип разбиения — по user story • User story описывает поведение приложения 14
15. User story Пример — лента фото в Instagram Задача — отобразить последние фото друзей При необходимости можно перейти на другие истории 15
16. User story Список лайков к нашим фото — другая история Это простые примеры: 1 экран = 1 история 16
17. User story На одном экране может быть несколько разных историй 17
18. User story На одном экране может быть несколько разных историй 1. Лента фотографий 18 1. Лента фотографий 2. Таб-бар для переключения ленты 3. Панель с информацией о пользователе
19. User story На одном экране может быть несколько разных историй 1. Лента фотографий 2. Таб-бар для переключения ленты 19 1. Лента фотографий 2. Таб-бар для переключения ленты 3. Панель с информацией о пользователе
20. User story На одном экране может быть несколько разных историй 1. Лента фотографий 2. Таб-бар для переключения ленты 3. Панель с информацией о пользователе 20
21. Действия модуля • Получает данные • Преобразовывает данные для отображения • Реагирует на действия пользователя • Переходит на другие модули при необходимости 21
22. Канонический модуль VIPER E PRESENTER VIEW INTERACTOR WIREFRAME E 22
23. E PRESENTER VIEW INTERACTOR WIREFRAME E 23 Канонический модуль VIPER Отображает на экране полученные данные Информирует модуль о действиях пользователя
24. E PRESENTER VIEW INTERACTOR WIREFRAME E 24 Канонический модуль VIPER Содержит всю логику работы с данными
25. E PRESENTER VIEW INTERACTOR WIREFRAME E 25 Канонический модуль VIPER Подготавливает данные для отображения View Обрабатывает действия пользователя
26. E PRESENTER VIEW INTERACTOR WIREFRAME E 26 Канонический модуль VIPER Отвечает за навигацию модуля Инициализирует модуль и инжектирует зависимости
27. E PRESENTER VIEW INTERACTOR WIREFRAME E 27 Канонический модуль VIPER Простые модельные объекты Не содержат никакой логики
28. Что мы изменили? • Разделили Wireframe • Добавили слой сервисов • Сделали View слоем • Формализовали переходы между модулями • Написали тулзу для кодогенерации 28
29. Разделили Wireframe • Wireframe не удовлетворяет SRP • Wireframe = Router + Assembly • Router отвечает за навигацию • Assembly отвечает за сборку модуля • Dependency Injection с помощью Typhoon Framework • https://github.com/appsquickly/Typhoon 29
30. Добавили слой сервисов • “Вся бизнес логика” звучит страшно " • Сервисы — слой ниже интерактора • 1 сервис = 1 тип сущностей (новости, сообщения, etc) • Сервисы можно переиспользовать в разных модулях • Сервисы зависят от объектов нижнего уровня 30
31. Слой View • Тяжелое наследие UIViewController • Работа с коллекциями не должна быть во View • Layout и анимации можно вынести из View • Эти задачи относятся к отображению данных • Так View превратился в слой 31
32. Переходы между модулями • То, о чем никто не говорит # • У каждого модуля есть <ModuleInput> и <ModuleOutput> • Эти протоколы реализует презентер • Пример: переход из модуля А в модуль B • Роутер модуля А передает данные в презентер модуля B • Презентер модуля B возвращает результат в презентер модуля А 32
33. Кодогенерация • С VIPER нужно создать кучу классов • Каркас всех модулей однотипен • Руками создавать долго и сложно • Программисту лень писать руками? Нужен скрипт • Generamba! • https://github.com/rambler-ios/Generamba 33
34. Что у нас получилось 34
35. Что у нас получилось 35
36. Афиша.Рестораны Категории ресторанов Рестораны в категории Экран ресторана 36
37. VIEW Категории ресторанов STORYBOARD segue VIEW Рестораны в категории instantiate 38
38. VIEW Категории ресторанов STORYBOARD segue VIEW Рестораны в категории instantiate ASSEMBLY build 39
39. VIEW Категории ресторанов segue VIEW Рестораны в категории INTERACTOR PRESENTER ROUTER SERVICE 40
40. VIEW Рестораны в категории INTERACTOR PRESENTER ROUTER SERVICE VIEW Экран ресторана INTERACTOR PRESENTER ROUTER SERVICE categoryId restaurants (Core Data) restaurantId restaurant (Core Data) restaurant (PONSO) restaurants (PONSO) 41
41. VIEW Рестораны в категории INTERACTOR PRESENTER ROUTER SERVICE VIEW Экран ресторана INTERACTOR PRESENTER ROUTER SERVICE categoryId restaurants (Core Data) restaurantId restaurant (Core Data) restaurant (PONSO) restaurants (PONSO) 41
42. VIEW Рестораны в категории INTERACTOR PRESENTER ROUTER SERVICE VIEW Экран ресторана INTERACTOR PRESENTER ROUTER SERVICE categoryId restaurants (Core Data) restaurantId restaurant (Core Data) restaurant (PONSO) restaurants (PONSO) 41
43. VIEW Рестораны в категории INTERACTOR PRESENTER ROUTER SERVICE VIEW Экран ресторана INTERACTOR PRESENTER ROUTER SERVICE categoryId restaurants (Core Data) restaurantId restaurant (Core Data) restaurant (PONSO) restaurants (PONSO) 41
44. VIEW Рестораны в категории INTERACTOR PRESENTER ROUTER SERVICE VIEW Экран ресторана INTERACTOR PRESENTER ROUTER SERVICE categoryId restaurants (Core Data) restaurantId restaurant (Core Data) restaurant (PONSO) restaurants (PONSO) 41
45. VIEW Рестораны в категории INTERACTOR PRESENTER ROUTER SERVICE VIEW Экран ресторана INTERACTOR PRESENTER ROUTER SERVICE categoryId restaurants (Core Data) restaurantId restaurant (Core Data) restaurant (PONSO) restaurants (PONSO) 41
46. VIEW Рестораны в категории INTERACTOR PRESENTER ROUTER SERVICE VIEW Экран ресторана INTERACTOR PRESENTER ROUTER SERVICE categoryId restaurants (Core Data) restaurantId restaurant (Core Data) restaurant (PONSO) restaurants (PONSO) 41
47. VIEW Рестораны в категории INTERACTOR PRESENTER ROUTER SERVICE VIEW Экран ресторана INTERACTOR PRESENTER ROUTER SERVICE categoryId restaurants (Core Data) restaurantId restaurant (Core Data) restaurant (PONSO) restaurants (PONSO) 41
48. VIEW Рестораны в категории INTERACTOR PRESENTER ROUTER SERVICE VIEW Экран ресторана INTERACTOR PRESENTER ROUTER SERVICE categoryId restaurants (Core Data) restaurantId restaurant (Core Data) restaurant (PONSO) restaurants (PONSO) 41
49. VIEW Рестораны в категории INTERACTOR PRESENTER ROUTER SERVICE VIEW Экран ресторана INTERACTOR PRESENTER ROUTER SERVICE categoryId restaurants (Core Data) restaurantId restaurant (Core Data) restaurant (PONSO) restaurants (PONSO) 41
50. VIEW Рестораны в категории INTERACTOR PRESENTER ROUTER SERVICE VIEW Экран ресторана INTERACTOR PRESENTER ROUTER SERVICE categoryId restaurants (Core Data) restaurantId restaurant (Core Data) restaurant (PONSO) restaurants (PONSO) 41
51. VIEW Рестораны в категории INTERACTOR PRESENTER ROUTER SERVICE VIEW Экран ресторана INTERACTOR PRESENTER ROUTER SERVICE categoryId restaurants (Core Data) restaurantId restaurant (Core Data) restaurant (PONSO) restaurants (PONSO) 41
52. VIEW Рестораны в категории INTERACTOR PRESENTER ROUTER SERVICE VIEW Экран ресторана INTERACTOR PRESENTER ROUTER SERVICE categoryId restaurants (Core Data) restaurantId restaurant (Core Data) restaurant (PONSO) restaurants (PONSO) 41
53. VIEW Рестораны в категории INTERACTOR PRESENTER ROUTER SERVICE VIEW Экран ресторана INTERACTOR PRESENTER ROUTER SERVICE categoryId restaurants (Core Data) restaurantId restaurant (Core Data) restaurant (PONSO) restaurants (PONSO) 41
54. VIEW Рестораны в категории INTERACTOR PRESENTER ROUTER SERVICE VIEW Экран ресторана INTERACTOR PRESENTER ROUTER SERVICE categoryId restaurants (Core Data) restaurantId restaurant (Core Data) restaurant (PONSO) restaurants (PONSO) 41
55. VIEW Рестораны в категории INTERACTOR PRESENTER ROUTER SERVICE VIEW Экран ресторана INTERACTOR PRESENTER ROUTER SERVICE categoryId restaurants (Core Data) restaurantId restaurant (Core Data) restaurant (PONSO) restaurants (PONSO) 41
56. VIEW Рестораны в категории INTERACTOR PRESENTER ROUTER SERVICE VIEW Экран ресторана INTERACTOR PRESENTER ROUTER SERVICE categoryId restaurants (Core Data) restaurantId restaurant (Core Data) restaurant (PONSO) restaurants (PONSO) 41
57. VIEW Рестораны в категории INTERACTOR PRESENTER ROUTER SERVICE VIEW Экран ресторана INTERACTOR PRESENTER ROUTER SERVICE categoryId restaurants (Core Data) restaurantId restaurant (Core Data) restaurant (PONSO) restaurants (PONSO) 41
58. VIEW Рестораны в категории INTERACTOR PRESENTER ROUTER SERVICE VIEW Экран ресторана INTERACTOR PRESENTER ROUTER SERVICE categoryId restaurants (Core Data) restaurantId restaurant (Core Data) restaurant (PONSO) restaurants (PONSO) 41
59. Чистая архитектура • Простые компоненты с четкими обязанностями • Слабая связанность • Легко покрывается тестами • Легко подвергается изменениям • Просто понять 47
60. Rambler $ VIPER • Рамблер.Конференции — open-source приложение • Generamba — кодогенератор • VIPER McFlurry — набор полезных утилит • The Book Of VIPER — все, что мы знаем о VIPER • И еще некоторые плюшки • https://github.com/rambler-ios 48
61. Спасибо! serkrapiv sergey.krapivenskiy rambler-ios