I am working on a web application; one of his design requirements is some great CSS3 animations.
In particular, it has a large <div>one that will move around the screen in response to user input.
Due to how the application was developed, the “content” of this <div>can be realized in the form of large static graphics (for example, .jpg or .png) set as the background <div>.
Or the content can also be implemented with standard HTML. (The layout of the content itself is "a little" complicated - it will require several floated or placed nested elements and div intervals, but nothing confuses.)
My question is: which option can lead to better (smoother) animations?
(I obviously can verify this myself, but it is often difficult to judge the smoothness of the animation, especially in dozens of different browsers on a wide range of devices. I also understand that there are other considerations - for example, maintenance. in this case, I am fully focused on performance animations.)
I am wondering if browsers improve the animation / rendering of simple DOM elements WITH graphic backgrounds or more complex DOM elements (with many children) WITHOUT graphics elements?
Also are there any other recommendations? For instance.
- Do browsers improve certain types of graphic elements better than others? (E.g. .png vs .jpg)
- ,
position:absolute, ? - - , 3D- ?
- ? , DOM , , node?
( DOM , ), . , , "" , .
, ?