Using `tracked` without decorators

It could be useful to have docs about using tracked in function form instead of decorator form. experimentalDecorators from TypeScript and decorators from ECMAScript proposal are not the same thing. Also it’ll be useful for people who prefer to use current version of JavaScript.

[rwjblue]

Well, AFAICT, it should be possible to do this without decorators (but using the exported decorator function) already:

import Component, { tracked } from '@glimmer/component';

class Foo extends Component { }

// to mark a property as tracked that we need to set internally
// and monitor for re-renders
tracked(Foo.prototype, 'name'); 

// to create a getter that is dependent on other properties
tracked('firstName', 'lastName')(Foo.prototype, 'name', {
  get() {
    return `${this.firstName} ${this.lastName}`;
  }
});

Am I missing something?

[tomdale]

@chicoxyzzy The approach used by MobX would not be a good fit for Glimmer, I don’t think. One cool thing about how tracked properties work right now is that the getter and setter are only configured one time per component, on the prototype. This makes instantiating a new component instance very cheap because there’s almost no work to do.

In the extendObservable API, there’s a non-trivial cost at class construction time.

I’m definitely not opposed to offering a non-decorator API for configuring tracked properties, but we would need to come up with something that is both ergonomic and maintains the semantics and performance characteristics of the decorator API.