按下面顺序优化一遍吧：

1. 是否导致layout
   如果是，尽可能将动画元素absolute化以避免影响文档树，造成大面积重新计算layout。
2. 是否启用硬件加速
   “用到了CSS3动画”和“开启了硬件加速”是两件事情，虽然前者有可能导致后者。
   开启硬件加速在webkit中有神奇的万金油： opacity: 1; 或者 -webkit-backface-visibility: hidden; 。
3. 是否是有高消耗的属性（ css shadow 、 background-attachment: fixed 等）
   有的话，图片也是一种选择。这算得上是用空间换时间的优化了。
4. repaint的面积
   如果是，只好缩小动画面积了。这一步的优化有限，基本上还是依赖于上面三者

翻墙读一下 High Performance Animations 吧：