Functional `ref` prop throws a `Maximum update depth exceeded` error when suspending.

React version: `18.0.0-alpha-464f27572-20210713`

## Steps To Reproduce

1. Click on the `suspend` button: https://codesandbox.io/s/ref-set-too-many-times-jm0c3?file=/src/App.js.

## The current behavior

Clicking on the `suspend` button throws a `Maximum update depth exceeded` error.

## The expected behavior

Clicking on the `suspend` button suspends.
node: Fiber,
  before: ?Instance,
  parent: Container,
): void {
  const {tag} = node;
  const isHost = tag === HostComponent || tag === HostText;
  if (isHost) {
    const stateNode = node.stateNode;
    if (before) {
      insertInContainerBefore(parent, stateNode, before);
    } else {
      appendChildToContainer(parent, stateNode);
    }
  } else if (tag === HostPortal) {
     
     
     
  } else {
    const child = node.child;
    if (child !== null) {
      insertOrAppendNodeIntoContainer(child, before, parent);
      let sibling = child.sibling;
      while (sibling !== null) {
        insertOrAppendNodeIntoContainer(sibling, before, parent);
        sibling = sibling.sibling;
      }
    }
  }
}
function insertOrAppendNode(