web前端性能优化

最基本的：

CSS顶部, JS底部

YUI compressor/Gzip

CDN

有 必要的CSS Sprite

Ajax可缓存

1.减少对dom元素的操作，使用innerhtml
2.高频事件防抖

// 取自 UnderscoreJS 实用框架

function debounce(func, wait, immediate) {

    var timeout;

    return function() {

        var context = this, args = arguments;

        var later = function() {

            timeout = null;

            if (!immediate) func.apply(context, args);

        };

        var callNow = immediate && !timeout;

        clearTimeout(timeout);

        timeout = setTimeout(later, wait);

        if (callNow) func.apply(context, args);

    };

  }



// 添加resize的回调函数，但是只允许它每300毫秒执行一次

window.addEventListener('resize', debounce(function(event) {



    // 这里写resize过程



}, 300));