If you want to make an animation smooth on your website, make sure to add will-change CSS property to the layer that moves a lot. For example transform or opacity property. This is a hint to the browser, this element should be allowed all the time. Otherwise, when you upgrade or downgrade to a layer you incur a cost.

/* other code */
will-change: transform opacity;

Check out more documentation topic here

Originally published at https://mohanpd.com.np.

--

--

Mohan Upadhyay (@mhnpd)

Mohan Upadhyay (@mhnpd)

Hello!! I am a Software Developer focused in JavaScript and Typescript. I am also interested in Math and Philosophy.