GPU usage about korona.ws HOT 8 CLOSED

Can you provide some more info, e.g. using Chrome's CPU Profiler?

from korona.ws.

Macbook Pro 2015 13", macOS 10.15.3

I have this issue in Safari, Chrome, Vivaldi, Opera. Only in Firefox works normally

Profile-20200314T132141.json.zip

from korona.ws.

There is a problem with the pulse animation of markers. If you disable it, the issue is gone.

I have tested animation of opacity instead of transform: scale but the issue remains. So the best would be to disable animations.

I have also tested it on Chrome on Windows, there is the same problem.

from korona.ws.

@jakub-zawislak Thanks for more info. I wouldn't suspect that CSS animations are the cause. I'll look into it.

from korona.ws.

I can investigate this issue (for me CPU usage is also very high).

from korona.ws.

@kkostepski That would be great, thanks! 👍

from korona.ws.

I investigated the issue and apparently there is a problem with CSS animations performance.

1. I tried used tricks like transform: translateZ(0) to force use GPU or a property will-change: transform (more info here: https://developer.mozilla.org/en-US/docs/Web/CSS/will-change and https://www.smashingmagazine.com/2016/12/gpu-animation-doing-it-right) but no result.
2. I also tried to implement animations based on Web Animations API, but I couldn't do that in combination with leaflet.markercluster I was not possible.

In my opinion the best thing to do is just disable animations. Why? Because we expect increasing number of infections. There will be more markers on the map and the animation will look ugly.

from korona.ws.

@kkostepski I will probably have to disable it. Thanks for your analysis. :)

from korona.ws.