Pattern for stable empty results

[pke]

I wonder what the best pattern for stable "empty" results is, especially in regards to minimised re-renderings

Variant #1 (Anti-Pattern?)

using a dynamic empty object as result

function myHook() {
  const { data } = useSWR(..)
  return {
    items: data || [] // non-stable
  }
}

Variant #2

using a stable empty object

const empty = []
function myHook() {
  const { data } = useSWR(..)
  return {
    items: data || empty // stable
  }
}

Variant #3

using a default assignment

function myHook() {
  const { data = [] } = useSWR(..)
  return {
    items: data // stable?
  }
}

Variant clearly creates a new result on every hook rerender, which I would consider bad. Which patterns do you recommend?

[huozhi]

initialData is sth you're looking for. https://swr.vercel.app/docs/options

[ErnestBrandi]

EDIT : not so relevant after all.
Just be aware that data is undefined if nothing has been fetched yet and null if something went wrong white fetching.
Approach 1) is fine, you might want to use ?? instead of || though.