refactor: perfomance optimisations through less dependency tracking

Signed-off-by: Braks <78412429+bcakmakoglu@users.noreply.github.com>
2021-11-15 11:22:56 +01:00
parent 482a1aa4af
commit 3705a39fa8
7 changed files with 22 additions and 25 deletions
@@ -28,11 +28,13 @@ const connectionLineVisible = computed(
  () => !!(store.nodesConnectable && sourceNode.value && store.connectionNodeId && store.connectionHandleType),
 )
 const edges = computed(() => store.edges.filter((edge) => !edge.isHidden))
+const dimensions = computed(() => store.dimensions)
+const transform = computed(() => `translate(${store.transform[0]},${store.transform[1]}) scale(${store.transform[2]})`)
 </script>
 <template>
-  <svg :width="store.dimensions.width" :height="store.dimensions.height" class="vue-flow__edges">
+  <svg :width="dimensions.width" :height="dimensions.height" class="vue-flow__edges">
    <MarkerDefinitions :color="props.arrowHeadColor" />
-    <g :transform="`translate(${store.transform[0]},${store.transform[1]}) scale(${store.transform[2]})`">
+    <g :transform="transform">
      <template v-for="edge of edges" :key="edge.id">
        <Edge
          :edge="edge"