search

ByteGrad / Professional-JavaScript-Course

This repo contains everything you need as a student of the Professional JavaScript Course by ByteGrad.com
https://bytegrad.com/courses/professional-javascript
44 stars 26 forks source link

What is use case of Backface Property ? #3

Closed madhavanand-github closed 1 year ago

madhavanand-github commented 2 years ago

W3 School defines backface-visibility property as whether the back face of an element should be visible when facing the user.

I could see its effect, but I am unable to understand the use case and property itself.

ByteGrad commented 2 years ago

Sometimes with CSS animations & transitions there is a small 1-px 'glitch'. So with the introductory animation (when you load the page) some elements may shift by like 1px at the end. One 'trick' to try to prevent this is with 'backface-visibility: none', however this doesn't always work. The idea is that it puts the element in 3d-space and therefore gets more resources from the computer, which should prevent that 1px-shifting.