airbnb / lottie-web

Render After Effects animations natively on Web, Android and iOS, and React Native. http://airbnb.io/lottie/
MIT License
30.54k stars 2.87k forks source link

For what reason is the svg-element transformed since 5.1.11 #1016

Open artekkk opened 6 years ago

artekkk commented 6 years ago

Hi,

since Version 5.1.11 the svg-element is transformed via 'translate3d(0,0,0)'. I have transform rules on the svg in my css as well, which are in case overwritten by this inline-style.

Is there a reason for transforming the element?

bodymovin commented 6 years ago

It's transformed so it gets it's own stack and doesn't trigger relayouts when changed. You can override the value using !important in your selector.

Jokero commented 6 years ago

@bodymovin I guess this approach with translate3d(0,0,0) should be documented :) Not everyone uses animation with attributes and lottie class. But this, let's say, hack can increase performance.