Technical Articles

Rabin Dhas

March 23, 2021 1 minute read

UI5 Tips: Use of Binding Suspend

This tip may provide a way to solve issues with application performance or initial loading, in-case any screen has inputs with suggestion enabled.

Also incase you have any dynamic filter cases where your master list based on some dynamic values of another odata call.

Issue background:

In one of custom UI5 application, we are having around 6 input fields with f4 and suggestions enabled. It’s a mandate requirement from customer to have suggestion enabled for all inputs fields( Even for non-mandatory inputs) .

This leads to performance impact on initial load of the application and also not sure, whether the users will be filling the non-mandate inputs at real time.

However noticed all the suggestions oData entities were getting called while loading the application initially.

Solution:

So decided to bind the suggestion aggregation only when user starts type any char into the input fields. With this, able to avoid the initial application delays and unnecessary oData calls to backend system.

Power of UI5 Binding:

I was able to achieve this by using the power of UI5 binding.

Initial binding of suggestions aggregation will be as show below :

As explained on link, this will not trigger any events since the binding is suspended state. When user types, the suggest event will be trigged and enabled suggestion binding as below.

conclusion:

We shall use the power of binding “suspend/resume” property to ease development time and code optimisation.

By this way, we shall able to achieve the dynamic filter applying to list and table.
Avoid performance issues with input suggestions

7 Comments

You must be Logged on to comment or reply to a post.

Boghyon Hoffmann

March 23, 2021 at 10:28 am

Thank you for the blog post! Suspending and resuming bindings can be indeed very helpful in many cases. Just as a side note, TreeBinding doesn't support suspended yet: https://github.com/SAP/openui5/issues/3161

Rabin Dhas

Blog Post Author

March 23, 2021 at 10:30 am

Boghyon Hoffmann Thanks for the note...

Sivakumar Arumugam

April 4, 2021 at 7:02 am

Thank you Rabin for your valuable information and explanation of the business scenario. Nice Blog 🙂 ...

Clark Dennison

June 29, 2022 at 1:44 pm

Rabin,

Great Blog. Thanks for the quick and useful explanation of the suspends and resume. Any thoughts on what to do when a screen restores from a saved state and the input field needs to have at least the one suggestion item so the value shows correctly. I am dealing with a situation where there are many suggestion items I don't want to load until they want to search but still need at least that one in there so when the screen is painted with a saved value it can show the text of the key.

Hope this makes sense.

Regards,

Clark

Jam Filho

January 16, 2023 at 3:24 am

Hi Clark. I'm facing exaclty the same issue as you've described yours. Sorry to be curious, but Did you manage to find a solution for that scenario? Thanks a lot

Best regards,

Jam

Martin Ceronio

October 18, 2022 at 7:14 am

Excellent, just what I have been looking for, thank you.

Adam Harkus

July 21, 2023 at 10:01 am

Hi.

Using OData V2.

I've tried this on an items aggregations of a table..

<Table id="productsTable"
				items="{path: 'Products', suspended: true }"

	onProductSearchAll: function (oEvent) {
					const oView = this.getView();
					const table = oView.byId("productsTable");
					const binding = table.getBinding("items");
					binding.resume();

The suspend works as expected in the no oData is returned.

However, the resume appears to do nothing.

Any idea why?

Technical Articles

UI5 Tips: Use of Binding Suspend

Assigned Tags