MatiasP
MatiasP

Reputation: 45

Dealing with changes on complex data with BehaviorSubject

Let's say I have a Service that provides a BehaviorSubject to any component that wants to get the latest version of some data.

export class DataService {    
    private messageSource = new BehaviorSubject<Data>(this.data);
    currentMessage = this.messageSource.asObservable();
}

export class Component implements OnInit {

    message:Data;

    constructor(private data: DataService) { }

    ngOnInit() {
      this.data.currentMessage.subscribe(
        message => {
          this.message = JSON.parse(JSON.stringify(message))
        }
      )
    }
}

The Data is complex:

class Data {
    id:number
    prop1:string
    prop2:Array<{prop1:number, prop2:string}>
}

The Data changes over time, and the components are only concerned with the latest version of the data. My question is: How can the components know what exactly changed about the data when they get notified?

For example, let's say that only one field of one item in prop2 changed. Every component will get the new data, but they don't know what exactly changed. Knowing what changed would open up many opportunities for rendering optimization.

Is there a built-in way to do this with BehaviorSubject? Is the component supposed to figure out the differences after it gets notified? How is this usually done?

Upvotes: 1

Views: 493

Answers (1)

Jan B.
Jan B.

Reputation: 6458

That's not the job of Subjects to care about the type of their payload, let alone what properties have changed.

There are other tools to diff objects, e.g. you might want to check reduce of the lodash library which could suit your need. If you search for deep diff on the web or here on Stackoverflow you'll find some more info on that matter.

Regarding your particular issue, you could store the most recent Data in your components and everytime you receive a new one via your subject you diff it with a tool of your choice, apply your changes and overwrite the stored Data with the latest one.

Upvotes: 2

Related Questions