在 React 中记忆大型数组操作有意义吗？

Question

假设我有一个组件：

export const MyComponent = ({largeArray}) => {
    const arrayINeed = largeArray.sort()
}

据我了解，每次MyComponent重新渲染时都会调用largeArray.sort() ，如果largeArray很大，那不会引起某种程度的性能问题吗？

在这种情况下记忆这样的结果会更好吗？：

export const MyComponent = ({largeArray}) => {
    const sortedArray = useMemo(() => largeArray.sort(), [largeArray])
}

Answer 1

是的，但更重要的是，您正在通过调用其sort方法来改变传入 props 的数组。 相反，将数组展开成一个新数组并对新数组进行排序：

import {useMemo} from 'react';

export const MyComponent = ({largeArray}) => {
  const sortedArray = useMemo(() => [...largeArray].sort(), [largeArray]);
}