防抖和节流

防抖

对于短时间内连续触发的事件(例如滚动事件),防抖的含义就是让某个时间期限(如1000毫秒)内,事件处理函数只执行一次

在第一次触发事件时,不立即执行函数,而是给出一个期限值比如200ms,然后:
如果在200ms内没有再次触发滚动事件,那么就执行函数
如果在200ms内再次触发滚动事件,那么当前的计时取消,重新开始计时
效果:如果短时间内大量触发同一事件,只会执行一次函数。

实现:setTimeout , 闭包

节流

我们可以设计一种定期开放的函数,也就是让函数执行一次后,在某个时间段内暂时失效,过了这段时间后再重新激活。

效果:如果短时间内大量触发同一事件,那么在函数执行一次之后,该函数在指定的时间期限内不再工作,直至过了这段时间才重新生效。

实现:setTimeout

https://www.cnblogs.com/coco1s/p/5499469.html

©著作权归作者所有,转载或内容合作请联系作者
平台声明:文章内容(如有图片或视频亦包括在内)由作者上传并发布,文章内容仅代表作者本人观点,简书系信息发布平台,仅提供信息存储服务。

推荐阅读更多精彩内容

  • 1、什么是防抖与节流? 节流 : 通俗的讲就是拧紧水龙头让水少流一点,但是不是不让水流了。想象一下在现实生活中有时...
    懂会悟阅读 4,266评论 0 3
  • 防抖和节流严格意义上是属于性能优化方面的知识,接下来使用实际应用场景详细解释防抖和节流。 案例:在滚动条滚动到距离...
    Augenstern___阅读 368评论 0 0
  • 防抖(debounce) 思路:在第一次触发事件时,不立即执行函数,而是给出一个期限值比如200ms,然后: 如果...
    alanwhy阅读 1,431评论 0 21
  • 防抖和节流严格算起来应该属于性能优化的知识,但实际上遇到的频率相当高,处理不当或者放任不管就容易引起浏览器卡死。所...
    TurnHug阅读 669评论 0 2
  • 防抖和节流严格算起来应该属于性能优化的知识,但实际上遇到的频率相当高,处理不当或者放任不管就容易引起浏览器卡死。所...
    猴逃逃阅读 178评论 0 0