Какова реальная разница между редуксом и конечным автоматом (например, xstate)?

Question

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

Мы решили, что, очевидно, нам нужно реализовать какой-то контейнер состояний для этого приложения.в рамках дальнейшего рефакторинга.Ранее у меня был некоторый опыт работы с redux и с магазином ngrx (который фактически следует тем же принципам).

Redux - вариант для нас, но один из разработчиков предложил использовать конечный автомат,в частности, библиотека xstate .

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

Я часами пытался найти ответ или любую другую информацию, связанную со сравнением xstate и redux, или с некоторыми "за и против".К сожалению, у меня в голове беспорядок.Я не нашел никакой четкой информации, за исключением некоторых статей, таких как «переход от редукса к конечному автомату» или ссылок на библиотеки, ориентированные на совместное использование redux и xstate , и это окончательно сломалось.меня.

Если кто-то может описать разницу или сказать мне, когда разработчики должны выбрать xstate - милости просим.

Спасибо.

Answer 1

Конечный автомат не сообщает (не заставляет) иметь однонаправленный поток данных.Это не имеет ничего общего с потоком данных.Это больше о ограничениях изменений состояния и о переходах состояний .Таким образом, обычно только некоторые части приложения будут создаваться с помощью конечных автоматов, и только если вам нужно ограничить / запретить некоторые изменения состояния, и вы заинтересованы в переходах.

Остерегайтесь того, что с конечными автоматами, если по какой-то причине (зависимость от внешнего API и т. Д.), Есть вероятность, что приложение может быть заблокировано в состоянии, когда оно не может перейти в другое состояние из-за ограничений,Вы должны решить его.

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

---

С другой стороны, Redux - это Структура однонаправленной архитектуры .Однонаправленные архитектуры обеспечивают единую направленность потока данных.В Redux он начинается с User->View->(Action)->Store->Reducer->(Middleware)->Store->(State)->View.Подобно State Machines, вы можете запускать побочные эффекты с помощью Middlewares в Redux.Вы можете ограничить / запретить переходы состояний, если хотите. В отличие от конечного автомата , Redux вызывает однонаправленный поток данных, pure !функции редуктора, неизменяемые объекты состояния, одно наблюдаемое состояние приложения.

Answer 2

Я создал XState, но я не собираюсь говорить вам, следует ли использовать один поверх другого;это зависит от вашей команды.Вместо этого я попытаюсь выделить некоторые ключевые различия.

• Redux - это, по сути, контейнер состояния, в котором события (называемые actions в Redux) отправляются редуктору, который обновляет состояние.
• XState также является контейнером состояний, но он отделяет конечное состояние (например, "loading", "success") от "бесконечного состояния" или контекста (например, items: [...]).
• Redux не определяет, как вы определяете ваши редукторы.Это простые функции, которые возвращают следующее состояние, учитывая текущее состояние и событие (действие).
• XState является «редуктором с правилами» - вы определяете законные переходы между конечными состояниями из-за событий, а также какие действия должныбыть выполненным при переходе (или при входе / выходе из состояния)
• Redux не имеет встроенный способ обработки побочных эффектов.Существует много опций сообщества, таких как redux-thunk, redux-saga и т. Д.
• XState делает действия (побочные эффекты) декларативными и явными - они являются частью объекта State, который возвращается при каждом переходе(текущее состояние + событие).
• В настоящее время Redux не имеет возможности визуализировать переходы между состояниями, поскольку он не различает конечное и бесконечное состояния.
• XState имеет визуализатор: https://statecharts.github.io/xstate-viz, что возможно благодаря декларативной природе.
• Неявная логика / поведение, представленное в редукторах Redux, не может быть декларативно сериализовано (например, в JSON)
• машинные определения XState, которые представляютлогику / поведение, можно сериализовать в JSON и читать из JSON.Это делает поведение очень переносимым и настраиваемым внешними инструментами.
• Redux не является строго конечным автоматом.
• XState строго придерживается спецификации W3C SCXML: https://www.w3.org/TR/scxml/
• Reduxполагается на то, что разработчик вручную предотвращает невозможные состояния.
• XState использует диаграммы состояний для естественного определения границ для обработки событий, что предотвращает невозможные состояния и может подвергаться статическому анализу.
• Redux поощряет использование одного, «глобальное» атомарное хранилище.
• XState поощряет использование подхода, подобного модели актера, где может быть много экземпляров иерархической диаграммы состояний / «службы», которые взаимодействуют друг с другом.

Я добавлю больше ключевых отличий в документы на этой неделе.