react-flip-toolkit icon indicating copy to clipboard operation
react-flip-toolkit copied to clipboard

CSS-only animations?

Open jamwise opened this issue 4 years ago • 1 comments

I have a demanding UI with quite a few elements. The flip toolkit works fairly well at animating components but there's definitely stuttering while items are in motion. As far as I can tell the animations are calculated in JS and added to the css transform value. Is there any way to use only CSS animations? This would help offload a lot of the work that's being done on the JS thread and give me smooth animations. When I've implemented flip animations myself the animations were 60fps so I think this is the main culprit, and I'd just use my own implementation but the other features here like the reverse flip are game changers for me. I couldn't find any obvious way to do this in the docs so checking in here.

jamwise avatar Apr 12 '21 14:04 jamwise

you can clone source code and add this feature. (but wapi will not save you from freezes, js animations (transform matrix) are fast. Maybe you have a problem in your code.)

cheeck8131 avatar May 11 '23 17:05 cheeck8131