Seriously improves CSS performance when manipulating elements with transforms. Particularly helpful when using Skrollr. Very nearly maintains 60FPS throughout scrolling.

performance-mixin.scss

/**
 * Helps for anything we're going to be animating. Makes a HUGE
 * difference
 *
 * Performance tweaks found here:
 * http://blog.teamtreehouse.com/increase-your-sites-performance-with-hardware-accelerated-css
 *
 * NOTE: You'll want to use autoprefixer with this, otherwise you need to add the appropriate vendor prefixes
 *
 *    -webkit-transform: translate3d(0, 0, 0);
 *       -moz-transform: translate3d(0, 0, 0);
 *        -ms-transform: translate3d(0, 0, 0);
 *  -webkit-perspective: 1000;
 *     -moz-perspective: 1000;
 *      -ms-perspective: 1000;
 */
 
@mixin performance() {
	transform: translate3d(0, 0, 0);
	backface-visibility: hidden;
	perspective: 1000;
}