web性能优化

1.减少http请求，图片，css，字体，JavaScript，flash，等等网络文件，都会增加 http 请求数，减少这些信息的数量能提高Web页面响应时间。

    a.图片：

        *使用css sprites技术：就是把多个图片拼成一幅图片，然后用css控制其显示。

        *Base64图片潜入网页data:URL———                                                                eg:backgroundimage:url("data:image/jpg;base64,R0lGODlhIANYAvcAAAAAAI...)

    b.CSS/JavaScript

使用代码压缩技术，减小文件体积。（使用jsmin、YUI Compressor等）

    c.字体，选择轻量级字体图标库。

    d.flash  使用css3实现动画效果。

2.css优化

    a. css样式放在页面的顶部，在样式表加载之前页面内容是以没有样式的形式 显示出来的，待加载完样式后，页面重绘，内容一闪即改变了样式表现

    b.用link代替@import ，@import相当于把样式放在了页面的底部。

    c.尽量避免使用css表达式，因为它被重新计算的次数相当多。

    d.css选择器，尽量避免使用匹配规则、后代选择器，以及通配符（*）的使用。

    e.避免使用 Filter。

    f.利用css的继承机制。

3.javaScript优化

    a.javaScript代码放在页面的尾部。

    b.尽量使用外部样式/脚本。

    c.精简Javascript和CSS，即将其中的空格和注释全去掉。

    d.批量操作时，使用字符串拼接，用 innerHTML 开销更小,速度更快,同时也更加内存安全；或调用 aa.innerHTML =array.join(‘’)。

    e.去除重复脚本，可使用统一的脚本管理模块。

    f.减少dom访问，可以缓存已经访问过的元素，删除dom节点中不必要节点（removechild（））和对象。

    g.创建dom节点，在执行完 createElement代码之后,应该马上append到dom 树中。

    h.监听动态元素事件,Dom 事件默认是向上冒泡的,发生在子节点中的事件,可以由父节点来处理。把事件注册上提到父节点上,这 样就不需要为每个子节点注册事件监听.

4.图片优化

    a.减少图片数量。

    b.降低图片的质量。

    c.使用恰当的图片格式jpg、gif（一般动画保存格式）、png（透明图片的保存格式）。

5.其他

    a.使用懒加载（eg:$("img").lazyload({}））。

    b.缓存处理（eg：把后台返回数据做一个缓存处理

            function(callback){

                            var ss = JSON.stringify(callback.toJSON());

                             localStorage.ss = ss;}）。

......