typescript - eliminando reacciones @computed de mobx
En el siguiente artículo dice que las reacciones de mobx deben ser eliminadas: https://mobxjs.github.io/mobx/best/pitfalls.html
Las propiedades que están marcadas con decoradores @computed son un tipo de reacciones, por lo que parece que también necesitan ser desechadas. El problema es que, a diferencia de una llamada explícita a autorun(), observe() u otras reacciones, que devuelven una función de desecho, el decorador @computed no parece permitirnos desechar esa reacción.
Entonces la pregunta es: ¿cómo deberían eliminarse las reacciones definidas por el decorador @computed?
El problema de no disponer podría manifestarse en el siguiente ejemplo
export class Observed {
@observable
public x: number;
}
export class Observer {
constructor(private member: Observed){
}
@computed
get doubled(){
return this.member.x*2;
}
}
let member = new Observed();
let observer = new Observer(member);
// now pass observer as a model to some react component and use its doubled property
Mientras 'member' esté vivo, el observador se mantendrá vivo, a menos que se disponga la reacción que envuelve a doubled(). Incluso si agregamos una función dispose() al Observer y la llamamos nosotros mismos, no entiendo cómo podemos acceder a la reacción subyacente de doubled() para disponerla.
Respuesta #1
Los valores computados son eliminados automáticamente (e incluso reinstanciados cuando se necesitan) por MobX. MobX puede hacer esto porque se supone que no tienen efectos secundarios. Así que cada vez que MobX determina que ningún observador está interesado en el valor computado, se suspenden automáticamente, cancelando la suscripción de cualquier observable que el computado pudiera usar. En ese momento, podrían ser recolectados por el GC (por ejemplo, porque el objeto propietario sale del alcance), o reactivarse porque un nuevo observador se registra.
En otras palabras, en tu ejemplo el Observador no se mantendrá activo (ni estará observando al Observado) y puede ser recolectado por el GC de manera segura. Solo se mantendría activo si lo usaras (indirectamente) en una reacción en algún lugar, como
const disposer = reaction(() => observer.double, x => console.log(x))
