Что так здорово в redux?

Автор оригинала: FreeCodeCamp Community Member.

Джастин Фалькон

Redux элегантно обрабатывает сложные государственные взаимодействия, которые трудно выражать с помощью составного состояния реагирования. По сути, это система передачи сообщений, подобна, подобная в виде объектно-ориентированного программирования, но реализована как библиотека, а не на самом языке ¹. Как в OOP, redux инвертирует ответственность за контроль от вызывающего абонента к приемнику – интерфейс не напрямую манипулирует состояние, а скорее отправляет его сообщение для интерпретации.

Через эту линзу хранилище Redux является объектом, редукторы являются способами обработчиками, а действия являются сообщениями. Store.Dispatch ({Тип: "Foo", полезная нагрузка: "Бар"}) эквивалентно Ruby’s Store.send (: foo, "Бар") Отказ Промежуточное программное обеспечение используется примерно так же, как аспектно-ориентированное программирование (например, рельсы ‘ до_акция ) и реагировать – redux’s соединить Это зависимость впрыска.

Почему это желательно?

• Инверсия контроля, описанного выше, гарантирует, что пользовательский интерфейс не должен быть обновлен, если реализация переходов состояния изменяется. Добавление сложных особенностей, таких как ведение журнала, отмена или даже отладки для путешествий, почти тривиальны. Интеграционные тесты – это просто вопрос тестирования, что правильное действие отправляется; Остальные могут быть тестированы на единицу.
• Состояние компонента Rect React является довольно неуклюжем для состояния, которое касается нескольких частей вашего приложения, такого как пользовательская информация и уведомления. Redux дает вам государственное дерево, которое независимо от вашего пользовательского интерфейса, чтобы справиться с этими проблемами поперечной резки. Кроме того, наличие вашего государства живут за пределами пользовательского интерфейса, упрощает все, что упростите – вам нужно только иметь дело с сериализацией до местного узла или URL в одном месте.
• Титульные «редукторы» redux обеспечивают невероятную гибкость для обработки действий – состав, множественная рассылка, даже method_missing -пинсовый разбор.

Это все необычные случаи. А как насчет общих случаев?

Ну, есть проблема.

• Действие мог бы быть интерпретированным как сложный государственный переход, но большинство из них устанавливают одно значение. Приложения Redux имеют тенденцию заканчивать кучу действий, которые устанавливают одно значение; Там есть отдельное напоминание о настройке вручную вручную функционировать в Java.
• Фрагмент государства мог бы использоваться по всему приложению, но большинство карт состояний 1: 1 с одной частью пользовательского интерфейса. Положить это состояние в Redux вместо компонентного состояния, просто добавляет косвенное управление без абстракция Отказ
• Функция редуктора мог бы Делайте все виды метапрограммирования странности, но в большинстве случаев это просто односпальная отправка на поле типа действия. Это хорошо на языках, таких как Elm и Erlang, где сопоставление образец раздевается и высоко выразительна, но довольно неуклюжем в JavaScript с Переключатель заявления.

Но действительно то, что, когда вы проводите все свое время, делаете бойную таблицу для общих случаев, вы забываете, что лучшие решения для особых случаев даже существовать . Вы сталкиваетесь с сложным переходом состояний и решаете его с помощью функции, которая рассылает десятую разные действия. Вы дублируете состояние в редукторе, а не распределить единый государственный кусочек по приложению. Вы копируете и вставьте переключатели в нескольких редукторах вместо того, чтобы абстрагировать его в общие функции.

Легко уволить это как простой «Операторская ошибка» – они не RTFM, плохой мастером обвиняет свои инструменты – но частота этих проблем должна поднять некоторые проблемы. Что он говорит о инструменте, если большинство людей используют это неправильно?

Так что я должен просто избежать Redux для общих случаев и сохранить его для специальных?

Это совет, когда команда Redux даст вам – и это совет, который я даю своим собственным членам команды: я говорю им, чтобы избежать его, пока использование SetState не становится действительно несостоятельным. Но я не могу принести себе, чтобы следовать за своими собственными правилами, потому что всегда есть некоторые Причина, по которой вы хотите использовать Redux. У вас может быть куча set_ $ foo Действия, но установление любого значения Также Обновляет URL или сбрасывает еще немного временного значения. Может быть, у вас есть ясно 1: 1 отображение состояния на UI, но вы Также хочу иметь лесозаготовку или отменить.

