Hello, thanks for the answer.
I thought you reply the way you replied, but I can’t implement it that way. I really tried to simplify things as possible, but I what I do in the real app is I send a request to server and server is sending me new JSON with a state. I want to reflect this state in UI. In this new state, items could be removed. So I have to solve it on Animator layer (or I think it would far easier).
So when you look at the example, it wasn’t easy for me to make it, because it’s not a trivial problem. The whole problem, in my opinion, is that Templating engine is working in a synchronous way, waiting till one promise is resolved to remove another item. I would like it to work in parallel.
I think it is important because of 2 scenarios. First I showed in the example (when you are blocked and you have no idea why untill you realize how it works under the hood), the second issue is you as a developer don’t really know how is UI going to look at any given moment. Let me explain. Imagine that you will remove 3 items, in a 600ms sequence, but animation takes 1 second. You would naturally expect that UI will finish animating after 2.2 seconds (1.2 seconds till the last animation is fired + 1s duration of animation), but in reality, it will take 3 seconds. Because of this waiting for a promise. (See picture, if it’s hard to imagine: http://au.comper.sk/au-timing.png).
Or imagine, it would be 500ms sequence instead. You would expect to see the first animation at time 0s, second at time 0.5s and the third starting at 1s. But what would you see is first animation starting at time 0s, but second and third being started together at time 1s.
I hope now you see that as a developer you really need to understand how it works under the hood, to explain what you see, and it is something different then what you would naturally expect. Plus you are limited.
Hope this helps.