Non observable object

[maccman]

Quick question - is there anyway to ensure a specific prop is not returned as as a deep observable object?

We have a document on a model which is an arbitrary object. We want mobx to register when we use this prop, but we don't need a deeply observed object.

We have been using mobx's toJS on this object but we take quite a performance hit.

interface ProsemirrorJson {
  [key: string]: any
}

@model('Note')
export class Note extends Model({
  subject: prop<string>(() => ''),
  document: prop<ProsemirrorJson | undefined>(),
})

isObservableObject(note.document) # true (we want false)

cc @vojto / @xaviergonz

[maccman]

Maybe a transformer that puts it in a mobx box?

[xaviergonz]

do you need to to be serializable? if not then maybe put it outside the model props

@model('Note')
export class Note extends Model({
  subject: prop<string>(() => ''),
}) {
  document?: ProsemirrorJson;

  // or if you want it to be shallowly observable
  @observable.shallow
  document?: ProsemirrorJson;
}

alternatively, if you need it to be a model prop and the object is immutable you might use 'frozen'
https://mobx-keystone.js.org/frozen

[xaviergonz]

class M extends Model({
  frozenProp: prop<Frozen<number or whatever>>(),
  // or
  frozenProp: tProp(types.frozen(types.number or whatever, like types.unchecked<any>()))
}) {
  setFrozenProp(val: whatever) {
    this.frozenProp = frozen(val)
  }
}

[vojto]

Would it make sense to implement transformation that would freeze/unfreeze automatically?

Something like this:

const _frozenTransform: ModelPropTransform<Frozen<ProsemirrorJson>, ProsemirrorJson> = {
  transform({originalValue}) {
    return originalValue.data
  },

  untransform({transformedValue}) {
    return frozen(transformedValue)
  },
}

The goal is to keep same format that comes out of getSnapshot()

Edit: Transform works nicely for storing frozen internally while exposing getters/setters, but getSnapshot still returns the internal structure. (So it includes frozen.)

[xaviergonz]

I think you might be able to do that using the new fromSnapshotProcessor / toSnapshotProcessor added in 0.63.0

[xaviergonz]

And yes, that transformation would make sense if that's what you want

[vojto]

Thank you, didn't know about this API. Seems like exactly what we've been looking for.