Process spreading

Process Spreading is the method of improving your Bubble app’s performance by taking a process that adds a delay to your app and spreading it out over several steps to make each of them less noticeable for the user. In other words, you’re not actually speeding up the process itself, but simply tweaking your user interface in a way that makes it seem faster. 

This line of thinking is a central part of app design, and one that is frequently repeated in the Bubble speed guide. Performance is as much, or more, about how fast your app is perceived to be, as how fast it actually is. Process Spreading is one out of many tools you can use to strengthen that illusion.

To understand process spreading, let’s take a look at a few examples:

The multi-step form

Everybody knows the multi-step form. It’s a common tool used in SaaS app onboarding for example, and can be a sensible way to not overload your user with a huge form that requires scrolling through. But multi-step forms can also make sense from a performance standpoint – instead of placing a time-consuming big workflow at the end of the last step, you create smaller workflows for each step that is finished. The time that has passed and the job that has been completed is the same, but your user is more forgiving when it’s separated into smaller packages.

Does that mean every form should be multi-step, or that you should never place all your actions at the last step? No. Remember, performance is one feature among many. A typical challenge is that multi-step forms can leave ghost records in your database, where a Thing is created in the first step, and then the User abandons the form. Use multi-step process spreading as an available tool, like everything else.

The multi-step form is of course an example of a potentially broadly applied philosophy: by splitting up your processes in chunks instead of performing everything in one big operation hides from your user how time-consuming it really is.

Outsourcing expressions

Have you ever noticed that a workflow with an Only when condition is slowing down the entire process? The reason is of course that you’re adding an extra step that Bubble has to work through before the action can be run – indeed even if the action doesn’t run because the condition’s result is negative.

In this example, we have an app that only allows for 500 registered Users. You might think that the workflow will simply not run if there are more than 500 Users, since the condition would give a negative result. But what is the condition? Well, you’re asking Bubble to tell the server to search through all the Users in your app, count them and send the result back to your browser. Now that’s not a huge operation by any means, but it’s not instant: even the distance between your computer and the server adds a slight delay to this, and the actual processing time comes on top of that.

So if that condition is necessary, how can we avoid that delay? By what I call outsourcing the expression. Just like we did in the last example of multi-step forms, we’re still performing the same actions, but we’re spreading it out over time while the User is looking at something else.

Take a look at the image below. A Group can contain every kind of content. A User. A custom Thing, and yes, even a Yes/No. In the example below, I’m performing the search on that group, and the content of the Group is simply a yes or no response to the result of that search. The Group in this case is blue for you to see it, but would of course be hidden in a real app. Why would we do this? Because this allows you to perform the search before the result of it is needed in the workflow. Going back to the action and condition we set up earlier, it can now look like this:

Just like in the multi-step form, we’re still performing the same search, but because it’s already finished when the workflow is executed, the final result will finish faster.

I hope this can help you improve your app’s performance, and let us know in the comments if you have any questions! This, and many other performance tips and tricks are available in The Ultimate Guide to Bubble Performance, available on Gumroad!

Process Spreading FAQ