Reactjs Redux应该为状态树中的每个对象创建子reducer吗？

Question

Reactjs Redux应该为状态树中的每个对象创建子reducer吗？

Zal*_*oza 5 design-patterns flux reactjs redux

redux app就我所知,维护状态树的正确方法是将其标准化,尽可能地展开数据并使用combinereducer创建状态树的切片.

示例包含帖子和用户的应用程序

const rootReducer = combineReducers({
  user:userReducer,
  posts:postsReducer,
});
const store = createStore(rootReducer);

Run Code Online (Sandbox Code Playgroud)

给出的帖子数组保留所有帖子初始化,State.posts可以看起来像

let initialState =   {
    byId:{1:{id:1,title:'post1'}},
    ids:[1],
    meta_data:{unread:1,old:0}
    }

Run Code Online (Sandbox Code Playgroud)

现在,如果我们有大约10,000个帖子,我们最终会这样做,state.post.ids.length === 10000这很好,

问题是.因为我们的reducer 每次需要更新时返回一个新状态,例如我们需要将meta_data.unread更新为等于0,我们将返回一个新的Post对象.

return object.assign({},state,{meta_data:{unread:0,old:1}})

Run Code Online (Sandbox Code Playgroud)

这将重新渲染使用state.post树的任何属性的所有选择器和组件!

这听起来像是一个问题吗？**我们想要的只是更新未读的计数器..为什么要重新计算帖子的所有选择器和组件？

所以我有这个想法可能是state.posts也应该组成使用combineReducers使每个attr.帖子应该有自己的减速器.

将postsReducer分成多个

postsMainReducer, ==> deal with adding or removing posts
postMeta_dataReducer, ==> deal with meta_data of posts
singlePostReducer ==> Now this is dynamic !! how can i create such ??

Run Code Online (Sandbox Code Playgroud)

这是正确的吗？我增加了比需要更多的复杂性？

- >有人可以向我们展示已经运行的企业应用程序状态树的图片吗？所以我们可以从中学习如何组织国家？

Answer 1

Md.*_*med 3

\n
需要注意的是，Redux 存储实际上只有一个减速器函数。存储将当前状态和分派操作传递给该减速器函数，并让减速器适当地处理事情。
\n\n
显然，仅仅在函数大小和可读性方面，尝试在单个函数中处理每个可能的操作并不能很好地扩展，因此将实际工作拆分为可由顶级减速器调用的单独函数是有意义的。特别是，常见的建议模式是拥有一个单独的子缩减器函数，负责管理特定键上特定状态片的更新。Redux 附带的 mergeReducers() 是实现这一目标的众多可能方法之一。它还强烈建议您保持商店状态尽可能平坦和规范化。但最终，您负责以您想要的任何方式组织您的减速器逻辑。
\n\n
然而，即使你碰巧有许多不同的独立子减速器，甚至有深度嵌套的状态，减速器速度也不太可能成为问题。JavaScript 引擎能够每秒运行大量函数调用，并且大多数子减速器可能只是使用 switch 语句并默认返回现有状态以响应大多数操作。
\n\n
如果您确实关心减速器性能，则可以使用诸如 redux-ignore（https://github.com/omnidan/redux-ignore）或 reduxr-scoped-reducer（https://github.com/chrisdavies ）之类的实用程序/reduxr-scoped-reducer）以确保只有某些减速器侦听特定操作。您还可以使用 redux-log-slow-reducers( https://github.com/michaelcontento/redux-log-slow-reducers）进行一些性能基准测试。
\n

\n\n

以下是我最常参考的项目 -

\n\n

这些是 Redux 的实际用途。

\n\n

这是一些链接：

\n\n

https://github.com/andrewngu/sound-redux

\n\n

https://github.com/echenley/react-news

\n\n

https://github.com/paulhoughton/remember/