load texture atlas while another one is animating

[html5gamedev]

I am trying to load a texture atlas into the app when the user clicks on the canvas. 

2 things happen on canvas click: 1. the animation already loaded plays, and 2. I fetch a new texture atlas from server.

Newly fetched texture atlas plays on the next canvas click, and a new texture atlas is fetched. Think of it as endless loop. On every click, previously loaded animation is played, and the next one is fetched and repeat.

It is absolutely essential that there is no freeze between animating. What approach do you recommend I take? My tests showed that there is some issues with dynamically loaded texture atlases - animation freezes, if texture atlas is being loaded at the same time. The issue really shows on mobile devices. I've got a hunch that there might be a problem that both PIXI.loader and object.gotoAndPlay() use the main thread, and they block each other, but I really don't know that much about Pixi.

 

I've posted a similar question earlier today:

, but I think I didn't correctly identify the reason for my bad performance. So this question is more in general terms. What is the best way to run texture atlas animation and load another texture atlas at the same time, so that the animation can run without any delay when wanted?