angular - Combine obs with various filter options

Question

I have the following scenario

Load data if ain't loaded yet

 this.mailFacade.mailLoaded$
     .pipe(
       filter(res => !res),
       takeUntil(this.unsubscribe$)
      )
     .subscribe(_ => this.mailFacade.get());

    this.userFacade.friendsLoaded$
    .pipe(
      filter(res => !res),
      takeUntil(this.unsubscribe$)
    )
    .subscribe(_ => this.userFacade.getFriends());

    this.onlineFacade.loaded$
    .pipe(
      filter(res => !res),
      takeUntil(this.unsubscribe$)
    )
    .subscribe(_ => this.onlineFacade.get());

I tried to combine all with this

    forkJoin([
      this.mailFacade.mailLoaded$,
      this.userFacade.friendsLoaded$,
      this.onlineFacade.loaded$
    ]).pipe(
      filter(([mail, user, online]) => !mail || !user || !online),
      takeUntil(this.unsubscribe$)
    )
    .subscribe(([mail, user, online]) => {
      if (!mail) { this.mailFacade.get(); }
      if (!user) { this.userFacade.getFriends(); }
      if (!online) { this.onlineFacade.get(); }
    });

I wonder if it is the same, which will be the best implementation for this case?

i want to combine the loaded state but only filter for the data that ain't loaded yet

get() puts the state loaded to true

Answer 1

if I have understood your question, you want to know which of the two methods is the best. This depends on your expectations. In the first snippet of code, what happens is that if a data was already loaded, you don't have to load it again. In case you only have only one data to load, this is the best choice in terms of performance, but not in the other cases. This is because in the first case datas are loaded sequentially, this means that every call must wait the previous one to end. In the second case, otherwise, calls are performed concurrently. Your choice!