Comfy-Org/ComfyUI_frontend
1
0
Fork 0
mirror of https://github.com/Comfy-Org/ComfyUI_frontend.git synced 2026-04-30 11:11:53 +00:00
Code Issues Packages Projects Releases Wiki Activity

perf: avoid calling getBoundingClientRect too often in useSelectionToolboxPosition (#5976)

Browse Source 
┆Issue is synchronized with this [Notion
page](https://www.notion.so/PR-5976-perf-avoid-calling-getBoundingClientRect-too-often-in-useSelectionToolboxPosition-2866d73d365081639755d8087e80377c)
by [Unito](https://www.unito.io)
This commit is contained in:
Rizumu Ayaka
2025-10-08 13:52:43 +08:00
committed by GitHub
parent 874ef3ba0c
commit 1461e371ad
1 changed files with 9 additions and 4 deletions
Download Patch File Download Diff File Expand all files Collapse all files

13
src/composables/canvas/useSelectionToolboxPosition.ts
View File

@@ -1,4 +1,4 @@
import { useRafFn } from '@vueuse/core' import { useElementBounding, useRafFn } from '@vueuse/core'
import { computed, onUnmounted, ref, watch } from 'vue' import { computed, onUnmounted, ref, watch } from 'vue'
import type { Ref } from 'vue' import type { Ref } from 'vue'
@@ -57,6 +57,11 @@ export function useSelectionToolboxPosition(
const visible = ref(false) const visible = ref(false)
// Use VueUse to reactively track canvas bounding rect
const { left: canvasLeft, top: canvasTop } = useElementBounding(
lgCanvas.canvas
)
/** /**
* Update position based on selection * Update position based on selection
*/ */
@@ -114,11 +119,11 @@ export function useSelectionToolboxPosition(
if (!visible.value) return if (!visible.value) return
const { scale, offset } = lgCanvas.ds const { scale, offset } = lgCanvas.ds
const canvasRect = lgCanvas.canvas.getBoundingClientRect()
const screenX = const screenX =
(worldPosition.value.x + offset[0]) * scale + canvasRect.left (worldPosition.value.x + offset[0]) * scale + canvasLeft.value
const screenY = (worldPosition.value.y + offset[1]) * scale + canvasRect.top const screenY =
(worldPosition.value.y + offset[1]) * scale + canvasTop.value
// Update CSS custom properties directly for best performance // Update CSS custom properties directly for best performance
if (toolboxRef.value) { if (toolboxRef.value) {