nodes/AEmotionStudio-ComfyUI-MagnifyGlass
1
0
Fork 0
Code Issues Pull Requests Packages Projects Releases Wiki Activity

Merge pull request #25 from AEmotionStudio/bolt/optimize-render-overlays-9313858051447850514

Browse Source 
⚡ Bolt: Optimize renderHtmlOverlays loop
This commit is contained in:
Æmotion Studio
2026-01-17 22:15:16 -08:00
committed by GitHub
parent 75d6285678 9935ec5077
commit 093bde19e0
2 changed files with 18 additions and 19 deletions
Download Patch File Download Diff File Expand all files Collapse all files
src/magnify-glass/MagnifyGlass.ts
+11 -13
View File
@@ -412,8 +412,17 @@ export class MagnifyGlass {
const rect = this.litegraphCanvas.getBoundingClientRect();
const dpr = rect.width > 0 ? this.litegraphCanvas.width / rect.width : 1;
const cursorCssX = this.state.x / dpr;
const cursorCssY = this.state.y / dpr;
// Pre-calculate invariant values for the frame
const currentScale = this.state.canvasScale;
const isVirtualZoomMode = currentScale < 0.7;
const canvasRect = rect;
// Pivot point (mouse position) in CSS coordinates
const pivotCssX = this.state.x / dpr;
const pivotCssY = this.state.y / dpr;
const cursorCssX = pivotCssX;
const cursorCssY = pivotCssY;
const cursorGraphX = (cursorCssX - this.state.canvasOffsetX) / this.state.canvasScale;
const cursorGraphY = (cursorCssY - this.state.canvasOffsetY) / this.state.canvasScale;
const targetGraphCenterX = cursorGraphX + this.config.offsetX;
@@ -506,23 +515,12 @@ export class MagnifyGlass {
// READ: Force layout calculation here, batched together
const widgetRect = elementToProcess.getBoundingClientRect();
// Optimization: Use the widgetRect to check overlap immediately before potentially expensive computations
// Reuse canvasRect and dpr from top level scope
const canvasRect = rect;
const dpr = rect.width > 0 ? this.litegraphCanvas.width / rect.width : 1;
const currentScale = this.state.canvasScale;
const isVirtualZoomMode = currentScale < 0.7;
// Widget position in CSS coordinates relative to canvas
const widgetCssX = widgetRect.left - canvasRect.left;
const widgetCssY = widgetRect.top - canvasRect.top;
const widgetCssWidth = widgetRect.width;
const widgetCssHeight = widgetRect.height;
// Pivot point (mouse position) in CSS coordinates
const pivotCssX = this.state.x / dpr;
const pivotCssY = this.state.y / dpr;
let finalWidgetCssX: number;
let finalWidgetCssY: number;
let finalWidgetCssWidth: number;