We just released another feature flag on the experimental settings panel. This one is a performance enhancement for run-mode!
As you may know, we had released an optimization to prevent drawing invisible elements on page load until they are shown for the first time. In bubble version 21, we expanded this to not create any DOM nodes at all (which is why it was a breaking change). However, we were still doing a lot of work to construct the internal “state” for elements, which is important for workflows or references to hidden elements that still need to work.
This optimization delays the construction of that state until either (a) we have to draw the element, or (b) we request state from that element in a workflow or an expression. This means for the vast majority of hidden elements on a SPA, we create vastly fewer objects on page load. This not only increases the speed of initial page load (on some not-so-complicated pages I was testing, it went from 1 second of scripting to 400ms), but also means that once the page is loaded the total memory usage should be reduced (one app went down from 300+ MB to 100 MB!).
We are releasing this first as an experimental feature here first as there are lots of potential edge cases with our evaluation logic. We have the intention of eventually rolling it out to all apps on new responsive and BV 21+. Please try it out and let us know of any feedback or issues!
Incredible @cal ! Love to see Bubble improving their speed for run-mode and not just internally (although I have personally really loved the internal speed improvements too)
Maybe a noob question, but if you enable it in your dev version, it doesn’t directly become active in your live version, right? You have to push live first?
I would like to properly evaluate this experiment. How can I go about that?
What’s your methodology? Teach us so we can give you decent feedback.
I’m guessing you’re getting these numbers are coming from the browser’s developer tabs somewhere?
That’s correct yeah I’m using chrome’s developer tools. There’s a performance tab that allows you to measure a page load (the little refresh icon) and will tell you in a pie chart how much time was scripting / idle / rendering / etc. This fix will improve the scripting time. The other tab is the memory tab, which tells you how much memory a tab is using - I just read those numbers on fresh page loads with flag on vs. off.
