[Flow Router]On route change keep old data/subscription for a few seconds


I want to create a page transition between routes similar to the effect you can see here.

Basically, when a user clicks on a button for example a very fast animation like that plays and covers the current page content and then fades out and loads the new content. What I could do of course is play the animation and upon a callback change route, however this means that only after the callback it will start to load template and subscription data.

It would be better for performance to start loading template data/subscriptions as soon as the animation is playing (and hopefully almost have it ready at the end of the transition). But in order to do so, with template level subscriptions for example I’d have to load the new templates immediately, ergo removing all the current content in an instant without the custom animation I want to use.

How can I load the data (but keep the current view) and at the same time already play the animation?