Skip to content
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

Use debounce instead of throttle to avoid unnecessary re-renders #27

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

Conversation

Krakabek
Copy link
Collaborator

Closes #26

💸 TL;DR

Throttle might be not the best strategy for live code editor, since the code is usually not valid during the code modifications, but is valid after they are done
Debounce allows to write code without triggering the re-render (and a potential endless loop or complication error)

🧪 Testing Steps / Validation

Tested locally

I encourage the reviewers to check out the branch, play with the editor and compare experience with the current prod

✅ Checks

  • CI tests (if present) are passing
  • Adheres to code style for repo
  • Contributor License Agreement (CLA) completed if not a Reddit employee

@Krakabek Krakabek self-assigned this Jul 16, 2024
src/elements/play-pen/play-pen.ts Show resolved Hide resolved
src/utils/debounce.test.ts Show resolved Hide resolved
@@ -444,7 +444,7 @@ export class PlayPen extends LitElement {
}

/** Throttled changes after updating sources. */
#setSrcSideEffects = throttle((save: boolean): void => {
#setSrcSideEffects = debounce((save: boolean): void => {
Copy link
Member

Choose a reason for hiding this comment

The reason will be displayed to describe this comment to others. Learn more.

I haven't tried this but trust your judgement 👍 the intent of the original design was to give regular feedback as fast as possible.

Copy link
Collaborator Author

Choose a reason for hiding this comment

The reason will be displayed to describe this comment to others. Learn more.

The rollback would be easy in case we hate it, let's give it a try

src/utils/debounce.ts Show resolved Hide resolved
Sign up for free to join this conversation on GitHub. Already have an account? Sign in to comment
Labels
None yet
Development

Successfully merging this pull request may close these issues.

Add debounce for live reload
2 participants