,
9 tweets,
3 min read
Read on Twitter
#день2 Практика data-driven UI.
Собирать Props это самое сложное во всей практике. Будьте готовы к тому что вам будет неудобно довольно долго.
Использование enum (sealed class, union type) это обычное дело. Для людей которые не привыкли так моделировать - это challenge.
Собирать Props это самое сложное во всей практике. Будьте готовы к тому что вам будет неудобно довольно долго.
Использование enum (sealed class, union type) это обычное дело. Для людей которые не привыкли так моделировать - это challenge.
Props могут передавать не только состояния, но и обратную связь. Для этого используется абстракция Command. По сути своей это обертка над произвольным лямбда выражением. Для Android это еще дает мостик от async / await к главному потоку. 
Команды могут быть опциональными, тогда состояние UI кнопки легко привязать к тому есть команда или нет.
В этом примере кнопка login может появится только когда там появится команда.
В этом примере кнопка login может появится только когда там появится команда.
Props должны быть локальными. Это значит что у каждого UI они свои, и не имеют нечего общего с другими экранами. Даже если они похожи на 90%. Дублирование кода используется как буфер для изменений. Это позволяет вносить изменения и не ломать другие модули.
Рендеринг Props это одна функция. Я не рекомендую разбивать эту функцию на несколько. Большие функции могут быть признаком плохого кода, но позволяют быстрее вносить изменения. Тем более, что всю логику мы уже оставили за бортом (там где создавали Props)
Рендеринг может учитывать старые Props. Обычно это применяется для оптимизации в тех местах где UIKit / Android перерисовывается слишком часто. Обычно это нужно в сложных таблицах.
Анимации отдаются на откуп рендереру. Функция рендеринга смотрит на то как изменились Props и запускает / останавливает анимации.
Тестировать рендеринг можно через snapshot tests. UI рендерит пропсы, делает фотографию того что получилось и сравнивает с оригиналом. Стоят такие тесты дорого, часто дают ложно-положительные срабатывания. Подходят для очень мачурных продуктов, где UI не меняется просто так.
Альтернатива - Storybook (storybook.js.org).
Это отдельный режим работы приложения где можно посмотреть на то как разные экраны рисуют разные Props.
Бонусом идет быстрая отладка анимаций, и очень короткий цикл проверки правок UI кода.
Это отдельный режим работы приложения где можно посмотреть на то как разные экраны рисуют разные Props.
Бонусом идет быстрая отладка анимаций, и очень короткий цикл проверки правок UI кода.
