Welcome to OStack Knowledge Sharing Community for programmer and developer-Open, Learning and Share
Welcome To Ask or Share your Answers For Others

Categories

0 votes
340 views
in Technique[技术] by (71.8m points)

javascript - Redux - 多家商店,为什么不呢?(Redux - multiple stores, why not?)

As a note: I've read the docs for Redux (Baobab, too), and I've done a fair share of Googling & testing.(作为一个注释:我已经阅读了Redux的文档(Baobab也是如此),并且我已经做了很多Google搜索和测试。)

Why is it so strongly suggested that a Redux app have only one store?(为什么Redux应用程序只有一个商店?) I understand the pros/cons of a single-store setup vs a multiple store setup ( There are many Q&A on SO on this subject ).(我理解单店设置与多店设置的优缺点( 在此主题上有很多关于SO的问答 )。) IMO, this architectural decision belongs to the app developers based on their projects' needs.(IMO,这个架构决策属于应用程序开发人员根据他们的项目需求。) So why is it so strongly suggested for Redux, almost to the point of sounding mandatory ( though nothing is stopping us from making multiple stores )?(那么为什么Redux如此强烈建议,几乎到了强制性的声音( 虽然没有什么能阻止我们制作多个商店 )?) EDIT: feedback after converting to single-store(编辑:转换为单店后的反馈) After a few months working with redux on what many would consider a complex SPA, I can say that the single store structure has been a pure delight to work with.(在使用redux处理许多人认为复杂的SPA之后几个月,我可以说单一商店结构一直是一种纯粹的乐趣。) A few points that might help others understand why single store vs many store is a moot question in many, many use-cases:(有几点可能有助于其他人理解为什么单个商店与许多商店在很多很多用例中都是一个没有实际意义的问题:) it's reliable : we use selectors to dig through the app state and obtain context-relevant information.(它是可靠的 :我们使用选择器来挖掘应用程序状态并获取与上下文相关的信息。) We know that all the needed data is in a single store.(我们知道所有需要的数据都在一个商店中。) It avoids all questioning as to where state issues could be.(它避免了对状态问题可能出现的所有问题。) it's fast : our store currently has close to 100 reducers, if not more.(速度很快 :我们的商店目前有近100个减速机,如果不是更多的话。) Even at that count, only a handful of reducers process data on any given dispatch, the others just return the previous state.(即使按此计算,只有少数减速器处理任何给定调度的数据,其他减量器只返回先前的状态。) The argument that a huge/complex store ( nbr of reducers ) is slow is pretty much moot.(一个巨大/复杂的商店( 减速器的数量 )缓慢的论点几乎没有实际意义。) At least we've not seen any performance issues coming from there.(至少我们没有看到任何性能问题。) debugging friendly : while this is a most convincing argument to use redux as a whole, it also goes for single store vs multiple store.(调试友好 :虽然这是使用redux作为一个整体的最有说服力的论据,但它也适用于单店和多店。) When building an app you're bound to have state errors in the process ( programmer mistakes ), it's normal.(在构建应用程序时,您必然会在进程中出现状态错误( 程序员错误 ),这是正常的。) The PITA is when those errors take hours to debug.(PITA是那些错误需要几个小时才能调试的时候。) Thanks to the single store ( and redux-logger ) we've never spent more than a few minutes on any given state issue.(感谢单一商店( 和redux-logger ),我们在任何特定的州问题上都没有花费超过几分钟的时间。) a few pointers(一些指示) The true challenge in building your redux store is when deciding how to structure it.(构建redux商店的真正挑战在于决定如何构建它。) Firstly, because changing structure down the road is just a major pain.(首先,因为在路上改变结构只是一个主要的痛苦。) Secondly, because it largely determines how you'll be using, and querying your app data for any process.(其次,因为它在很大程度上决定了您将如何使用,并查询您的应用数据的任何过程。) There are many suggestions on how to structure a store.(关于如何构建商店有很多建议。) In our case we found the following to be ideal:(在我们的例子中,我们发现以下是理想的:) { apis: { // data from various services api1: {}, api2: {}, ... }, components: {} // UI state data for each widget, component, you name it session: {} // session-specific information } Hopefully this feedback will help others.(希望这些反馈能够帮助他人。) EDIT 2 - helpful store tools(编辑2 - 有用的商店工具) For those of you who have been wondering how to "easily" manage a single store , which can quickly get complex.(对于那些一直想知道如何“轻松”管理单个商店的人来说 ,这可能会很快变得复杂。) There are a tools that help isolate the structural dependencies/logic of your store.(有一些工具可以帮助隔离商店的结构依赖性/逻辑。) There is Normalizr which normalizes your data based on a schema.(Normalizr可根据模式规范化您的数据。) It then provides an interface to work with your data and fetch other parts of your data by id , much like a Dictionary.(然后它提供了一个用于处理数据的接口,并通过id获取数据的其他部分,就像字典一样。) Not knowing Normalizr at the time, I built something along the same lines.(当时不知道Normalizr,我沿着同样的路线建造了一些东西。) relational-json takes a schema, and returns a Table-based interface ( a little like a database ).(relational-json接受一个模式,并返回一个基于表的接口( 有点像数据库 )。) The advantage of relational-json is that your data structure dynamically references other parts of your data ( essentially, you can traverse your data in any direction, just like normal JS objects ).(relational-json的优点是您的数据结构动态地引用数据的其他部分( 实际上,您可以在任何方向上遍历数据,就像普通的JS对象一样 )。) It's not as mature as Normalizr, but I've been using it successfully in production for a few months now.(它不像Normalizr那样成熟,但我已经在生产中成功使用它几个月了。)   ask by Sebastien Daniel translate from so

与恶龙缠斗过久,自身亦成为恶龙;凝视深渊过久,深渊将回以凝视…
Welcome To Ask or Share your Answers For Others

1 Answer

0 votes
by (71.8m points)

There are edge cases when you might use multiple stores (eg if you have performance problems with updating lists of thousands of items that are on screen at the same time many times per second).(有些边缘情况可能会使用多个商店(例如,如果您在每秒多次同时更新屏幕上数千个项目的列表时遇到性能问题)。)

That said it's an exception and in most apps you never need more than a single store.(这说它是一个例外,在大多数应用程序中,你永远不需要超过一个商店。) Why do we stress this in the docs?(为什么我们在文档中强调这一点?) Because most people coming from Flux background will assume multiple stores is the solution to making update code modular.(因为大多数来自Flux背景的人会假设多个商店是使更新代码模块化的解决方案。) However Redux has a different solution for this: reducer composition.(然而,Redux有一个不同的解决方案:减速器组成。) Having multiple reducers that are further split into a reducer tree is how you keep updates modular in Redux.(将多个Reducer进一步拆分为reducer树,就是如何在Redux中保持模块更新。) If you don't recognize this and go for multiple stores without fully understanding reducer composition first, you will miss many benefits of Redux single store architecture:(如果您没有认识到这一点并且在没有完全理解减速器组成的情况下去多个商店,那么您将会错过Redux单店架构的许多好处:) Using reducer composition makes it easy to implement "dependent updates" a la waitFor in Flux by writing a reducer manually calling other reducers with additional information and in a specific order.(使用reducer组合可以轻松地在Flux中实现“依赖更新”和“ waitFor ”,方法是通过手动调用其他Reducer以及其他信息并按特定顺序调用reducer。) With a single store, it's very easy to persist, hydrate, and read the state.(只需一个商店,就可以很容易地保持,保湿和阅读状态。) Server rendering and data prefetching is trivial because there is just one data storage that needs to be filled and rehydrated on the client, and JSON can describe its contents without worrying about store's ID or name.(服务器呈现和数据预取是微不足道的,因为只需要在客户端上填充和重新水化一个数据存储,JSON可以描述其内容而不必担心商店的ID或名称。) A single store makes Redux DevTools time travel features possible.(单个商店使Redux DevTools的时间旅行功能成为可能。) It also makes community extensions like redux-undo or redux-optimist easy because they operate on the reducer level.(它还使像redux-undo或redux-optimist这样的社区扩展变得容易,因为它们在reducer级别上运行。) Such "reducer enhancers" can't be written for stores.(这种“减速剂增强剂”不能用于商店。) A single store guarantees that the subscriptions are called only after the dispatch has been processed.(单个存储保证仅在处理了调度之后才调用订阅。) That is, by the time listeners are notified, the state has been fully updated.(也就是说,在通知听众时,状态已经完全更新。) With many stores, there are no such guarantees.(有很多商店,没有这样的保证。) This is one of the reasons Flux needs the waitFor crutch.(这是Flux需要waitFor拐杖的原因之一。) With a single store, this is not a problem you see in the first place.(对于单个商店,这不是您首先看到的问题。) Above all, multiple stores are unnecessary in Redux (except for performance edge cases which you are supposed to profile first anyway).(最重要的是,Redux中不需要多个商店(除了您应该首先分析的性能边缘情况)。) We make it an important point in the docs so you are encouraged to learn reducer composition and other Redux patterns instead of using Redux as if it was Flux, and losing its benefits.(我们将其作为文档中的重点,因此我们鼓励您学习减速器组合和其他Redux模式,而不是像使用Flux一样使用Redux,并且失去它的好处。)

与恶龙缠斗过久,自身亦成为恶龙;凝视深渊过久,深渊将回以凝视…
Welcome to OStack Knowledge Sharing Community for programmer and developer-Open, Learning and Share
Click Here to Ask a Question

...