Skip to Content
Technical Articles
Author's profile photo Rabin Dhas

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

 

 

Assigned Tags

      7 Comments
      You must be Logged on to comment or reply to a post.
      Author's profile photo Boghyon Hoffmann
      Boghyon Hoffmann

      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

       

      Author's profile photo Rabin Dhas
      Rabin Dhas
      Blog Post Author

      Boghyon Hoffmann  Thanks for the note...

      Author's profile photo Sivakumar Arumugam
      Sivakumar Arumugam

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

      Author's profile photo Clark Dennison
      Clark Dennison

      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

      Author's profile photo Jam Filho
      Jam Filho

      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

      Author's profile photo Martin Ceronio
      Martin Ceronio

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

      Author's profile photo Adam Harkus
      Adam Harkus

      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?