georapbox / canvas-circular-countdown

Draw a configurable circular canvas countdown timer.
https://georapbox.github.io/canvas-circular-countdown/
MIT License
16 stars 8 forks source link

Browser is laggy after a longtime the site are open #34

Open PaykomanVll opened 11 months ago

PaykomanVll commented 11 months ago

I would be interested to know if the canvas element can slow down the browser after a certain time? Especially when multiple timers are running at the same time?

Since I installed the timer plugin, the website becomes very sluggish after a while, so that the scroll bars can no longer be moved back and forth smoothly and the scrolling is also messy.

I can imagine that canvas is responsible for this and is “garbaging” the server.

maybe you have any idea or a solution to clean it up?

Thank you and best regards.

georapbox commented 11 months ago

I guess that if you have multiple instances, running for long time it can degrade the page's performance. Also, the device's capabilities play important role on that. In general, many canvas elements with complex computations can affect performance negatively.

In your page do you have one or many instances and how much time are they running for?

PaykomanVll commented 11 months ago

Yes that i have thinked me...

I have multiple timers, i used it as Event-counter for a game. Alliances leaders can create aevent and then got a counter, and it is always running in background to got a alert too if the event starts..

So depend ons the Alliance how many timers they create. For me i have running 3-4 counter and after few hours without to relaod then the site is laggy so much =(

So i want to ask about a "clean up"-Function?

You can see it self on got-tools(dot)com

PS: my PC ist very good, I9 + DDR5 etc....

georapbox commented 11 months ago

I'll have a look, but I also did an experiment by adding 10 instances in the same page and let it run for 1,5 hours. I didn't notice any CPU or memory increase other than the ordinary during the experiment.

But to be honest, I think that for your case, if you need a timer to run for many hours, you should probably go to a much simpler solution that does not involve canvas or any similar technology. Even better you might want to consider using server-side timers that will communicate with your Frontend via sockets or something similar, for more accuracy and performance. Because in the end of the day, if you plan to have multiple counters for too many hours, you're gonna have such performance issues and I'm not sure that there's any way to cleanup things.