diff --git a/src/container/EdgeRenderer/EdgeRenderer.vue b/src/container/EdgeRenderer/EdgeRenderer.vue
index 021f73e3..366f06d8 100644
--- a/src/container/EdgeRenderer/EdgeRenderer.vue
+++ b/src/container/EdgeRenderer/EdgeRenderer.vue
@@ -32,10 +32,7 @@ const connectionLineVisible = controlledComputed(
       store.connectionHandleType
     ),
 )
-const groups = controlledComputed(
-  () => store.getEdges,
-  () => groupEdgesByZLevel(store.getEdges, store.getNodes),
-)
+const groups = computed(() => groupEdgesByZLevel(store.getEdges, store.getNodes))
 </script>
 <script lang="ts">
 export default {
diff --git a/src/store/getters.ts b/src/store/getters.ts
index 6327fe1b..1f8c5eee 100644
--- a/src/store/getters.ts
+++ b/src/store/getters.ts
@@ -44,7 +44,8 @@ export default (state: State): ComputedGetters => {
 
   const getEdges = computed<GraphEdge[]>(() => {
     if (state.paneReady && state.dimensions.width && state.dimensions.height) {
-      if (!state.onlyRenderVisibleElements) return state.edges.filter((e) => !e.hidden)
+      if (!state.onlyRenderVisibleElements)
+        return state.edges.filter((e) => !e.hidden && !e.targetNode.hidden && !e.sourceNode.hidden)
       else
         return state.edges.filter(
           (e) =>
@@ -53,6 +54,8 @@ export default (state: State): ComputedGetters => {
             e.sourceNode.dimensions.height &&
             e.targetNode.dimensions.width &&
             e.targetNode.dimensions.height &&
+            !e.targetNode.hidden &&
+            !e.sourceNode.hidden &&
             isEdgeVisible({
               sourcePos: e.sourceNode.computedPosition || { x: 0, y: 0 },
               targetPos: e.targetNode.computedPosition || { x: 0, y: 0 },