Skip to content

perf(theme/useWindowSize): optimize useWindowSize with debounce to reduce resize handler calls#2849

Merged
SoonIter merged 5 commits intomainfrom
copilot/optimize-usewindowsize-performance
Dec 8, 2025
Merged

perf(theme/useWindowSize): optimize useWindowSize with debounce to reduce resize handler calls#2849
SoonIter merged 5 commits intomainfrom
copilot/optimize-usewindowsize-performance

Conversation

Copy link
Copy Markdown
Contributor

Copilot AI commented Dec 5, 2025

Summary

Reduces resize event handler execution frequency in useWindowSize hook using a 150ms debounce. Prevents excessive state updates during window resize without adding external dependencies.

Before: Every resize event immediately triggers state update
After: State updates debounced to 150ms intervals

Implementation:

  • Inline debounce with RESIZE_DEBOUNCE_MS constant (150ms)
  • Conditional checks for timeout cleanup (replaces non-null assertions)
  • Cleanup pending timeouts on unmount
  • Initial size set immediately without debounce
  • Test coverage added to verify debounce implementation

Related Issue

优化 useWindowSize 的性能,可以通过减少调用频率,使用防抖策略等

Checklist

  • Tests updated (or not required).
  • Documentation updated (or not required).
Original prompt

优化 useWindowSize 的性能,可以通过减少调用频率,使用防抖策略等

不要引入额外的三方包和文件,要求代码简洁


✨ Let Copilot coding agent set things up for you — coding agent works faster and does higher quality work when set up for your repo.

@CLAassistant
Copy link
Copy Markdown

CLA assistant check
Thank you for your submission! We really appreciate it. Like many open source projects, we ask that you sign our Contributor License Agreement before we can accept your contribution.
You have signed the CLA already but the status is still pending? Let us recheck it.

@netlify
Copy link
Copy Markdown

netlify Bot commented Dec 5, 2025

Deploy Preview for rspress-v2 ready!

Name Link
🔨 Latest commit 866e016
🔍 Latest deploy log https://app.netlify.com/projects/rspress-v2/deploys/6932925a0bb20700089751e2
😎 Deploy Preview https://deploy-preview-2849--rspress-v2.netlify.app
📱 Preview on mobile
Toggle QR Code...

QR Code

Use your smartphone camera to open QR code link.

To edit notification comments on pull requests, go to your Netlify project configuration.

Copilot AI and others added 2 commits December 5, 2025 07:16
Co-authored-by: SoonIter <79413249+SoonIter@users.noreply.github.com>
Co-authored-by: SoonIter <79413249+SoonIter@users.noreply.github.com>
Copilot AI changed the title [WIP] Optimize performance of useWindowSize with debounce perf: optimize useWindowSize with debounce to reduce resize handler calls Dec 5, 2025
Copilot AI requested a review from SoonIter December 5, 2025 07:21
@SoonIter SoonIter marked this pull request as ready for review December 5, 2025 07:42
@SoonIter SoonIter changed the title perf: optimize useWindowSize with debounce to reduce resize handler calls perf(theme/useWindowSize): optimize useWindowSize with debounce to reduce resize handler calls Dec 5, 2025
Copy link
Copy Markdown
Contributor

Copilot AI left a comment

Choose a reason for hiding this comment

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

Pull request overview

This PR optimizes the useWindowSize hook by implementing a 150ms debounce on window resize events to reduce the frequency of state updates and improve performance during window resizing.

Key changes:

  • Added inline debounce implementation with RESIZE_DEBOUNCE_MS constant
  • Initial window size is now set immediately without debounce
  • Added cleanup for pending timeouts on component unmount

💡 Add Copilot custom instructions for smarter, more guided reviews. Learn how to get started.

Comment thread packages/runtime/src/hooks/useWindowSize.ts Outdated
Comment thread packages/runtime/src/hooks/useWindowSize.ts Outdated
Comment thread packages/runtime/src/hooks/useWindowSize.ts
@github-actions
Copy link
Copy Markdown
Contributor

github-actions Bot commented Dec 5, 2025

Rsdoctor Bundle Diff Analysis

📁 web

Path: website/doc_build/web/rsdoctor-data.json

📌 Baseline Commit: 449ba47cdb | PR: #2849

Metric Current Baseline Change
📊 Total Size 14.5 MB 14.5 MB -2.8 KB (-0.0%)
📄 JavaScript 13.9 MB 13.9 MB -2.1 KB (-0.0%)
🎨 CSS 113.7 KB 113.7 KB 0 B (0.0%)
🌐 HTML 0 B 0 B N/A
📁 Other Assets 501.3 KB 502.0 KB -712.0 B (-0.1%)

📦 Download Diff Report: web Bundle Diff

Generated by Rsdoctor GitHub Action

Copilot AI and others added 2 commits December 5, 2025 08:03
…rage

Co-authored-by: SoonIter <79413249+SoonIter@users.noreply.github.com>
Co-authored-by: SoonIter <79413249+SoonIter@users.noreply.github.com>
@SoonIter SoonIter enabled auto-merge (squash) December 8, 2025 07:21
@SoonIter SoonIter merged commit 449ba47 into main Dec 8, 2025
10 of 11 checks passed
@SoonIter SoonIter deleted the copilot/optimize-usewindowsize-performance branch December 8, 2025 08:04
Sign up for free to join this conversation on GitHub. Already have an account? Sign in to comment

Projects

None yet

Development

Successfully merging this pull request may close these issues.

5 participants