Bolt: Optimize GradientBlinds GC and layout thrashing #49

Closed
ragusa-it wants to merge 1 commits from bolt-performance-gradientblinds-gc-6174148752895979498 into main
ragusa-it commented 2026-02-02 02:19:30 +00:00 (Migrated from github.com)

💡 What: Optimized GradientBlinds.tsx by replacing immutable state updates in the animation loop with mutable refs and removing expensive DOM reads.
🎯 Why: The previous implementation created new objects/arrays every frame/event, causing GC pressure, and called getBoundingClientRect inside the loop (via fallback), risking layout thrashing.
📊 Impact: Reduces garbage collection frequency and eliminates potential layout thrashing during animation, smoothing out frame rates.
🔬 Measurement: Verified with vitest unit tests covering logic and event handling. Visual behavior remains identical.


PR created automatically by Jules for task 6174148752895979498 started by @ragusa-it

💡 What: Optimized `GradientBlinds.tsx` by replacing immutable state updates in the animation loop with mutable refs and removing expensive DOM reads. 🎯 Why: The previous implementation created new objects/arrays every frame/event, causing GC pressure, and called `getBoundingClientRect` inside the loop (via fallback), risking layout thrashing. 📊 Impact: Reduces garbage collection frequency and eliminates potential layout thrashing during animation, smoothing out frame rates. 🔬 Measurement: Verified with `vitest` unit tests covering logic and event handling. Visual behavior remains identical. --- *PR created automatically by Jules for task [6174148752895979498](https://jules.google.com/task/6174148752895979498) started by @ragusa-it*
google-labs-jules[bot] commented 2026-02-02 02:19:31 +00:00 (Migrated from github.com)

👋 Jules, reporting for duty! I'm here to lend a hand with this pull request.

When you start a review, I'll add a 👀 emoji to each comment to let you know I've read it. I'll focus on feedback directed at me and will do my best to stay out of conversations between you and other bots or reviewers to keep the noise down.

I'll push a commit with your requested changes shortly after. Please note there might be a delay between these steps, but rest assured I'm on the job!

For more direct control, you can switch me to Reactive Mode. When this mode is on, I will only act on comments where you specifically mention me with @jules. You can find this option in the Pull Request section of your global Jules UI settings. You can always switch back!

New to Jules? Learn more at jules.google/docs.


For security, I will only act on instructions from the user who triggered this task.

👋 Jules, reporting for duty! I'm here to lend a hand with this pull request. When you start a review, I'll add a 👀 emoji to each comment to let you know I've read it. I'll focus on feedback directed at me and will do my best to stay out of conversations between you and other bots or reviewers to keep the noise down. I'll push a commit with your requested changes shortly after. Please note there might be a delay between these steps, but rest assured I'm on the job! For more direct control, you can switch me to **Reactive Mode**. When this mode is on, I will only act on comments where you specifically mention me with `@jules`. You can find this option in the **Pull Request** section of your [global Jules UI settings](https://jules.google.com/settings). You can always switch back! New to Jules? Learn more at [jules.google/docs](https://jules.google/docs). --- *_For security, I will only act on instructions from the user who triggered this task._*
copilot-pull-request-reviewer[bot] (Migrated from github.com) reviewed 2026-02-02 02:23:18 +00:00
copilot-pull-request-reviewer[bot] (Migrated from github.com) left a comment

Pull request overview

Optimizes the GradientBlinds WebGL effect update loop to reduce per-frame allocations and avoid potentially layout-thrashing DOM reads, aiming for smoother animation performance.

Changes:

  • Replaced per-event/per-frame object/array reassignments with in-place mutation via refs/arrays (e.g., iMouse, mouseTargetRef, pointer position tracking).
  • Removed the per-frame getBoundingClientRect() fallback path in the RAF loop by relying on cached rectRef.

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

## Pull request overview Optimizes the `GradientBlinds` WebGL effect update loop to reduce per-frame allocations and avoid potentially layout-thrashing DOM reads, aiming for smoother animation performance. **Changes:** - Replaced per-event/per-frame object/array reassignments with in-place mutation via refs/arrays (e.g., `iMouse`, `mouseTargetRef`, pointer position tracking). - Removed the per-frame `getBoundingClientRect()` fallback path in the RAF loop by relying on cached `rectRef`. --- 💡 <a href="/ragusa-it/ragusaitweb/new/main/.github/instructions?filename=*.instructions.md" class="Link--inTextBlock" target="_blank" rel="noopener noreferrer">Add Copilot custom instructions</a> for smarter, more guided reviews. <a href="https://docs.github.com/en/copilot/customizing-copilot/adding-repository-custom-instructions-for-github-copilot" class="Link--inTextBlock" target="_blank" rel="noopener noreferrer">Learn how to get started</a>.

Pull request closed

Sign in to join this conversation.