性能优化之函数防抖动

函数防抖动是一种常见的优化高频率调用函数的手段,核心是把高频率调用的函数优化为在某一时间段内只调用一次

根据具体调用的时机可以分为两种,分别是先调用防抖以及后调用防抖

先调用防抖

先调用防抖是指先调用函数,然后等待一段时间,在等待时间结束后再进行下一次调用,如果在等待时间结束前发生了多次调用,则只会响应第一次。调用时间线如下所示
性能优化之函数防抖动
根据这个想法,可以大致得到如下代码
性能优化之函数防抖动

后调用防抖

后调用防抖则是先等待一段时间,在等待时间结束后调用函数,如果在等待时间结束前再次调用,则需重新计时并等待。调用时间线如下所示
性能优化之函数防抖动
在原有代码基础上进行修改,增加后调用的防抖动方法

性能优化之函数防抖动

将防抖动的代码合并一下,得到完整的防抖动代码
性能优化之函数防抖动

应用场景

keyupkeydown等频繁触发的事件监听

表单验证、输入搜索、点击搜索

其他会频繁调用的函数等

总结

函数防抖动本质上是检测前后两次连续间隔内的函数调用,把时间间隔内的多次函数调用合并成一次,从而实现对频繁调用的函数的优化
先调用防抖是立即执行时间间隔内的第一次函数调用,应用场景相对较少

后调用防抖是执行时间间隔内的最后一次函数调用,应用场景相对较多
性能优化之函数防抖动
文章来自公众号:睿江云计算
睿江云官网链接:https://www.eflycloud.com/home?from=RJ0024

猜你喜欢

转载自blog.51cto.com/13475644/2392118