這是@cached 用於自動跟蹤 Ember Octane 的有效用法嗎？

Question

最近我在編寫帶有自動跟蹤功能的 Glimmer 組件時遇到了一個來自tracked-toolbox的@cached用例。 這是一個示例代碼片段：

import Component from '@glimmer/component';

/**
 * Example usage
 * <PersonInfo
 *  @a={{this.objA}}
 *  @b={{this.stringB}}
 *  @c={{this.intC}}
 * />
 * Where objA can be a large object
 */

export default class PersonInfo extends Component {

  /**
   * I hope @cached here can help avoid re-running output getter in each
   * of the other getters, e.g. this.msg, this.link, this.name
   * But whenever any input args changes it triggers update 
   * (i.e. parent run this.objA = newObj)
   */
  get output() {
    return someExpensiveLogic(this.args.a, this.args.b, this.args.c);
  }

  get msg() {
    return translate(this.output.msg);
  }

  get link() {
    return convert(this.output.link);
  }

  get name() {
    return change(this.output.name);
  }
}

{{!-- In the template --}}
<div>
  {{this.name}}
  {{this.msg}}
  {{this.link}}
</div>

在不使用@cached ，上面的代碼在渲染時會執行 3 次output getter，分別對msg 、 link和name 。

我還考慮過為output構建自己的緩存，但它需要我手動跟蹤使用了哪個狀態並對它們進行哈希處理，這可能很昂貴且難以維護。

根據我的理解， @cached提供的是對自動跟蹤系統中“全局標簽”的訪問，因此我可以依靠該標簽來確定緩存何時需要刷新。

由於我目前從事的公司項目不支持此功能，我希望這種用法可以鼓勵我們以后添加此類支持。

注意：我發現@cached是方便的包裝器

import { createCache, getValue } from '@glimmer/tracking/primitives/cache';

所以基本上我需要的是@glimmer/tracking/primitives/cache 。

Answer 1

根據離線討論在此處發布跟進。

這是tracked-toolbox 中@cached實用程序的有效用法。 狹義用例滿足以下要求：

1. output吸氣劑很貴。
2. output的結果在 JS 中的其他 getter 中多次使用。 （如果this.output僅直接在模板中使用，它在重新運行時已經具有與@cache完全相同的語義。）
3. 與output getter 中使用的值的顯式緩存相比，使用@cache不會評估參數值的更改，這意味着如果this.args.b設置為與以前相同的值， output getter 仍將重新運行. 在這個用例中這不是問題，因為我知道父級不會在輸入參數中設置相同的值。