Lag when token dissapear at the end about processanimater HOT 1 OPEN

I cannot reproduce this on my machine in Chrome. What may cause this is that at the end of each case the token is hidden by changing the display property, which may cause some kind of re-draw in the Chrome rendering engine. Just moving the token around can theoretically be accelerated as this is just a translation of the rendering position of the element.

I think for the next generation of this project, I will look for alternatives to the SVG SMIL based animation. It seemed like a nice idea back when I started since it is very generic, but it definitely has limits regarding performance and it is not actively continued by the browser vendors anymore (https://groups.google.com/a/chromium.org/forum/#!topic/blink-dev/5o0yiO440LM%5B126-150%5D).

However, CSS3 does not yet have the out-of-box capability to move shapes along a path - at least the last time I looked at it. Another alternative would be to use some rendering engine based on HTML5 Canvas and drop having each token being a DOM element with all the advantages and disadvantages.

from processanimater.