Verify canary release

• I verified that the issue exists in the latest Next.js canary release

Provide environment information

Operating System:
  Platform: darwin
  Arch: x64
  Version: Darwin Kernel Version 22.2.0: Fri Nov 11 02:08:47 PST 2022; root:xnu-8792.61.2~4/RELEASE_X86_64
Binaries:
  Node: 16.17.1
  npm: 8.15.0
  Yarn: 1.22.19
  pnpm: N/A
Relevant packages:
  next: 13.1.5
  eslint-config-next: N/A
  react: 18.2.0
  react-dom: 18.2.0

Which area(s) of Next.js are affected? (leave empty if unsure)

Data fetching (gS(S)P, getInitialProps), Dynamic imports (next/dynamic)

Link to the code that reproduces this issue

N/A

To Reproduce

I have a couple of components which need to render client-only, eg. components with different layout based on screen width, components displaying stuff like "x seconds ago". For these, I use a helper component rendered at the root:

import { atom, useSetAtom } from "jotai";
import { useEffect } from "react";

// react hydration expects same DOM structure for SSR and initial CSR.
// as we cannot guarantee this for certain data (eg. date/time), we only render that data client-side.
export const clientMountedAtom = atom(false);

export const ClientMountedObserver = () => {
  const setClientMounted = useSetAtom(clientMountedAtom);

  useEffect(() => {
    setClientMounted(true);
  }, [setClientMounted]);

  return null;
};

The clientMountedAtom is then used by these components like this:

export const ClientOnly = () => {
  const clientMounted = useAtomValue(clientMountedAtom);

  // ... logic

  if (!clientMounted) {
    return null;
  }

  return ...;
};

Since updating to the latest version, these components have been causing hydration errors such as:

This suspense boundary received an update before it finished hydrating...

These components are often used in combination with dynamic, so that might also have an influence somehow.

Describe the Bug

See above.

Expected Behavior

No hydration errors (as in previous versions).

Which browser are you using? (if relevant)

N/A

How are you deploying your application? (if relevant)

next start