データフェッチングの Suspense は現在非推奨
そもそも SWR の suspense 機能は experimental だが、React と SWR の開発者はデータフェッチングに Suspense を利用することを非推奨にしている。
Suspense を使用するデータフェッチングはライブラリレベルではまだサポートされていない。
renderToPipeableStream – React
Suspense 内部のコンポーネントはサーバーサイドでも実行されるため SWR と Suspense を使用するとハイドレーションのミスマッチが発生する問題が紹介されている。
この解決策として、Suspense を含むコンポーネントを Client でのみレンダリングされるようにしたりlazy, next/dynamicなどを利用して SSR させない方法と、Dan 先生が紹介していた fallbackData を利用する方法が紹介されている。fallbackData を利用する場合、Suspense の fallback が表示されなくなる点には注意。
Suspense and Server-Side Rendering · Issue #1906 · vercel/swr