Release of Deferred Drawing Logic for performance improvements

[alex.stanescu]

Hello everyone!

We’re excited to announce the addition of Deferred Drawing Logic to the experimental features panel!

Deferred Drawing is a feature that allows elements to wait until they need to draw themselves to actually draw themselves. This should not result in any visible changes but should provide some nice performance gains - especially for single page apps! If you’d like to share your thoughts while testing this feature, please submit feedback using the experimental features panel.

Hope this is useful to people, and happy bubbling!

[gaimed]

I don’t see it? I only see the other two…

[grace.hong]

Hi @gaimed, can you try hard refreshing your page (cmd-shift-r vs cmd-r) and letting us know if that works?

[gaimed]

Not working. Can it be because I am on the scheduled release?

[grace.hong]

Yes, if you’re on scheduled releases, you’ll see the change/deploy tomorrow! Please let us know if you don’t see it then.

[jamesdevonport]

So excited for this feature! I did some before and after videos on my app (which is a single page design) if anyone is interested.

Before: https://twitter.com/jamesdevonport/status/1527007596103749636?s=20&t=W2mOlBGwKAYcBaJ7NgYldw

After: https://twitter.com/jamesdevonport/status/1527007627208708097?s=20&t=W2mOlBGwKAYcBaJ7NgYldw

Looks like quite a big improvement to me so far

[johnny]

Wow! That looks amazing, @jamesdevonport clear difference!

[BrianHenderson]

@alex.stanescu

should provide some nice performance gains

You’re saying the magic words we all want to hear!

My app’s on the scheduled release tier but I can’t wait to test it out! We have a pretty hefty index page that’s practically a single page app and then the rest of the functionality happens on various other pages, so I’m intrigued to see what effect this will have.

[rico.trevisan]

Could you share a bit of the behind the scenes magic that you guys are doing so I know what to look for.

[ZubairLK]

Neat! I’m hoping at some point soon pagespeed insights will improve drastically…

[hauke.rux]

Nice! Would love to see some in-depth performance improvement tests from someone that has a heavy application running (+ some time to spare)

[messly]

@alex.stanescu Still not seeing this on the scheduled tier release

[gazinhio]

Yup, a pretty significant performance gain, loads and displays much smoother than before. Many thanks for this, good work

[alex.stanescu]

Hi Rico!

Essentially what we are did was separate out element creation into a “register” and an “initialize” step - the former will set up any data sources or states that might be needed before the element is visible but will do no drawing work. The latter then only runs once we actually need to draw the element (either because it became visible or because its size is needed to space out other elements). This allows significantly less work to be done at page load and spreads out that work to when you actually interact with each individual element. None of this should be actually visible outside of performance improvements though

[alex.stanescu]

This should be out on the scheduled tier - can you double check that you are on the latest Bubble version (v16) and make sure you refresh your editor? If you’re still not seeing it can you let me know what app you are working on and I’ll take a look!

[koechamos51]

Magnificient. Now my development version is faster than Live version for the first time having been beta testing in development. It takes 1.3sec to load a page with over 100 groups. Currently live version takes 1.73sec to load. A 0.4 sec improvement in load speed is great . I can imagine due to caching property of live version this may reduce latency to 1sec< . Bravo Bubble Team @alex.stanescu

[design.agx]

Will this work in apps using the old responsive engine??

Looks like a great update!

[sdharssi]

I’m curious about this too. Will this change affect apps on the original responsive engine?

[alex.stanescu]

@design.agx and @sdharssi yes this will work for both the old and new responsive engine