Правда в том, что я не знаю, как писать, намного меньше Учить , “Хороший redux. ” Каждое приложение, на котором я работал, полон этих redux Antipatterns, либо потому, что я не мог подумать о лучшем решении сам, или потому что я не мог убедить своих товарищей по команде изменить его. Если код redux “Expert” является посредственным, какая надежда у новичка? Во всяком случае, я просто пытаюсь уравновесить преобладать «redux все вещи!» Подход в надежде, что они смогут понять Redux на своих условиях.

Так что я делаю в этом случае?

К счастью, Redux достаточно гибкий, чтобы сторонние библиотеки могли интегрировать с ним, чтобы обработать общие случаи – Jumpstate Например. И быть понятным, я не думаю, что это неправильно для Redux сосредоточиться на материалах низкого уровня. Но аутсорсинг этих основных особенностей третьим лицам создает дополнительную когнитивную нагрузку и возможность для Bikeshedding – каждому пользователю необходимо по существу строить свои собственные рамки из этих частей.

Некоторые люди в такие вещи.

И я один из них! Но не все. Я лично люблю redux и использую его только для всего, что я делаю, но я также Любовь пробуя новых конфигураций WebPack. Я не представитель общего населения. Я Уполномочен Гибкостью написать свои собственные абстракции на вершине redux, но Насколько уполномочена я по абстракциям, написанным некоторым старшим инженером, который никогда не задокументировал их и выйдет шесть месяцев назад?

Это вполне возможно никогда не Сталкиваются с тяжелыми проблемами, которые redux особенно хорош при обращении, особенно если вы младший в команде, где эти билеты идут на более старших инженеров. Ваш опыт redux – это «эта странная библиотека, которую все используют, где вы должны написать все три раза. ” Redux достаточно просто, чтобы вы может Используйте его механически, без глубокого понимания, но это радостный и нерный опыт.

Это возвращает меня к вопросу, которое я поднял ранее: что он говорит о инструменте, если большинство людей используют это неправильно? Качественный инструмент для рук не просто полезен и долговечен – это приятно использовать. Самое удобное место для удержания, это правильное место для его удержания. Он разработан не только для своей задачи, но и его пользователем. Инструмент качества отражает эмпатию инструментов для подставки.

Где наше сочувствие? Почему «ты делаешь это неправильно» нашей реакцией, а не «мы могли бы сделать это легче использовать»?

Существует связанное явление в круговых кругах функциональных программиров, мне нравится называть Проклятие монадского учебного пособия : Объяснение того, как они работают, это тривиально, но объяснение того, почему они ценны, удивительно сложно.

Вы серьезно бросаете монадский учебник в середине этого поста?

Монады – это общий рисунок в Haskell, который используется для работы с широким спектром вычислений – списков, обработки ошибок, состояния, времени, IO. Там синтаксический сахар, в виде сделать Обозначение, что позволяет представить последовательности монадических операций таким образом, что выглядит вид, как императивный код, очень похоже на то, как генераторы в JavaScript могут сделать асинхронный код синхронно.

Первая проблема заключается в том, что описывая монады с точки зрения того, что они используются для неточного. Монады были введены в Haskell для обработки побочных эффектов и последовательных вычислений , но монады как абстрактная концепция не имеет ничего общего с побочными эффектами или последовательностями; Они являются набором правил для того, как пара функций должна взаимодействовать и не иметь присущей значения. Концепция ассоциативности относится к Арифметические и заданные операции и перечисление конкатенации и размножение NULL, но оно существует полностью независимо от них.

Вторая проблема заключается в том, что любой приятный пример монадического подхода к X является более многословным – и поэтому, по крайней мере, Визуально более сложный – чем императивный подход. Явные опции типы A лауреат Может быть безопаснее, чем проверка на неявную null Но приведут в более, уродливый код. Обработка ошибок с Либо Типы часто проще следовать, чем код, который может бросить От где угодно, но бросание, безусловно, более лаконирует, чем размножаться вручную ценности. И побочные эффекты – состояние, IO и т. Д. – тривиальны на императивном языке. Функциональные энтузиасты программирования (в комплекте) будут утверждать, что побочные эффекты являются Слишком легко На этих языках, но убедительно, что любой вид программирования слишком легко, это сложно продавать.

Настоящее значение видно только в масштабе макроса – не только что любое из этих случаев использования следует за законами монады, но все они следуют за то же самое законы. Набор операций, работающих в одном случае, может работать в каждый Корпус: Zaipping Пара списков в список пар – «То же самое», как объединение пары обещаний в одно обещание, которое завершает пару результатов.

Это где-то ходит?

Дело в том, что redux имеет такую же проблему – трудно научить не потому, что это сложно, а скорее, потому что это так простой Отказ Понимание не имеет значения, насколько целых знания, как доверять основной идее таким образом, что мы можем получить все остальное через индукцию.

