pqina / flip

⏳ The online version of the classic flip clock
https://pqina.nl/flip/
MIT License
893 stars 87 forks source link

Tick freezes when you leave the tab #8

Closed 1buran closed 4 years ago

1buran commented 4 years ago

Could you explain why flip freezes when I leave the page and how to fix it? As for example you can check your demos on https://pqina.nl/flip/#nutshell the counters will stop when you switch to another tab and will continue when return back.

rikschennink commented 4 years ago

When a page is running in an inactive tab the setTimeout updates are triggered with a slower interval (determined by the browser), to conserve battery and cpu cycles Flip will freeze when a tab becomes inactive and will resume when it becomes active.

For the count down the difference between the current data and the target date is recalculated, for normal timers you might have to calculate the "pause time" yourself.

1buran commented 4 years ago

to conserve battery and cpu cycles Flip will freeze when a tab becomes inactive and will resume when it becomes active

Yeah, I see, on my laptop with Intel(R) Core(TM) i7-8550U CPU @ 1.80GHz the Flip consumes up to 60% CPU, you might see this here: https://x1i0m.csb.app/ - this is sample based on your React example.

Is it related to animation effects or..?

rikschennink commented 4 years ago

Please don’t expand the issue scope like that.

It will consume CPU cycles to calculate positions etc. There’s probably room for improvement.