Состояние приложения: через вселенные

Пример контрола: Grid
Поддержка источников данных, навигация(+виртуальная прокрутка), сортировка, поддержка иерархии, выбор записей, группировка, редактирование по месту, drag-n-drop, панель операций над записью(+ swipe), настройка заголовка таблицы, режим поиска, работа с клавиатурой, темы оформления и т.д. и т.п.

Timeline of JavaScript UI Frameworks

Single Page Application

Пример типового реестра

Давайте разбираться

Цикломатическая сложность

Чистые функции

Связность и зацепление

А судьи кто?

Any framework

Lifehack

Что не так с MVC?

Diagram of interactions within the MVC pattern

MVC/Flux
Controller
(dispatcher, action creator, action)
View
(page, containers, components)
Model
(store, reducers)
User .
action
send data
receive data
display

Типовые проблемы “MVC”?
Controller
(state, business logic)
View
(state, business logic, ui logic
Model
(state, business logic)
User .

Debug mode

Современный подход
View
View
View
View
Dispatch
Action
Dispatch
Action
Dispatch
Action
Dispatch
Action
Dispatch
Action
Dispatch
Action
Store fragmen
Store fragmen
Store fragmen
Store fragmen
Store fragmen
Store
Page

Как быть?
Нет

Увеличиваем связность, уменьшаем зацепление

Однонаправленный поток данных
Input
Output
Domain model
User .

Где состояние?

Особенности интерфейса СБИС

Глобальное состояние – singleton. Компоненты могут иметь множество экземпляров
Проблемы глобального состояния*
Жизненный цикл состояния отличается от жизненного цикла компонентов
Может быть большим

Компонентный подход

Prop drilling

Композиция и render props

Магия вне Хогвартса

Информация о пользователе
Глобальные хранилища
Права
Локализация
Настройки приложения
Пользовательские параметры

Проблемы юнит-тестирования singleton
С этим можно бороться.
Я создал несколько singleton’ов для хранения глобального состояния
Но как же ты пишешь юнит тесты?

Технологии устаревают очень быстро.
Не гонитесь за технологиями. Изучайте фундаментальные основы программирования. Чаще задавайте вопросы в стиле: «Как это работает?», набирайтесь опыта.
В заключение