Question

我正在开始一个基于Flux的项目，但我发现了一些令我困扰的事情。

假设我有游戏列表，所以我有Games商店和一个组件 - HomepageGames，可以收听该商店。

因此，当应用程序加载时 - 它将从服务器中拉出游戏并将它们保存在商店中，然后React组件也将它们置于其状态中。所以我将在两个地方举办比赛。

但......游戏很多......数百个。

另外 - 我有一些网址列表，我正在拉动并构建两个导航 - 页眉和页脚。所以我将在三个地方设置网址 - Navigation商店和两个导航React组件。

链接也可以是数百......

那么，我该如何避免这种记忆膨胀...？ ......或者我只需要和解？

Answer 1

如果您从商店获取列表，那么您并没有真正复制Store中的游戏列表。使用Javascript，默认情况下，您将在组件中获得此列表的引用。

所以，如果你要在HomepageGames中执行此操作：

componentDidMount: function() {
   this.setState({
       games: GameStore.getAllGames()
   });
}

你的内存中仍然只有一个游戏列表。

您的组件对GamesStore中的列表有参考。尝试在组件的此列表中添加一些游戏，您将看到商店中的列表也会被更改。

在大多数情况下，这是一种不良行为。许多人使用像Immutable这样的库来避免这种引用。但对你而言，这似乎是一个好主意。