diff --git a/.changeset/giant-pets-draw.md b/.changeset/giant-pets-draw.md new file mode 100644 index 00000000..df1e03a2 --- /dev/null +++ b/.changeset/giant-pets-draw.md @@ -0,0 +1,6 @@ +--- +'@xyflow/react': patch +'@xyflow/system': patch +--- + +Optimize performance of nodesInitialized diff --git a/packages/react/src/hooks/useNodesInitialized.ts b/packages/react/src/hooks/useNodesInitialized.ts index a44ab658..6fd042a5 100644 --- a/packages/react/src/hooks/useNodesInitialized.ts +++ b/packages/react/src/hooks/useNodesInitialized.ts @@ -9,15 +9,17 @@ export type UseNodesInitializedOptions = { }; const selector = (options: UseNodesInitializedOptions) => (s: ReactFlowState) => { + if (!options.includeHiddenNodes) { + return s.nodesInitialized; + } + if (s.nodeLookup.size === 0) { return false; } - for (const [, { hidden, internals }] of s.nodeLookup) { - if (options.includeHiddenNodes || !hidden) { - if (internals.handleBounds === undefined || !nodeHasDimensions(internals.userNode)) { - return false; - } + for (const [, { internals }] of s.nodeLookup) { + if (internals.handleBounds === undefined || !nodeHasDimensions(internals.userNode)) { + return false; } } diff --git a/packages/react/src/store/index.ts b/packages/react/src/store/index.ts index 924e83cf..7682dc90 100644 --- a/packages/react/src/store/index.ts +++ b/packages/react/src/store/index.ts @@ -91,9 +91,9 @@ const createStore = ({ if (fitViewQueued && nodesInitialized) { resolveFitView(); - set({ nodes, fitViewQueued: false, fitViewOptions: undefined }); + set({ nodes, nodesInitialized, fitViewQueued: false, fitViewOptions: undefined }); } else { - set({ nodes }); + set({ nodes, nodesInitialized }); } }, setEdges: (edges: Edge[]) => { diff --git a/packages/react/src/store/initialState.ts b/packages/react/src/store/initialState.ts index 8be408b8..996cc148 100644 --- a/packages/react/src/store/initialState.ts +++ b/packages/react/src/store/initialState.ts @@ -46,7 +46,7 @@ const getInitialState = ({ const storeNodeExtent = nodeExtent ?? infiniteExtent; updateConnectionLookup(connectionLookup, edgeLookup, storeEdges); - adoptUserNodes(storeNodes, nodeLookup, parentLookup, { + const nodesInitialized = adoptUserNodes(storeNodes, nodeLookup, parentLookup, { nodeOrigin: storeNodeOrigin, nodeExtent: storeNodeExtent, elevateNodesOnSelect: false, @@ -69,6 +69,7 @@ const getInitialState = ({ height: 0, transform, nodes: storeNodes, + nodesInitialized, nodeLookup, parentLookup, edges: storeEdges, diff --git a/packages/react/src/types/store.ts b/packages/react/src/types/store.ts index aef78aaa..1e10fe06 100644 --- a/packages/react/src/types/store.ts +++ b/packages/react/src/types/store.ts @@ -54,6 +54,7 @@ export type ReactFlowStore>; parentLookup: ParentLookup>; edges: EdgeType[]; diff --git a/packages/system/src/utils/store.ts b/packages/system/src/utils/store.ts index 14fc710a..1546a8ff 100644 --- a/packages/system/src/utils/store.ts +++ b/packages/system/src/utils/store.ts @@ -88,7 +88,7 @@ export function adoptUserNodes( ): boolean { const _options = mergeObjects(adoptUserNodesDefaultOptions, options); - let nodesInitialized = true; + let nodesInitialized = nodes.length > 0; const tmpLookup = new Map(nodeLookup); const selectedNodeZ: number = _options?.elevateNodesOnSelect ? 1000 : 0;