Requests with `suspense: true` block requests without `suspense: true` from starting

[nstepien]

Bug report

Description / Observed Behavior

Having both a request without suspense, and a request with suspense, the request without suspense will not start until the other one completes, this is because the react effect cannot be triggered until the component has rendered.

Expected Behavior

SWR should start fetching requests even if the component is suspended. I'm not sure how that can be done though while still relying on React effects.

Repro Steps / Code Example

https://codesandbox.io/s/amazing-jennings-d4zjsr?file=/src/App.js

The first useSWR's fetcher won't be triggered until the second one completes:

  const { data: one } = useSWR("one", {
    async fetcher() {
      console.log(new Date(), "fetching one");
      return new Promise((resolve) => {
        setTimeout(() => resolve("one"), 2000);
      });
    }
  });
  const { data: two } = useSWR("two", {
    fetcher() {
      console.log(new Date(), "fetching two");
      return new Promise((resolve) => {
        setTimeout(() => resolve("two"), 2000);
      });
    },
    suspense: true
  });

Additional Context

SWR version: 2.2.2

We can use preload as a workaround, but it's not ergonomic.