Avoid rebuilding all nodes when one node changes in diagramming

XMLWordPrintableJSON

    • Type: Task
    • Resolution: Unresolved
    • Priority: Major - P3
    • None
    • Affects Version/s: None
    • Component/s: Data Modeling
    • None
    • None
    • Developer Tools

      Currently if any one of the nodes change in the nodes prop, we are rebuild all of the nodes in the diagramming library. We should only re-build the changed nodes to avoid additional re-renders. 
      https://github.com/mongodb-js/diagramming/blob/1d5885c1bc56bc4634092cac4351b989e42ddd6f/src/components/canvas/canvas.tsx#L73 

      This ticket involves updating the logic in `convertToInternalNodes` to take in the existing nodes, do a deep equality check on the new nodes coming in (on the library consumer side we need to make sure the node and fields data doesn't change object/field references without real data changes), and only re-build the objects of the nodes that have changed. That way react-flow can avoid re-rendering existing nodes as it does an equality check on the nodes passed to it:
      https://reactflow.dev/learn/advanced-use/state-management#implement-a-color-change-action 

            Assignee:
            Unassigned
            Reporter:
            Rhys Howell
            Votes:
            0 Vote for this issue
            Watchers:
            1 Start watching this issue

              Created:
              Updated: