setInterval wont work when chrome tab is in background

Question

I have an interval that starts when my component renders. this interval will get chart data from server and draw charts based on the data. but after some time if the browser tab goes in background interval wont call my API and wont update data.

what should I do to handle that?

Answer 1

This is the answer to your question.

The summary is: Chrome and Firefox reduce the speed of setInterval when the tab is in the background to improve foreground performance. The workaround is, Use repeated setTimeout instead of setInterval with some type of repeated setTimeout like this: Code:

function nextInterval() {
    // Your logic here
    setTimeout(function() {
        nextInterval();       // repeat
    }, xxx)
}