mirror of
https://github.com/Comfy-Org/ComfyUI_frontend.git
synced 2026-02-10 01:50:08 +00:00
91adcaf276
## Summary When Chrome is maximized with GPU acceleration and high DPR, calling drawImage(canvas) + drawImage(img) in the same frame causes severe performance degradation (FPS drops to 2-10, memory spikes ~18GB). Defer image preview rendering using queueMicrotask to separate the two drawImage calls into different tasks. ### Problem Severe performance degradation in ComfyUI when dragging connection lines in litegraph mode: - FPS drops from 60 to 2-10 - Memory spikes from 36GB to 54GB (~18GB increase) - CPU jumps from 2% to 15% - Other Chrome tabs (e.g., YouTube) also stutter ### Environment - Affected: Chrome with GPU acceleration, maximized/fullscreen window, high DPR (1.75) - Not affected: Firefox (WebRender), Chrome in windowed mode, Chrome with GPU acceleration disabled ### Problem only occurs with: - GPU acceleration enabled - Chrome maximized/fullscreen - An image loaded on canvas (e.g., LoadImage node with preview) ### Root cause: The bug is triggered when two drawImage() calls execute in the same frame on the same canvas: - ctx.drawImage(bgcanvas, ...) - copying background canvas to foreground - ctx.drawImage(img, ...) - rendering image preview in node widget ## Screenshots (if applicable) Before https://github.com/user-attachments/assets/76005c10-3430-4d75-a7ed-58f61d18688c After https://github.com/user-attachments/assets/5a15b0f9-3935-4428-879b-e55390abff22 ┆Issue is synchronized with this [Notion page](https://www.notion.so/PR-7394-fix-work-around-Chrome-GPU-bug-causing-severe-lag-when-dragging-links-2c66d73d365081469d73d98bf1aa421a) by [Unito](https://www.unito.io)