如何避免使用redux重新计算计算属性的潜在代价

时间:2017-03-24 23:11:26

标签: reactjs redux reselect

假设我在redux商店中有animals。它是一个规范化的对象,键是id,值是对象本身。每只动物都有一把钥匙is_dog

animals: {
    'id1': { location: 'foo', is_dog: true, name: 'Dog1' },
    'id2': { location: 'foo', is_dog: false, name: 'Cat1' },
    'id3': { location: 'foo', is_dog: false, name: 'Cat2' },
    'id4': { location: 'foo', is_dog: true, name: 'Dog2' },
}

我有一个DogsList连接的react组件,它查看存储状态并将dogIds数组传递给UI组件。 dogIds的计算类似于:

dogIds = _.chain(state.animals).filter('is_dog').map('id').value();

在上面的例子中,这将返回['id1', 'id4']

但是,我们假设我有数千只动物,每只动物都有其他经常变化的属性,比如currentLocationlastFed等。我知道dogIds只有在is_dog更改任何动物时才会更改,但我不太确定如何不对任何动物的每次更改进行过滤和不必要的地图计算。我尝试使用reselect,但在这种情况下,我认为它确实没有用。

我倾向于将dogIds存储在redux中,并仅在相关时手动更新它。就像将一只新狗添加到animals,或者一只猫改变为一只狗(我的比喻在这里分崩离析)。但我觉得我通过在redux商店中保存计算属性来做错事。

1 个答案:

答案 0 :(得分:1)

也许您可以考虑使用React的生命周期方法,例如shouldComponentUpdate - 在这里您可以评估是否newDogIDs !== oldDogIDs然后只做不同的事情。