javascript - Mobx 如何缓存计算值？

Question

我正在使用 Mobx 构建一个 webgl 游戏引擎。我没有将它与 react 一起使用。我正在使用它来增强实体组件系统。我有像这样的实体类

import {observable, observe, computed, autorun} from 'mobx';

class Entity {
  @observable position = [0,0,0]
  @observable rotation = [0,0,0]

  @computed get modelMat(){
    return position * rotation;
  }
}

我像这样使用这个实体:

var ent = new Entity();
entity.position = [0,10,0];
if(entity.modelMat == 6){
  // do something
}

我的理解是阅读 modelMat直接这样不是最佳做法。它会导致重新计算计算。它没有被缓存。这在我的游戏引擎中是有害的，因为我可能会以 60fps 等高速访问这些计算值。

这对我来说似乎不直观，因为您使用 get 定义计算助手，然后不应该将其用作 setter/getter ？调试 computedRequiresReaction设置可用于防止这种直接计算读数的模式。

configure({
  computedRequiresReaction: true
});

那么我的问题是如何缓存或内存这些将频繁访问的计算值？为了避免这种情况，我开始使用一种使用自动运行的模式，以便在计算更改时更新局部变量。看起来像:

class Entity {
  @observable position = [0,0,0]
  @observable rotation = [0,0,0]

  modelMat = []

  constructor(){
    autorun(() => {
      this.modelMat = this.computedModelMat()
    })
  }

  @computed get computedModelMat(){
    return position * rotation;
  }
}

这为类启用了一个接口(interface)，以便 ent.modelMat仍然可以快速访问，但每次都不会重新计算。有没有更好的建议模式？为每个计算的自动运行似乎是多余的。我的一些类最终有许多自动运行处理程序来缓存这些值。

Answer 1

请注意，计算支持 keepAlive选项，这将强制 mobx 缓存该值，即使没有观察者。而且它实际上比使用 autorun 来观察更有效，因为有一些内部优化应用于这个标志。

但是有一点内存泄漏的风险:如果计算引用的任何东西仍然存在，计算将不会被清理。但是，如果您只指类本地事物，则应该保存。