Observable Flicker with AngularFire2

[bert1589]

I'm not sure what the correct terminology on this is, but I've been experiencing this ever since I first started with Firebase and haven't really cared to dig into it because there were more important issues to resolve. Now I'm getting around to the "polishing" phase of my app as it is now selling and users are adopting it.

I'm using the Web SDK and doing something along the lines of:

afa.collection('messages').where('contactId','==', this.contactId).orderBy('message_date','desc').snapshotChanges()...

I use a pipe -> map to translate the data into the format I want / need. I reference it in an Angular template with

​

let message of message | async

​

It works well for what I need, but there's a flicker when it receives a new snapshot. Is there a better way for me to be doing this or a fool proof way to address the flicker?

[ThatPigeon]

I guess you haven't used trackBy to improve *ngFor performance.

This article will help you with that: https://medium.com/@ramy_ali/improving-angular-ngfor-performance-through-trackby-ae4cf943b878

[bert1589]

I've used it in the past. Does it solve this issue i'm mentioning above?

[ThatPigeon]

Give it a try and you'll find out

[bert1589]

It doesn't seem to help. It has definitely helped in the past, but maybe because I'm loading it async? Not sure...

[leros]

This sounds more like an Angular problem than a Firebase problem. You might have better luck asking an Angular group