Are there any more does and don’ts regarding performance?
What I’ve done so far:
-
Reduced workflows in my header (reusable element). It was just 2 simple conditional Events but made a huge impact on initial loading time. However, it also reduced the UX a bit.
-
Setting up Element States with Thing data, and then changing the states when the user interacts with the page. This made the click response immediate. I also update the Thing since I need that data on other pages. This is done in the background and the user isn’t affected. I learned to restrict the use of things and instead use states when make a real time game in Bubble (soon to be released).
-
I’m still struggling with repeating groups lagging when loading 2 simple rows of text from a database with 2 objects. I have a popup with a repeating group that show a list based on the selection on the page. When the popup is shown it first shows content from the last time it was popped up, and it takes several seconds for it to update with the new. This, even though I tried to preload the repeating group content.
-
I have a menu icon in the header (reusable elements. It shouldn’t be visible when the user isn’t logged in or when the user haven’t selected object to work on. (Before I handled this through a conditional “Page is loaded”-event making a page redirect, see above). I put made the icon not on page load and put a condition on it to show it when appropriate. This made the icon appear long after the rest of the page (even the repeating group with the images). So now I always show it on page load and have a conditional “Page is loaded”-event i the header hiding it when it shoud be. That may take a while but thats the more seldom used use case so it’s ok. So now the user in the common use case gets the menu fast.
-
To sum it up so far; make sure UI components are shown first, make UI components respond without database-access if possible, and make database updates secondary since they will be carried out in the background.
Will keep working…