put initialData in cache

[shrugs]

description

when populating a useSWR hook with initialData, that data is per-hook and not stored in the cache to be available to other hook invocations, resulting in duplicate fetches for useSWR invocations that don't have the SSR initialData passed to them.

for example:

0. in a next.js project a page's getInitialProps function is generating initialData as in the example.
1. the page component does useSWR(someKey, { initialData }) and correctly SSR renders the initialData.
2. a child component also invokes useSWR(someKey). the child component's useSWR sees an empty cache and executes fetcher, resulting in an unnecessary fetch.

workarounds

1. prop-drill or context-pass initialData to all the components that need it
2. only use useSWR in the parent and prop-drill / context-pass the return value of useSWR to components that need it

expectation

when initialData is provided, it will be stored in the cache under the provided key. when other useSWR hooks are invoked, they'll see the cached value and avoid an extra call to fetcher

[shrugs]

somewhat related to the goals in #158

[mirshko]

This explains my issue here: #11 (comment)

[rick-nu]

Workaround to cache the server-side initial data on the client side (as long as SWR doens't support it natively): https://www.npmjs.com/package/use-fetch-cache

[yaoyu2021]

just use revalidateOnMount to trigger cache in backgrounnd

[shuding]

Update for whoever comes to this issue: https://swr.vercel.app/docs/with-nextjs