关于前端:性能提高防抖和节流

防抖:如果短时间内屡次触发同一事件,只会执行一次函数。

在这里咱们把这个工夫距离设置为1000ms,如果1000ms内用户欸有再次触发事件,就执行函数;如果1000ms内再次触发事件,咱们就把以后的计时勾销,从新开始计时。

防抖函数:

debounce(func,delay){
    let timer = null;
    
    return function(...args){
        if(timer){clearTimeout(timer)}
        
        timer = setTimeout(() => {
            func.apply(this,args)
        },delay)
    }
}

节流:如果咱们在短时间内大量触发同一事件,那么在函数执行一次当前,该函数在指定的工夫内不再工作,直至过了这段时间才从新失效。(每隔一段时间执行一次)

节流函数:

    throttle(func,delay){
        let timer = null;
        
        return function(...args){
            if(timer) return 
            timer = setTimeout(() => {
                func.apply(this,args)
            },delay)
        }
    }

评论

发表回复

您的邮箱地址不会被公开。 必填项已用 * 标注

这个站点使用 Akismet 来减少垃圾评论。了解你的评论数据如何被处理