If you turn off animation it's snappy.

I'd recommend either killing that altogether as it definitely gives the perception of bad performance.

Or... at least take into account the delta of the progress change when doing animation. For instance, if going from 5 to 10%... a slower animation is fine. If going from 0 to 100%, the animation should be much quicker.

The performance is still bad. It's spending roughly 20ms doing JS work per frame.

React profiles are not very easy to interpret but perhaps you're doing a lot more work per frame than you should be?

Here's the profile: https://perfht.ml/2F7ohwx

This file is the entire source of the component: https://github.com/zzarcon/react-circle/blob/57bb4d19df08b73...

A lot of the work seems to be the React diffing? The only thing that changes between frames when dragging the slider is the style attribute.

Furthermore, the author seems to have included the development version of React. And the author used development settings for the webpack compilation. The compiled JS is full of eval() calls.

It might be slightly better, but still far from performance I would expect from that component

https://gfycat.com/TerribleWeeArmadillo

Is this Edge? I can confirm poor performance in Edge, but every other browse I've looked at seems to be ok.

That's Firefox on arch linux

Interesting... will have a deeper look into it, if you have any idea on how to make it better you are welcome

I actually work on low latency Java backends, I have no idea how this works ;)

> low latency Java

(Does not compute)

Sure it doesnt ;)

The think that myth is coming from the fact that JVM is heavy (150MB?), so it takes time to start, and hot-spot needs some iterations on a source code before it can fully apply JIT, but other that that, Java is really good.