function Connector({
  name = `Recoil Connection ${CONNECTION_INDEX++}`,
  persistenceLimit = 50,
  maxDepth,
  maxItems,
  serializeFn,
  devMode = true,
}: Props): React.Node {
  const transactionIdRef = useRef(0);
  const connectionRef = useRef<?{
    disconnect: () => void,
    track: (transactionId: number, snapshot: Snapshot) => void,
  }>(null);
  const goToSnapshot = useGotoRecoilSnapshot();
  const snapshot = useRecoilSnapshot();
  const release = snapshot.retain();

  useEffect(() => {
    if (connectionRef.current == null) {
      connectionRef.current = connect({
        name,
        persistenceLimit,
        devMode,
        goToSnapshot,
        maxDepth,
        maxItems,
        serializeFn,
      });
    }

    return () => {
      connectionRef.current?.disconnect();
      connectionRef.current = null;
    };
  }, [
    devMode,
    goToSnapshot,
    maxDepth,
    maxItems,
    name,
    persistenceLimit,
    serializeFn,
  ]);

  useEffect(() => {
    try {
      const transactionID = transactionIdRef.current++;
      connectionRef.current?.track?.(transactionID, snapshot);
    } finally {
      release();
    }
  }, [snapshot, release]);

  return null;
}
@explorer-desc
Recoil Dev Tools Connector