Repeating Group Glitchy Display on First Load

I have a repeating group which is working correctly. In my test page, the group only shows text from each row’s item but the app is naturally much more complex.

The first time the RG displays after page load, it is very glitchy and draws on the screen in chunks (that’s the best way I can describe it). After that, it displays instantly when the data changes.

I have “Show all items immediately” checked.

The setup is fairly basic. I change the data source from a workflow after the button is clicked. There is a little more going on but I’ve done enough troubleshooting to know that it isn’t the cause of this behavior.

After it is loaded, the next time it displays it is snappy because the data is already in memory. Does that sound correct? If so, how would I get the data to load immediately on page load?

Here is an animated view of what is happening. Any ideas why or how I can fix it? This is jarring for the user and looks unprofessional.

RG Glitch Demo

1 Like

You can’t stop this behaviour from happening, that’s just the RG loading the contents for the first time.

However, you can make the UX better by doing this perceived performance hack.

  • Put the RG in a align to parent container

  • Pop in a spinner of your choice in the centre (I use Hero Icon spinner by Minimum Studio)

Put a conditional on it to only be visible when your RG is loading = yes

  • Make your RG not visible on page load by default and only show it when RG is loading = no

That way the spinning icon shows when your RG is loading, eliminating the glitching behaviour.

Hope this helps

1 Like

Thank you. I’ll give it a try. The odd thing is it didn’t have this issue until recently. The RG would just show up instantly on the first draw.

1 Like

It would eventually, if the records your RG would be pulling increases.

1 Like

I get that. But it doesn’t explain why the Inbox in my example loads slowly with only four rows.

I tested the spinner idea but as you can see here, the RG is “Not Loading” while the display is still slowly populating. I also had set the RG to be Not Visible on page load with a condition that it is visible when “Is Loading” is No.

RG Glitch Demo 2

You can “ghost” your rg. Put the one loading the data in an invisible popup and make the visible (UI) one’s datasource as "ghost"RG’s list of [whatever]. It should only load into the rg when the data is ready. I hope this is still a thing and I’m not suggesting some hacky stuff that we used to have to do.

However, it’s usually pretty snappy, any chance you’re using :filtered, loading things of things, or you’re doing some crazy UI logic for this to happen? You could provide your datasource and let us know if you’re using conditionals in the cells. Is this just a repeating group or is it nested?

Are you perhaps doing (if it’s a RG of Threads) Current cell’s Thread’s Messages:first item’s text, or some other expression that is RG Data Type’s X’s field? The data is obviously being loaded instantly, but the dynamic text is not.

Also, try RG’s last item isn’t empty instead of is loading. In theory they should be the same but I tend to use the latter as I trust it more :slight_smile:

1 Like

It’s a simple Current Cell’s Thread’s name. My app is obviously more complex but I’m trying to solve it here first.

Thanks for the “last item” tip. I’ll try that.