Skip to content

fix(useThrottleFn): align with traditional throttle behavior #4923

New issue

Have a question about this project? Sign up for a free GitHub account to open an issue and contact its maintainers and the community.

By clicking “Sign up for GitHub”, you agree to our terms of service and privacy statement. We’ll occasionally send you account related emails.

Already on GitHub? Sign in to your account

Open
wants to merge 8 commits into
base: main
Choose a base branch
from

Conversation

IceMooncake
Copy link

@IceMooncake IceMooncake commented Jul 30, 2025

Before submitting the PR, please make sure you do the following


Description

This PR fixes an inconsistency in useThrottleFn's behavior when leading: false, making it behave more like lodash.throttle.

Previously, when leading was set to false, the function could still execute on the second call if the first call was suppressed. This was because lastExec was not updated when the call was skipped, resulting in incorrect elapsed calculation.

This PR updates the logic to ensure that the throttle interval is respected properly, even when leading: false. This change aligns the behavior with developers’ expectations and lodash's semantics.

Fixes #4920.

Additional context

  • The issue arises because VueUse treats the “last execution time” as the moment when the function actually runs, rather than when it is called.
  • In contrast, Lodash updates the timestamp immediately when the throttled function is invoked (even if suppressed).
  • This led to confusion when leading: false, as the second call would unexpectedly pass through the throttle.
  • Test cases have been adjusted to validate the new behavior.

Original issue discussion: [#4920](#4920)

@dosubot dosubot bot added the size:S This PR changes 10-29 lines, ignoring generated files. label Jul 30, 2025
@dosubot dosubot bot added size:M This PR changes 30-99 lines, ignoring generated files. and removed size:S This PR changes 10-29 lines, ignoring generated files. labels Jul 30, 2025
@OrbisK OrbisK requested a review from ilyaliao July 30, 2025 09:17
@OrbisK OrbisK changed the title fix(useThrottleFn): align with traditional throttle behavior (#4920) fix(useThrottleFn): align with traditional throttle behavior Jul 31, 2025
Copy link

pkg-pr-new bot commented Jul 31, 2025

Open in StackBlitz

@vueuse/components

npm i https://pkg.pr.new/@vueuse/components@4923

@vueuse/core

npm i https://pkg.pr.new/@vueuse/core@4923

@vueuse/electron

npm i https://pkg.pr.new/@vueuse/electron@4923

@vueuse/firebase

npm i https://pkg.pr.new/@vueuse/firebase@4923

@vueuse/integrations

npm i https://pkg.pr.new/@vueuse/integrations@4923

@vueuse/math

npm i https://pkg.pr.new/@vueuse/math@4923

@vueuse/metadata

npm i https://pkg.pr.new/@vueuse/metadata@4923

@vueuse/nuxt

npm i https://pkg.pr.new/@vueuse/nuxt@4923

@vueuse/router

npm i https://pkg.pr.new/@vueuse/router@4923

@vueuse/rxjs

npm i https://pkg.pr.new/@vueuse/rxjs@4923

@vueuse/shared

npm i https://pkg.pr.new/@vueuse/shared@4923

commit: 14957d2

@IceMooncake
Copy link
Author

Hi @ilyaliao , thank you for maintaining VueUse 🙏
This PR fixes useThrottleFn(#4920) and has passed all CI checks.
When you have time, could you please review it? Thanks a lot!

Sign up for free to join this conversation on GitHub. Already have an account? Sign in to comment
Labels
size:M This PR changes 30-99 lines, ignoring generated files.
Projects
None yet
Development

Successfully merging this pull request may close these issues.

BUG | useThrottleFn | leading false option doesn't work properly
1 participant