refactor(nodes): minimize position change loops

# What's changed?

* Only loop selected nodes instead of all nodes when determining position changes
This commit is contained in:
Braks
2022-04-24 13:34:22 +02:00
parent e2fd3b44ef
commit 0becad73ad
3 changed files with 11 additions and 13 deletions
@@ -104,9 +104,7 @@ onMounted(() => {
onBeforeUnmount(() => observer.stop())
updateNodeDimensions([{ id: node.id, nodeElement: nodeElement.value, forceUpdate: true }])
})
onMounted(() => {
watch(
[() => node.position, () => parent?.computedPosition, () => node.selected, () => parent?.selected],
([pos, parent]) => {
+9 -9
View File
@@ -119,18 +119,18 @@ export default (state: State, getters: ComputedGetters): Actions => {
const updateNodePosition: Actions['updateNodePosition'] = ({ id, diff = { x: 0, y: 0 }, dragging }) => {
const nodePosPromise = new Promise<NodePositionChange[]>((resolve) => {
const changes: NodePositionChange[] = []
state.nodes.forEach((node) => {
if (node.selected) {
const curr = id ? getters.getNode.value(id)! : undefined
if (curr) {
changes.push(createPositionChange({ node: curr, diff, nodeExtent: state.nodeExtent, dragging }, getters.getNode.value))
} else {
getters.getSelectedNodes.value.forEach((node) => {
if (!node.parentNode) {
changes.push(createPositionChange({ node, diff, nodeExtent: state.nodeExtent, dragging }, state.nodes))
changes.push(createPositionChange({ node, diff, nodeExtent: state.nodeExtent, dragging }, getters.getNode.value))
} else if (!isParentSelected(node, getters.getNode.value)) {
changes.push(createPositionChange({ node, diff, nodeExtent: state.nodeExtent, dragging }, state.nodes))
changes.push(createPositionChange({ node, diff, nodeExtent: state.nodeExtent, dragging }, getters.getNode.value))
}
} else if (node.id === id) {
changes.push(createPositionChange({ node, diff, nodeExtent: state.nodeExtent, dragging }, state.nodes))
}
})
})
}
if (changes.length) resolve(changes)
})
+2 -2
View File
@@ -146,9 +146,9 @@ export const createSelectionChange = (id: string, selected: boolean): NodeSelect
export const createPositionChange = (
{ node, diff, dragging, nodeExtent }: CreatePositionChangeParams,
curr: GraphNode[],
getNode: Getters['getNode'],
): NodePositionChange => {
const parent = node.parentNode ? curr.find((el) => el.id === node.parentNode) : undefined
const parent = node.parentNode ? getNode(node.parentNode) : undefined
const change: NodePositionChange = {
id: node.id,
type: 'position',