Implement virtual dom diffing algorithm

Hard

What's the correct implementation for this simplified virtual DOM diffing algorithm?

Choose an option below

if (oldNode.type !== newNode.type) {
    patches.push({
        type: 'REPLACE',
        node: newNode,
        index
    });
} else if (oldNode.props &amp;&amp; newNode.props) {
    const propsPatches = {};
    let hasChanges = false;
    
    Object.keys({...oldNode.props, ...newNode.props}).forEach(key => {
        if (oldNode.props[key] !== newNode.props[key]) {
            hasChanges = true;
            propsPatches[key] = newNode.props[key];
        }
    });
    
    if (hasChanges) {
        patches.push({
            type: 'PROPS',
            props: propsPatches,
            index
        });
    }
}

if (oldNode.type !== newNode.type) {
    patches.push({
        type: 'REPLACE',
        node: newNode,
        index
    });
}

patches.push({
    type: 'UPDATE',
    node: newNode,
    index
});

if (JSON.stringify(oldNode) !== JSON.stringify(newNode)) {
    patches.push({
        type: 'UPDATE',
        node: newNode,
        index
    });
}

JavascriptDomVirtual domDiffing algorithmDom manipulationOptimization

1class VirtualDOM {
  static diff(oldNode, newNode, patches = [], index = 0) {
      // Node was removed
      if (!newNode) {
          patches.push({
              type: 'REMOVE',
              index
          });
          return;
      }
11
      // Node was added
      if (!oldNode) {
          patches.push({
              type: 'ADD',
              node: newNode,
              index
          });
          return;
      }
21
      // Compare and update nodes
      ______________________________
      ______________________________
      ______________________________
26
      // Recursively diff children
      const maxLength = Math.max(
          oldNode.children?.length || 0,
          newNode.children?.length || 0
      );
32
      for (let i = 0; i < maxLength; i++) {
          VirtualDOM.diff(
              oldNode.children?.[i],
              newNode.children?.[i],
              patches,
              index + i + 1
          );
      }
41
      return patches;
  }
44}

What's the correct implementation for this simplified virtual DOM diffing algorithm?

Hint