前言
最近再弄快成长移动端官网，了解了下CSS3硬件加速的相关知识，发现系列的性能分析和chrome dev tool的相关技巧，便有这些笔记。
避免重绘或者减少重绘成本
我们知道要评价一个页面的是否有流畅的交互体验，页面渲染应该在每秒60帧以上。即60FPS以上），根据FPS的定义：1000 ms / 60 Hz = 16.6 ms。而chrome开发者工具恰好提供了一个很好的工具Enable continuous page repainting，可以非常方便地测试你的页面在webkit浏览器中的渲染时间。（不必像很麻烦地在Timeline标签页中查看绘制状态，而是可以在Elements标签页调试DOM和样式，同时随时查看绘制状态，因为浏览器会持续不断地重绘页面的可见部分）
下面的网站，采用大图作为背景图，并且发生了重绘，这意味着当你滚动页面时，整个页面都发生了重绘
未完待续。
参考：
rendering-settings
Profiling Long Paint Times with DevTools’ Continuous Painting Mode
如何评价页面的性能
Javascript高性能动画与页面渲染