Skip to content

[BUG]useList's default [] return causes useMemo to break #7019

@hongfanmeng

Description

@hongfanmeng

Describe the bug

In commit 43afc44, the return value of the useList hook was changed. Specifically, result.data now defaults to a new empty array ([]) if queryResponse.data.data is falsy.

// From: https://github.com/refinedev/refine/blob/acb1e96b0d6cfddbd6115818b8f01c73d56934ff/packages/core/src/hooks/data/useList.ts#L318

return {
  // ...
  result: {
    data: queryResponse?.data?.data || [],
    total: queryResponse?.data?.total,
  },
  // ...
};

While this change ensures that result.data is always an array, it introduces a significant side-effect: on every render cycle before the data is fetched, a new instance of an empty array is returned.

This breaks memoization with hooks like useMemo and useEffect because their dependency arrays rely on referential equality. Since [] === [] is always false, any memoized calculation that depends on result.data will be re-executed on every render, leading to potential performance issues.

Example:

const { data } = useList(...);

// This memoized value will be re-calculated on every render
// as long as `data` is the default empty array.
const memoizedData = useMemo(() => {
   // someComplexCompute(data)
   console.log("This will run on every render until data is loaded.");
   return someComplexCompute(data);
}, [data]);

Steps To Reproduce

ses above

Expected behavior

ses above

Packages

  • @refinedev/core

Additional Context

No response

Metadata

Metadata

Assignees

No one assigned

    Labels

    bugSomething isn't working

    Type

    No type

    Projects

    No projects

    Milestone

    No milestone

    Relationships

    None yet

    Development

    No branches or pull requests

    Issue actions