Трудно поделиться этим пониманием, потому что основные идеи являются банальными трюизмами (избегайте побочных эффектов) или аннотация до точки бессмысленности ( (Prevstate, Action) = > Далее ели). Любой единственный конкретный пример не помогает; Они демонстрируют многословность Redux, не демонстрируя его выразительность.

Как только мы ✨Насметились », многие из нас немедленно забывают, что он чувствовал заранее. Мы забываем, что наше просветление пришло только через наши собственные неоднократные неудачи и недоразумения.

Так что вы предлагаете?

Я хотел бы, чтобы мы признаем, что у нас есть проблема. Redux – это просто, но это не легко Отказ Это допустимый выбор дизайна, но это, тем не менее, компромисс. Многие люди выиграют от инструмента, который торгует некоторой простоты для удобства использования. Но большие куски сообщества даже не признают, что компромисс был сделан!

Я думаю, что интересно контрастировать реагирование и redux, потому что в то время как реагировать значительно более сложный элемент программного обеспечения и имеет значительно большую поверхность API, она как-то проще в использовании и понимание. Единственные абсолютно необходимые API Особенности реагирования являются Отреагировать и Reactom.runder – Состояние, компонент жизненного цикла, даже события DOM могут быть обработаны в другом месте. Создание этих функций в реакцию сделало его более сложным, но они также сделали его Лучше Отказ

«Атомное состояние» – это абстрактная концепция, которая может сообщить вашу работу, как только вы понимаете, но SetState Это метод, который вы можете вызвать на компоненте реагирования, который делает управление атомным государством от вашего имени, понимаешь ли вы это или нет. Это не идеальное решение – это менее эффективно, чем замена государства прямо или мутирующее и принуждение обновления, и у него есть несколько пожеланий, когда он называется асинхронно – но реагировать значительно лучше с SetState как вызываемый метод, а не словарный термин.

Как команда Redux, так и сообщество – Сильно против расширения площади поверхности API redux Но нынешний подход приклеивания кучу крошечных библиотек вместе утомительно даже для экспертов и непостижимых для начинающих. Если Redux не сможет расширить, чтобы иметь встроенную поддержку для общих чехлов, ему нужна «благословенная» структура для этого места. Комбинезон Может быть хорошим началом – он обозначает концепции «действий» и «государства» в Callable функций, пока не сохраняя их многозначный характер – но фактическая библиотека не имеет значения, так как акт благословения.

Ирония во всем этом, что redux’s RION D’ETRE Является ли «опыт разработчика»: DAN построил Redux, потому что он хотел понять и воссоздать отладку в отладке ELM. Но поскольку он разработал свою собственную идентичность – поскольку он вырос в фактическую среду React Ecosystems de Facto OOP – он отказался от некоторых из этого ориентация на DX в обмен на конфигурируемость. Это позволило экосистему Redux Bloom, но есть заметное отсутствие, где должна быть гуманный, курируемая рамка. Мы, сообщество Redux, готовое создать его?

Благодаря Мэтью Маквикар , Куча мха , Эрик Дерево , Мэтт Дулеоне , а также Патрик Томсон для обзора.

Сноски:

[1] Почему вы делаете различие между React/JS и объектно-ориентированным программированием? JavaScript ориентирован на объект, просто не на основе классовых.

Объектно-ориентированное программирование, как функциональное программирование, является методологией, а не языковой функцией. Некоторые языки Поддержка Этот стиль лучше других или иметь стандартную библиотеку, которая предназначена для стиля, но если вы достаточно посвящены задаче, вы можете написать в объектно-ориентированном стиле на любом языке.

JavaScript имеет структуру данных, которая вызывает объект, а Большинство Значения на языке могут рассматриваться как объекты, в том смысле, что есть методы, которые вы можете вызвать каждое значение, кроме нулевой и undefined Отказ Но до того, как прокси пришел в ES6, каждый «метод» вызов на объекте был словарным поиском; foo.bar Всегда собирается найти свойство с именем «Бар» на Foo или ее цепочке прототипа. Контрастное это с языком, такими как Руби, где foo.bar Отправляет сообщение : бар foo – это сообщение может быть перехвачен и интерпретирован , это не должно быть поиском словаря.

Redux по существу является более медленным, но более сложной системой объекта в верхней части существующей JavaScript, где редукторы и промежуточное программное обеспечение действуют в качестве переводчиков и перехватчиков вокруг объекта JavaScript, который фактически содержит состояние. [ назад ]

Оригинал: “https://www.freecodecamp.org/news/whats-so-great-about-redux-ac16f1cc0f8b/”