Redux & RxJS, любые сходства?

Ответ 1

Короче говоря, они очень разные библиотеки для самых разных целей, но да есть некоторые неопределенные сходства.

Redux - это инструмент для управления состоянием во всем приложении. Он обычно используется как архитектура для пользовательских интерфейсов. Подумайте об этом как о альтернативе (половине) Angular.

RxJS - библиотека реактивного программирования. Он обычно используется как инструмент для выполнения асинхронных задач в JavaScript. Подумайте об этом как о альтернативе Promises.

Реактивное программирование - это парадигма (способ работы и мышления), где изменения данных наблюдаются с расстояния. Данные не изменяются с расстояния.

Вот пример изменения с расстояния:

// In the controller.js file
model.set('name', 'George');

Модель изменена с контроллера.

Вот пример наблюдаемого с расстояния:

// logger.js
store.subscribe(function (data) {
    console.log(data);
});

В Logger мы наблюдаем изменения данных, которые происходят в магазине (на расстоянии) и записываются на консоль.

Redux использует реактивную парадигму чуть-чуть: магазин реагирует. Вы не устанавливаете его контент на расстоянии. Вот почему в Redux нет store.set(). Магазин наблюдает действия на расстоянии и меняет себя. И Магазин позволяет другим наблюдать свои данные с расстояния.

RxJS также использует реактивную парадигму, но вместо того, чтобы быть архитектурой, она дает вам базовые строительные блоки Observables для выполнения этого шаблона "наблюдения с расстояния".

В заключение, очень разные вещи для разных целей, но поделитесь некоторыми идеями.

Ответ 2

Они очень разные вещи.

RxJS может использоваться для интерактивного программирования и представляет собой очень тщательную библиотеку с более чем 250 операторами.

И Redux, как описано в github repo, "Redux - это предсказуемый контейнер состояний для приложений JavaScript".

Redux - это просто инструмент для управления состоянием в приложениях. Но в сравнении вы могли бы создать полноценное приложение только в RxJS.

Надеюсь, что это поможет:)

Ответ 3

Вы можете "реализовать" Redux в одной строке RxJS. Если вы думаете о Rx по другим причинам (для скина promises, чтобы использовать его на сервере и клиенте), пропустите Redux и перейдите все Rx.

Ответ 4

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

Я сопоставил каждый тип действия экземпляру Subject. Каждый компонент состояния имеет объект, который затем отображается в функцию редуктора. Все редукционные потоки объединяются с merge, а затем scan выводит состояние. Значение по умолчанию устанавливается startWith непосредственно перед scan. Я использовал publishReplay(1) для состояний, но позже мог удалить его.

Реальная чистая функция рендеринга будет состоять только в том месте, где вы создаете данные о событиях, отправив всем производителям/субъектам.

Если у вас есть дочерние компоненты, вам нужно описать, как эти состояния объединяются в ваши. combineLatest может быть хорошей отправной точкой для этого.

Заметные различия в реализации:

• Нет промежуточного программного обеспечения, только операторов rxjs. Я думаю, что это самая большая сила и слабость. Вы все еще можете брать концепции, но мне трудно получить помощь от таких сестринских сообществ, как redux и cycle.js, поскольку это еще одно специализированное решение. Вот почему мне нужно написать "Я" вместо "мы" в этом тексте.

• Никаких переключателей/строк или строк для типов действий. У вас более динамичный способ разделения действий.

• rxjs может использоваться как инструмент в другом месте и не содержится в управлении состоянием.

• Меньше числа производителей, чем типы действий (?). Я не уверен в этом, но вы можете иметь много реакций в родительских компонентах, которые прослушивают дочерние компоненты. Это означает менее императивный код и меньшую сложность.

• У вас есть решение. Никакой рамки не требуется. Хорошо и плохо. В любом случае вы в конечном итоге напишите свою собственную фреймворк.

• Это гораздо больше фракталов, и вы можете легко подписаться на изменения с поддерева или на несколько частей дерева состояний приложения.

  • Угадай, как легко делать эпопеи, как делать редукции? Очень просто.

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

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

Здесь представлен более продвинутый, но небольшой фрагмент, в котором файл state.ts создает поток состояний. Это состояние компонента ajax-формы, которое получает объект полей (входов) с правилами проверки и стилями css. В этом файле мы просто используем имена полей (ключи объектов) для объединения всех дочерних состояний в состояние формы.

export default function create({
  Observable,
  ajaxInputs
}) {
  const fieldStreams = Object.keys(ajaxInputs)
  .map(function onMap(fieldName) {
    return ajaxInputs[fieldName].state.stream
    .map(function onMap(stateData) {
      return {stateData, fieldName}
    })
  })

  const stateStream = Observable.combineLatest(...fieldStreams)
  .map(function onMap(fieldStreamDataArray) {
    return fieldStreamDataArray.reduce(function onReduce(acc, fieldStreamData) {
    acc[fieldStreamData.fieldName] = fieldStreamData.stateData
    return acc
  }, {})
  })

  return {
    stream: stateStream
  }
}

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

Ответ 5

Короче говоря:

Redux: библиотека, вдохновленная Flux, используемая для государственного управления.

RxJS: Это еще одна библиотека Javascript, основанная на философии реактивного программирования, используемая для работы с "потоками" (Observables и т.д.) [Прочитайте о Reactive Programming, чтобы понять концепции Stream].

Ответ 6

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

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

Где RxJS и Redux перехватывает? В приставке вы обновляете свое состояние с помощью действий, и, очевидно, эти действия можно рассматривать как потоки. Используя промежуточное программное обеспечение, такое как наблюдаемый при редуксе (вам не нужно), вы можете реализовать свою так называемую "бизнес-логику" реактивным способом. Другое дело, что вы можете создать наблюдаемое из вашего магазина приставок, что иногда может быть проще, чем использование энхансера.