Can "transform: translateZ(0)" be used to optimize my Christmas snowfall animation?

Greetings fine people,

I’m developing a Christmas theme CSS for my Reddit sub and I want it to be as optimized as possible.

Several forums, [URL=”http://blog.teamtreehouse.com/increase-your-sites-performance-with-hardware-accelerated-css”]including this one,[/URL] recommend using “transform: translateZ(0);” to encourage the use of video card GPU rather than the CPU, but I’m not entirely sure where to implement that change in my code.

Can someone please help me understand if the “transform: translateZ(0) trick” will help my snowfall animation and where that CSS code should go?

Here’s my Christmas snowfall CSS:

[CODE]/* CHRISTMAS snow animation code segment START. */

body:before {
content: ”;
background-image: url([url]https://imgoat.com/uploads/93f65e080a/58819.png[/url]), url([url]https://imgoat.com/uploads/93f65e080a/58820.png[/url]), url([url]https://imgoat.com/uploads/93f65e080a/58821.png);[/url]
height: 100%;
width: 100%;
position: fixed;
z-index: -1;
opacity: 1!important;
animation: snow 12s linear infinite;
-webkit-animation: snow 12s linear infinite;
}

@keyframes snow {
0% {background-position: 0px 0px, 0px 0px, 0px 0px; }
100% {background-position: 500px 1000px, 400px 400px, -300px 900px; }
}

@-webkit-keyframes snow {
0% {background-position: 0px 0px, 0px 0px, 0px 0px; }
100% {background-position: 500px 1000px, 400px 400px, -300px 900px; }
}[/CODE]

Also in #CSS _↴