Redux 和所有应用程序状态 [英] Redux and ALL the application state

问题描述

在 Redux 文档中是这样写的:

in the Redux documentation is written:

在 Redux 中，所有应用程序状态都存储为单个对象.

In Redux, all the application state is stored as a single object.

这开始了我的问题.我正在编写一个应用程序，该应用程序将在 SPA(React + Redux)中管理具有许多 数据的少数实体，并且我在使用 Redux 并获得某种滞后，因为我需要管理的数据量.

And that starts my problem. I'm writing an application that will manage few entities with many data in a SPA (React + Redux) and something is concerning me in to using Redux and get some kind of lag because the quantity of data that I'll need to manage.

我不认为通过 Redux 传输所有应用程序状态会很好，因为在某种程度上，它可能会消耗大量内存，但我可能错了.

I don't believe that transferring all the application state over Redux would be nice, because in some way, it may consume a lot of memory, but I may be wrong.

Redux 看起来(对我来说)既简单又令人困惑，如果我应该或不应该使用它，我不知道，但是，应用程序会增长很多，我确信它会有所帮助我还要维护项目的组织性.

Redux looks like (to me) so simple and so confuse at the same time and I don't if I should or shouldn't use this, but, the application will grown a lot and I have sure that it will help me to maintain the project organized as well.

另一件让我害怕的事情是当更新状态发生时渲染 DOM 元素.这与在 React 上使用 setState() 不同，正如我们在 Dan Abramov 的 Redux 视频中看到的那样，他使用的是 forceUpdate不推荐在 React 文档中使用.

Another thing that scared me is about rendering DOM element when an updated state occur. It's different from using setState() on React and as we can see in the Redux videos from Dan Abramov, he is using a forceUpdate wich isn't recommended in the React docs.

是否可以管理不同商店的实体，但在必要时将它们放在一起?

如果将所有应用程序状态存储在单个存储对象中，是否会消耗大量内存?

使用 Redux 呈现 React 组件的最佳方式是什么?

推荐答案

你肯定有几个不同的问题，而且你想的太多了 :)

You've definitely got several different questions there, and you are over-thinking things :)

首先，在客户端缓存数据在 Redux 中与任何其他 Javascript 框架没有什么不同.事实上，使用 Redux 缓存数据可能比使用 Backbone 之类的东西占用更少的内存，因为 Redux 应用程序将存储纯 JS 对象和数组，而不是将数据包装在模型类实例中.在多个存储之间拆分数据与将其全部合并到一个存储中的单个状态树之间也没有大小上的差异.

First, caching data on the client-side is no different in Redux than with any other Javascript framework. In fact, caching data with Redux will likely take up less memory than it would with something like Backbone, because a Redux app will store plain JS objects and arrays rather than wrapping the data in model class instances. There's also no difference size-wise between splitting that data between multiple stores, and combining it all into a single state tree in one store.

现在，缓存多少数据取决于您，但实际上，随着时间的推移，您可以轻松地将数以万计的记录加载到客户端应用程序中，而不会出现问题.

Now, how much data you cache is up to you, but realistically you could easily load tens of thousands of records into a client app over time without having issues.

第二，不要将 Dan 在这些视频中展示的小示例与 React-Redux 库的实际工作原理混淆.Dan 试图说明一些基本想法，而不是展示生产级代码.如果有帮助，他实际上写了一个微型版本的connect显示了 connect 实际作用的基本思想.同时，真正的 React-Redux 库是高度优化的(并且一旦知道数据确实发生了变化，它就会在内部实际使用 setState).

Second, don't confuse the small examples that Dan shows in those videos with how the React-Redux library really works. Dan was trying to illustrate some basic ideas, not show production-grade code. If it helps, he actually wrote a miniature version of connect that shows the basic idea of what connect actually does. Meanwhile, the real React-Redux library is highly optimized (and does actually use setState internally once it knows the data has really changed).

最后，虽然您可以创建多个商店，Redux FAQ 建议只使用一个 store，原因有几个.

Finally, while you can create multiple stores, the Redux FAQ advises to only use one store, for several reasons.

我最近发布了一个 演示文稿，介绍了 React 和还原.你可能想通读一遍.我还鼓励您通读 Redux 文档.

I recently published a presentation that introduces the basics of React and Redux. You might want to read through that. I'd also encourage you to read through the Redux docs thoroughly.

此外，我在 https://github.com/markerikson/react-redux-links.专门为任何试图学习生态系统的人提供一个很好的起点，以及有关更高级主题的良好信息的可靠来源.

Also, I keep a big list of links to high-quality tutorials and articles on React, Redux, and related topics, at https://github.com/markerikson/react-redux-links . Specifically intended to be a great starting point for anyone trying to learn the ecosystem, as well as a solid source of good info on more advanced topics.

这篇关于Redux 和所有应用程序状态的文章就介绍到这了，希望我们推荐的答案对大家有所帮助，也希望大家多多支持IT屋！