Hi, I have JPCW architecture question. We have app and it shows animated full screen loading indicator. It works well, but when it is turned on and off quite often then animation restarts and it causes annoying flickering. I'm thinking whether it is possible somehow just show and hide that indiciator without recomposing it. I can imagine that composable that is used for rendering of indicator will just call some external javascript that will change visibility of some HTML element that is not rendered by compose. Is that solution? Or do you have any other idea?

indeed, if it's not a part of the compose-managed dom, then you can manage it manually. But ideally no one would need to do this. So I want to know more about your case.

I'm thinking whether it is possible somehow just show and hide that indiciator without recomposing it.

Does the indicator get shown under some condition? like:

if (showIndicator) LoadingIndicator()

In this case it should not be a part of the composition at all when the condition is false. Is it possible to provide a code example to showcase your problem?

You can see it on attached video (there is loading indicator) and when it is shown and hidden multiple times in short period of time then animation is not smooth as it is started from beginning every time I call

LoadingIndicator()

and stopped every time

LoadingIndicator()

is disposed. So I would like to make that indicator running forever (it is pure CSS solution, no JS) but just hide it when nothing happens.

if I understand correctly, the indicator state in your case depends on multiple independent sources? attribute

hidden()

might be one of the options although I don't think it will help avoid flickering when the state gets changed often. another solution could be to use some kind of debounce for changing the loading state. So it doesn't hide immediately but in 100ms for example. and to apply this debounced loading state to hidden() attribute. The problem with this solution is that it's not known what number (ms) should one use for debounce (what number suits the best). https://kotlin.github.io/kotlinx.coroutines/kotlinx-coroutines-core/kotlinx.coroutines.flow/debounce.html

I was thinking about

visibility

css property.