Issue with TabContainer and EmbeddedView Parameter Loading

Ignition
,
1

Hi everyone,

I'm currently working on a project where I have a TabContainer, and each tab contains an EmbeddedView. Inside each EmbeddedView, there is a FlexContainer, and within each FlexContainer, there are additional views.

I've encountered an issue where, every time I switch tabs, the default parameter values are displayed first before the correct parameter values are loaded. This takes about 1-2 seconds, which negatively impacts the user experience.

To address this, I tried removing the default parameters, but this resulted in an error being displayed initially, and it still takes the same amount of time to load the correct values.

I tried to change loading order in flexcontainer setup , still same issue.

Has anyone else experienced this issue or have any suggestions on how to improve the loading performance and user experience? Any advice would be greatly appreciated!

Refer to screenshot I captured.
2025-04-01_14-01-48

image
image441×141 9.07 KB

2

There are some approaches to consider:

  • Control visibility with a change script on your data, to hide the components until the bindings populate.

  • Add CSS to fade-in your components, to obscure the problem.

  • Make your initial properties non-persistent, and use coalesce() in your expressions to avoid the startup errors--this would let you control what is display before the bindings deliver the real values.

3

My Embedded View + component preemptively starts views from the gateway, which allows bindings to evaluate before the first render.

This greatly reduces the amount of thrashing that happens on view startup.

1 Like
4

Would you mind to be more specific how this setup ?

5

Thanks for your advice.

  1. My data mostly binding with tags, I am not to sure how to check if the binding is populated ?
  2. I am new to css style, can I have an example how this setup ?