The animation speed is changed whenever rerendering is triggered at different zoom levels

[Gowee]

Hello!

I observed curve animation speeds up somehow in my project, which is fairly confusing.

After tons of tries, I find the problem is: the animation speed of a dashed line is changed whenever the Curve component is rerendered at a zoom level different from the initial one. More specifically, if rerendering is triggered after a zoom-in, the animation just speeds up. Then, just zoom out and trigger another rerendering, its speed returns to normal.

Screen recording:

https://i.imgur.com/lFQFKUB.mp4

Code: https://github.com/Gowee/react-leaflet-curve/tree/speedmre

As a workaround, I have to fix the duration by compensating it with * Math.pow(2, this.mapRef.current.leafletElement.getZoom()) (divided by 2 ** zoomLevel).