前端性能优化

css https://segmentfault.com/a/1190000000490328

js https://segmentfault.com/a/1190000000490326

https://blog.csdn.net/franktaoge/article/details/70225704--讲的不错

http://www.infoq.com/cn/articles/javascript-high-performance-animation-and-page-rendering Javascript高性能动画与页面渲染

css：渲染页面

• 能修改整个节点的大小或位置的属性，如height，float，会触发重布局，
• 能改变节点内部的渲染效果，会需要重绘

1. offsetTop, offsetLeft, offsetWidth, offsetHeight
2. scrollTop/Left/Width/Height
3. clientTop/Left/Width/Height
4. getComputedStyle(), or currentStyle in IE

• // bad var left = 10, top = 10; el.style.left = left + "px"; el.style.top = top + "px"; // better el.className += " theclassname"; // or when top and left are calculated dynamically... // better el.style.cssText += "; left: " + left + "px; top: " + top + "px;";

• In Chrome not touching computed styles while modifying styles is 2.5 times faster when you change styles (restyle test) and 4.42 times faster when you change styles and layout (relayout test)
• In Firefox - 1.87 times faster to refrain from asking computed styles in restyle test and 1.64 times faster in the relayout test
• In IE6 and IE8, it doesn't matter

js性能优化：