Skip to content

Fix choppy pan/zoom on large graphs - #107

Open
EBB2675 wants to merge 3 commits into
developfrom
fix-pan-and-zoom
Open

Fix choppy pan/zoom on large graphs#107
EBB2675 wants to merge 3 commits into
developfrom
fix-pan-and-zoom

Conversation

@EBB2675

@EBB2675 EBB2675 commented Sep 4, 2026

Copy link
Copy Markdown
Owner

The card overlay was calling boundingBox() on every node on every render/pan/zoom event and rebuilding the cardBoxes map each frame. Node positions don't change on pan or zoom, so this was wasted work and pan/zoom stuttered on large schemas.

Changes in GraphView.tsx:

  • pan/zoom only updates the overlay wrapper transform now
  • full node measurement runs on mount and on layoutstop
  • dragging a node only re-measures that node
  • skip the state update when geometry hasn't changed

No behaviour change. Card positioning, selection, editing, layout, diff and export all work as before. Only large graphs feel different.

also added a regression test and regenerated the Light Mode static bundle as usual

Copilot AI left a comment

Copy link
Copy Markdown
Contributor

Choose a reason for hiding this comment

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

🟡 Changes recommended

Two moderate issues could cause excessive rerenders and crashes when graph node IDs change.

Once you've addressed the issues Copilot identified, you can request another Copilot review.

Pull request overview

Optimizes graph overlay synchronization to reduce pan/zoom work on large schemas.

Changes:

  • Separates viewport updates from geometry measurement.
  • Re-measures geometry after layout or node dragging.
  • Adds regression coverage and regenerates Light Mode assets.

Required changes:

  • Moderate: Restore requestAnimationFrame coalescing for viewport updates, including cleanup cancellation.
  • Moderate: Handle missing IDs in sameCardBox to prevent crashes when graph IDs change without changing node count.
File summaries
File Description
web/tests/graph-view-overlay-sync.test.tsx Adds overlay measurement regression tests.
web/src/GraphView.tsx Optimizes overlay geometry and viewport synchronization.
api/light_mode/static/index.html References the regenerated bundle.
api/light_mode/static/assets/purify.es-CovBOfck.js Adds the regenerated sanitizer asset.
api/light_mode/static/assets/purify.es-Bzr520pe.js Removes the superseded sanitizer asset.
api/light_mode/static/assets/index.es-CCxox2Or.js Updates the generated bundle import.
Review details

Files not reviewed (1)

  • api/light_mode/static/assets/purify.es-CovBOfck.js: Generated file
  • Files reviewed: 5/7 changed files
  • Comments generated: 2
  • Review effort level: Balanced

💡 Add a code-review agent skill or configure MCP servers for context-aware, tailored reviews. Learn more in the docs.

Comment thread web/src/GraphView.tsx Outdated
Comment thread web/src/GraphView.tsx

Copilot AI left a comment

Copy link
Copy Markdown
Contributor

Choose a reason for hiding this comment

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

🟡 Changes recommended

The static bundle references the deleted purify.es-Bzr520pe.js asset and must be regenerated atomically.

Once you've addressed the issues Copilot identified, you can request another Copilot review.

Review details

Files not reviewed (1)

  • api/light_mode/static/assets/purify.es-CovBOfck.js: Generated file
  • Files reviewed: 5/7 changed files
  • Comments generated: 1
  • Review effort level: Balanced

Comment thread api/light_mode/static/index.html
@EBB2675
EBB2675 requested a review from JosePizarro3 September 4, 2026 11:23
Sign up for free to join this conversation on GitHub. Already have an account? Sign in to comment

Labels

None yet

Projects

None yet

Development

Successfully merging this pull request may close these issues.

Graph overlay re-measures every node on every frame during pan and zoom

2 participants