Wondering if any javascript ninja might be able to offer any insight into what is happening in our project. We are only seeing this issue on Windows Chrome and Edge browser (presumably Chromium on Windows causing it). We run a frame that does some expensive calculations (~75ms, we can improve the performance on this frame and it is not a concern) and it triggers some 3rd part libraries that need to make web some web requests. What we typically observe is we then get 0-2 normal 60fps frames after this frame. But after that we get a very long delay before the next requestanimationframe(Animation frame fired). In the profiler image attached, we get a 207ms delay, but of that delay only 9ms of it appears to be work.
We’ve confirmed our renderloop is complete and not waiting on anything while this happened. I presume these are all tasks in the queue from various setTimeouts in the library or elsewhere in the app, but not sure why they cause so much seemingly idle time, and prevent the next animation frame from firing. Maybe its because it needs to wait for vsync while no task is running?
Any ideas for the cause or what we might do to try and prevent it?