concept

  • Function throttling specifies that only one task will be executed in the interval;
    • A predetermined execution period is set to execute the action at a time greater than or equal to the execution period, and then the next new period
  • Function shock prevention: If the task is triggered frequently, the task will be executed only when the task triggering interval exceeds the specified interval.
    • The action is executed after n milliseconds. If the action is invoked within n milliseconds, the execution time is recalculated
  • Both function throttling and debounce are intended to limit the frequency at which functions are executed to optimize for delays, false death, or stuttering if the response time is too high.
    • The resize and Scroll events of the window object
    • Mousemove event while dragging
    • Text input, auto-complete keyup event

The difference between

  • Function stabilization: If someone enters the elevator (triggers the event), the elevator will leave in 10 seconds (executes the event listener), and if someone enters the elevator again (triggers the event again in 10 seconds), we have to wait 10 seconds to leave again (re-timing).
  • Function throttling: ensure that if the first person in the elevator, 10 seconds after the punctual delivery, this time from the first person on the elevator timing, no waiting, if there is no one, it will not run