Hello, for the messaging section of my app I am using a repeating group to display users that the admin is having conversations with.
I want the admin to be able to search for individual users so I have added an input bar that the admin can type in user’s names which then causes the repeating group to filters the users displayed.
The functionality is working well, however, it takes 10-20 seconds to filter the repeating group after typing into the input bar. I have around 2000 users in the database which I don’t think should be too many for Bubble to handle.
Technically, the search is happening after every change in the Input Search Customer’s value → That means after every character addition. You can make it faster by not filtering based on the Input value real time but with a button click and using the display list in a repeating group action.
Not quite true. The value is
updated when focus is removed from the input (which is probably a good decision by Bubble). Display list would also be no faster than the data source.
There’s no obvious reason why it’s slow. What fields do you have on the User type? Are they quite heavy? Are you sure it’s not your internet?
If you display a text like Input A’s value, the text is updated when the focus is removed or after a short time. It is not updated every character.
For reference, when I load a simple RG with an input search box and type ‘Lorem ipsum’, there are 3 searches done.
Once on page load
Once when L is typed
Once when the full text is completed (Lorem ipsum)
I’ve never noticed that an RG search might be updated sooner than the value that’s accessible to other elements, but it definitely doesn’t update after every character addition.
Don’t use the input. Instead use a search box element which will provide suggestions matching the typed value. User will select the user in suggestions of search box element.
In your RG if you want to display the selected user, use condition when search box values is not empty to change the datasource of RG to be search box value :converted to list, but if you don’t need RG to show selected user and just want to allow selection of user to then show conversation, you just use search box selected user.
Could you provide a quick step by step on how to use the browser developer tools to demonstrate what is happening in the app with the searches as you did in the videos? This is an area I need to become more familiar with and don’t have much sense of how to utilize browser developer tools to analyze the performance of the app.
I know it’s not a video but might still be helpful:
msearch is Bubble running Do a search for. If you make a test page with two uses of the identical expression, you’ll see in general it only makes the request once. Click the request to see the data it returns (payload).
mget is getting a specific Thing (e.g Current User’s Company). It puzzles me that we can’t use this in expressions and have to do a search for unique ID.
maggregate (or some variation of that) is an aggregate that returns a value e.g Do a search for User:count
You can view these in the developer tools network tab. I noticed the other poster’s requests are named differently (search vs msearch) - might be a browser thing or a Bubble change, but I’ve always seen msearch.
When you open Dev Console through Menu > More Tools > Developer Tools, the network tab is showing all the things a web app is doing in terms of network wise. The list shows a bunch of calls happening to any other service from the browser (current tab).
So the red marked things are either resources from some third party or the backend (which is technically a third party again from the browser point of view).
The names you see in this network may not be (actually probably are not) the same as your see in the bubble app designer. Some of them are recognizable as George mentioned. For example, you can easily say this is an API call: do API call from server Some others you will see that these are called when you do something and you will recognize what they are (like the one I put above to analyze repeating group filtering).
Then, you can click on any call and see what was the request and response.
For example, this is one of searches’ response headers:
There are many more features of this of course and many videos on youtube. I use network tab a lot and I also use the mobil-view etc a lot to check responsiveness of the pages.
I gave this a shot too. But it does a similar search at every letter again. I am sure there are differences but it looks like a call per letter:
Also, default searchbox just search by starting from the beginning (no partial searches) and you can’t select more than one I guess (correct me if I am wrong for the default searchbox). You have to do other tricks to capture other elements searched (like multi-dropdown maybe).
