防抖(Debouncing)应用场景
-
搜索输入框:
- 用户在搜索框中输入内容时,只在用户停止输入后一定时间(如300毫秒)才发送搜索请求,而不是每输入一个字符就发送一次请求
- 可以减少请求次数,减轻服务器压力。
给个栗子大家瞅瞅
-
窗口大小调整:
- 用户调整浏览器窗口大小时,只在调整结束后执行一次调整操作,而不是每次窗口大小变化时都执行。
- 可以提高性能,避免多次触发导致界面重绘和性能问题。
-
表单验证:
- 用户在填写表单时,只在用户停止输入后进行验证,而不是每次输入都进行验证。
- 可以减少验证次数,提高表单验证性能。
截流(Throttling)应用场景
-
滚动事件:
- 用户滚动页面时,每隔一段时间(如200毫秒)执行一次滚动处理操作,而不是每次滚动事件触发都执行。
- 常用于实现无限滚动加载,减少滚动处理的频率,提升滚动性能。
-
窗口滚动和调整事件:
- 页面滚动和窗口调整时,每隔一定时间执行一次布局调整或数据加载操作,而不是每次事件触发都执行。
- 可以避免频繁布局调整带来的性能问题。
-
鼠标移动事件:
- 用户移动鼠标时,每隔一段时间更新一次鼠标位置,而不是每次鼠标移动事件触发都更新。
- 常用于拖拽操作和绘图应用,减少频繁更新带来的性能开销。
给个栗子大家瞅瞅