chenglou / chenglou/react-motion
Using Transform is slower than Top/Left
- Dominant language
- JavaScript
- Stars
- 21.9k
- Forks
- 1.1k
- PR merge metrics
- No merged PRs in 30d
Description
Hi I've just been messing around with this library, and tried two implementations of the same animation, and when I used transform: translate, in place of top/left, it resulted in a jankier animation. I found this surprising because from what I've read, it seems that transform should usually result in a smoother animation, for a variety of reasons. In the chrome devtools profiler, I see dropped frames in the transform version.
The only differences I see that I do differently between the two, would be instead of
```
{({ top, left }) => (
)}
```
I'm doing
```
{({ deltaX, deltaY }) => (
)}
```
The only extra work I can see would be the string templating which I also changed to string concatenation to see if that would help. If anyone could give me a better idea on why transform would be jankier than top/left, I would appreciate it.
Contributor guide
No contributing guide indexed for this repository
Assessment
This issue has not been assessed yet.