如何在Flux / ReactJS中处理多个相同类型的存储

How to handle multiple stores of same type in Flux / ReactJS?

本文关键字：同类型 存储 处理 Flux ReactJS      更新时间：2023-09-26

我是Flux/React的新手，我很难理解一些基本的架构决策:

  1. 我知道所有的商店都是单例的，但是它们都是在应用开始时创建的吗?或者商店的生命周期可以更小，具体到用户的操作?
  2. 我可以有相同存储类型的多个实例，每个实例初始化为不同的上下文吗?

不幸的是，我所看到的所有例子似乎都过于简单，无法回答这些问题。让我们从Facebook的聊天应用程序示例开始。有多个线程，每个线程都有消息。MessageStore保存整个应用程序的所有消息，一个名为getAllForThread(id)的方法返回经过过滤的消息子集。当消息进入任何线程时，它会发出一个更改通知，导致MessageSection反应组件重新获取数据(无论用户正在查看哪个线程)。这显然是不可伸缩的。如果我们有10,000个线程，每个线程都有大量的消息活动呢?下面是我决定解决这个问题的方法:

  1. 每个MessageStore用线程id初始化。
  2. 创建一个单例MessageStoreFactory来创建和管理MessageStores。
  3. 当用户点击一个线程时，React组件不是订阅全局的MessageStore，而是向MessageStoreFactory请求特定的线程的MessageStore。
  4. 如果工厂已经为该线程提供了一个MessageStore，它将返回它。否则，它创建一个，启动一个异步任务为它获取初始数据，并返回它。
  5. 当React组件被拆除时(假设用户从它那里导航走了)，它会通知工厂它已经完成了对商店的所有操作。使用引用计数或其他一些缓存逻辑将允许工厂删除未使用的存储。

我用这种方法离基础有多远?有没有一种更简单的方法可以扩展?

根据用户正在查看的线程使更智能数据获取似乎更容易。我能在一些博客文章或演示中看到这个facebook的例子吗?

相关文章：