search

aholachek / react-flip-toolkit

A lightweight magic-move library for configurable layout transitions
MIT License
4.02k stars 135 forks source link

CSS-only animations? #149

Open jamwise opened 3 years ago

jamwise commented 3 years ago

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.

cheeck8131 commented 1 year ago

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.)