I’m also really interested in this and would like to dig in a little further.
Let’s assume I have a collection loaded on a page, and I want to indicate that one variable for one of the list objects has been updated using realtime. I see two options:
A) I could receive the news that an update has occurred and refetch the full collection that is bound to my list, but that would be disruptive to the user’s experience.
B) Alternatively, I could save the collection list to an array variable and only partially update the relevant object when the frontend is notified via the xano listener.
B seems like the obvious winner, but I’ve had a hard time with making sure the correct object is updated at the correct time when trying it in the past.
In most situations A would not be disruptive because the Vue engine in Weweb should just do a differential render - changing only that which needs to be changed based on that new data. But there are situations that could be different so its worth testing
In the second situation, the way to get profit is by having a variable that is just the one important bit of the collection, or a second, focused collection to minimize your renders (if A turns out to be disruptive). You could have the websockets payload contain whatever mutation instruction you want to put in that array, or just the signal to “go get it”.
There are combinations of course - infinite scrolling views come to mind as a hybrid case. But in general, I think you have a handle on the mental model of it.
Interesting… I’ve gotten in the habit of displaying some loading indicator when I refetch a collection, which is why I think it is so disruptive. I didn’t realize that I might be interrupting the user experience unnecessarily when fetching due to known changes. I’ll play with that.
I’m not sure I understand your second paragraph. How can I “inject” the updated portion into a collection?
I meant instructions to mutate a variable (I thought that was the thrust of your “B” section), which is much more straightforward than trying to muck with a collection directly. Let me know if I can be more helpful!
Ok, thanks, that makes sense. I’ve just gotten into some painful issues when trying to save collections as arrays and then making updates to individual objects. I use it in several places in my app where there’s really no way around it, but I try to avoid it when it is unnecessary.
I appreciate you giving me that tip about collections refreshing. I’m now playing with the new animation generators to give a little indication that a new piece of info has arrived and it is nice!
Hi @Slavo, apologies for the confusion, and thanks for the clarification ! I’m aware that the Xano realtime plugin was updated, but it doesn’t seem to apply to collections specifically.
I wanted to check if there’s currently a way—or if there will be in the future—to automatically update collections via websockets. That would be incredibly helpful for certain use cases.
