Redux: Почему бы не поместить действия и редуктор в один файл?

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

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


javascript redux react-redux ecmascript-6
person pjivers    schedule 09.05.2016    source источник
comment
Релевантно: github.com/erikras/ducks-modular-redux   -  person zerkms    schedule 09.05.2016

Ответы (3)


arrow_upward
33
arrow_downward

От создателя Redux Дэна Абрамова:

Многие редюсеры могут обрабатывать одно действие. Один редуктор может обрабатывать множество действий. Объединение их вместе сводит на нет многие преимущества масштабирования приложений Flux и Redux. Это приводит к раздуванию кода и ненужной связи. Вы теряете гибкость реагирования на одно и то же действие из разных мест, и ваши создатели действий начинают действовать как «установщики», связанные с определенной формой состояния, тем самым связывая с ней и компоненты.

Из документов Redux:

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

См. эту беседу в Twitter и эта проблема на github для получения дополнительной информации.

person Shane Cavaliere    schedule 09.05.2016
comment
Многие редюсеры могут обрабатывать одно действие. ответил на мой вопрос. Спасибо. Но я не могу представить себе ситуацию, когда действие будет обрабатываться более чем одним редюсером. - person pjivers; 10.05.2016
comment
Представьте, что вы являетесь частью команды, работающей над приложением для управления аэропортом. Вы отвечаете за создание той части приложения, которая обрабатывает сообщения о статусе рейса. Другой разработчик работает над другой частью приложения, которая занимается планированием взлетов и посадок на взлетно-посадочных полосах. Эти две части приложения обрабатываются совершенно разными ветвями состояния Redux с разными редьюсерами. И вы, и другой разработчик пишете редюсеры, которые должны реагировать на действия FLIGHT_CANCEELLED для вашей конкретной части приложения, даже если ни один из вас не знает, что делает другой. - person Shane Cavaliere; 10.05.2016
comment
Ах хорошо! Теперь это имеет смысл. Вы бы сказали, что это что-то вроде шаблона pub-sub? - person pjivers; 10.05.2016
comment
На самом деле нет нескольких редюсеров, подписавшихся на что-либо. На самом деле это всего лишь один корневой редьюсер (который может быть составлен из других редюсеров, но это все равно одна функция), который устанавливается как currentReducer магазина при его создании или при вызове store.replaceReducer(). Когда действие отправляется, значок currentState магазина заменяется просто на currentState = currentReducer(currentState, action) . - person Shane Cavaliere; 10.05.2016
comment
Нет, я понимаю. Он просто напоминает pub-sub в том смысле, что отправка действия не зависит от того, как оно обрабатывается, и вы можете обрабатывать одно и то же действие на нескольких переключателях. - person pjivers; 11.05.2016
comment
Ах хорошо. Да, в этом смысле есть сходство. Но я бы не стал думать об этом таким образом, так как различий довольно много. Я бы сказал, что это больше похоже на простой шаблон Observer, в котором есть ровно один наблюдатель (currentReducer в магазине). Тот факт, что вы можете объединить другие редюсеры в корневой редьюсер, очень удобен, но на самом деле это не то же самое, что несколько наблюдателей. Полезно помнить, что все ваши составные редукторы в конечном итоге являются одна функция, которая получает каждое действие. - person Shane Cavaliere; 11.05.2016
comment
Многие редюсеры могут обрабатывать одно действие. Я никогда не думал об этом раньше. - person IVN; 17.06.2016
comment
1) Я еще не видел достаточно большого приложения React, которое использует общие действия для нескольких редьюсеров и 2) Почему тогда действия и редукторы обычно отображаются в виде папок на верхнем уровне. Такой вид побеждает всю цель разделения большого приложения на более мелкие части. - person abhijit; 11.01.2020
comment
@abhijit 1) Мне было бы любопытно, почему приложение, которому не нужны действия, отделенные от редюсеров, в первую очередь использует избыточность. 2) Я не думаю, что структура папок очень важна, если она непротиворечива. - person Shane Cavaliere; 15.01.2020

arrow_upward
0
arrow_downward

Хранение действий и редюсеров в отдельных файлах помогает сохранить модульность кода.

Может быть проще находить ошибки, расширять код и вообще работать над наименьшей возможной частью.

Пример:

Сохранение сообщений об ошибках API в хранилище Redux может быть полезным.

Если я забыл обновить хранилище с входящей ошибкой на одном из редукторов, это может быть сложно найти в нескольких файлах.

Если я просматриваю несколько редукторов в одном файле, будет легче увидеть, что в одном из них отсутствует строка error: action.payload.

person tjr226    schedule 29.02.2020

arrow_upward
0
arrow_downward

Пожалуйста, СДЕЛАЙТЕ это, если хотите. Тот, кто говорит что-то иное, не знает, что вам нравится, а что нет. Люди, которые во всем цитируют Дэна Абрамова (просто хорошего разработчика), просто безмозглые овцы.

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

Это ужасный опыт разработки для обновления типов, действий, редукторов, операций (thunk/saga) для выполнения запроса POST. Люди, которые по своей природе медлительны, могут поддерживать такие вещи, поскольку они не видят последствий.

person bugwheels94    schedule 26.01.2021