fix(onlyRenderVisibleNodes): only render nodes that are inside the viewport

src/container/NodeRenderer/index.tsx

@@ -77,10 +77,8 @@ const NodeRenderer = ({ onlyRenderVisibleNodes = true, ...props }: NodeRendererP
   const nodesDraggable = useStoreState((s) => s.nodesDraggable);
   const nodesConnectable = useStoreState((s) => s.nodesConnectable);
   const elementsSelectable = useStoreState((s) => s.elementsSelectable);
-
-  const [tX, tY, tScale] = transform;
   const transformStyle = {
-    transform: `translate(${tX}px,${tY}px) scale(${tScale})`,
+    transform: `translate(${transform[0]}px,${transform[1]}px) scale(${transform[2]})`,
   };
 
   const renderNodes = onlyRenderVisibleNodes

src/utils/graph.ts

@@ -169,10 +169,17 @@ export const getNodesInside = (
     const yOverlap = Math.max(0, Math.min(rBox.y2, nBox.y2) - Math.max(rBox.y, nBox.y));
     const overlappingArea = xOverlap * yOverlap;
 
-    if (partially) {
-      return overlappingArea >= 0;
+    if (width === null || height === null) {
+      // at the beginnning all nodes have width & height === 0
+      return true;
     }
+
+    if (partially) {
+      return overlappingArea > 0;
+    }
+
     const area = width * height;
+
     return overlappingArea >= area;
   });
 };