只有一个父选择器时使用createSelector的好处

时间:2019-09-23 22:25:06

标签: javascript reactjs redux immutable.js reselect

假设我们有一个简单的redux存储:

const getUser = state => state.get('user')     // suppose we used immutable.js

我们有一个选择器来获取用户:

createSelector

现在我们有两种获取用户年龄的方法:

  1. 使用const getAge = createSelector( getUser, user => user.get('age') ) 并将getUser用作父选择器:
const getAge = state => getUser(state).get('age');
  1. 直接使用现有选择器:
const time = 'Wed, 11:45 pm'
const datetime = moment(time).utc() // yields 2019-09-23T05:00:00Z (todays date)

问题:

在性能,记忆力等方面哪个更好?

另一个衍生问题:

我在这里提出的示例非常简单,让我们考虑一下涉及到大而复杂的redux存储时,两种方法的区别重要吗?

1 个答案:

答案 0 :(得分:0)

如果选择器的属性经常更改,则将它们保留在单独的选择器上是有意义的。至少对于通常对象会整体更改的选择器,我更喜欢为用户创建一个选择器。

作为一个例子,假设我们有一个对象:

const profile = {
  name   : 'John',
  email,
  timezone,
  ...
  locale : 'en',
}

如果创建的<Translate>组件与语言环境紧密耦合,但未与配置文件的其他部分(如名称等)紧密耦合,则getLocale()的选择器才有意义(并且我们如何实现语言环境组件)。

另一方面,如果您有一个“个人资料”页,用户可以在其中编辑各个字段,那么在进行更改时,很可能需要经常重新渲染该页,因此仅使用{{1} }该页面上的选择器。

我们处理一个非常大的Redux状态,例如,由于我们在Web应用程序的各处都使用了getProfile()currentUserId,因此我们拥有专用的选择器记忆的优势。

但是,对于测验或作业,我们使用单个选择器userName而不是其内部字段,因为我们知道,大多数需要测验信息的组件都不需要名称,而是需要许多内部日期,问题数量等字段。