ember-cached-decorator-polyfill

Polyfill for RFC 566 "@cached decorator".

Installation

ember install ember-cached-decorator-polyfill

For addons, pass the -S flag.

Compatibility

• Ember.js v3.13 or above
• Ember CLI v2.13 or above
• Node.js v10 or above

Summary

Add a @cached decorator for memoizing the result of a getter based on autotracking. In the following example, fullName would only recalculate if firstName or lastName is updated.

import { tracked, cached } from '@glimmer/tracking';

class Person {
  @tracked firstName = 'Jen';
  @tracked lastName = 'Weber';

  @cached
  get fullName() {
    return `${this.firstName} ${this.lastName}`;
  }
}

For detailed usage instructions, refer to the RFC 566 "@cached decorator".

TypeScript Usage

TypeScript's normal type resolution for an import from @glimmer/tracking will not find the types provided by this package (since TypeScript would attempt to resolve it as node_modules/@glimmer/tracking or under the Definitely Typed location for @glimmer/tracking).

Once the addition to the @glimmer/tracking API is a documented part of Ember's API, the types will be available upstream, but in the meantime users will need to modify their tsconfig.json to tell TypeScript where these types are.

Add the following to your tsconfig.json:

{
  // ...snip...
  "paths": {
    // ...snip...
    "@glimmer/tracking": [
      "node_modules/ember-cached-decorator-polyfill",
      "node_modules/@glimmer/tracking/dist/types"
    ],
  }
}