有必要把它放在 useMemo 中吗? (日期计算)
is it necessary to put this in useMemo ? (date calculations)
我使用定时器,我想问你我应该用 useMemo 和回调包装它吗?
没有:
const [time, setTime] = useState();
const calculateInitialDuration = (endDate: string, today: Date): CountdownResult => {
const futureDate = new Date(endDate)
const days = differenceInDays(futureDate, today)
const hours = differenceInHours(futureDate, today) % 24
const minutes = differenceInMinutes(futureDate, today) % 60
const seconds = differenceInSeconds(futureDate, today) % 60
return { days, hours, minutes, seconds }
}
useEffect(() => {
const timer = setInterval(() =>
setTime(calculateInitialDuration(expire_date, new Date())), 1000);
return () => clearInterval(timer);
})
有备忘录
const calculateInitialDuration = useCallback(() => {
const days = calcDay;
const hours = calcHours;
const minutes = calcMinute;
const seconds = calcSeconds;
return { days, hours, minutes, seconds };
}, [time]);
const calcDay = useMemo(() => (differenceInDays(new Date(expire_date), new Date())), [time]);
const calcHours = useMemo(() => (differenceInHours(new Date(expire_date), new Date()) % 24), [time]);
const calcMinute = useMemo(() => (differenceInMinutes(new Date(expire_date), new Date()) % 60), [time]);
const calcSeconds = useMemo(() => (differenceInSeconds(new Date(expire_date), new Date()) % 60), [time]);
所以是否有必要用 memo 包装所有计算,或者我应该使用简单的而不使用 useMemo?
第二个问题不输1秒,有时会输2秒
如果您正在尝试计算日期差异,您不希望它来自调用该方法的特定实例吗?
I.E.不是每次调用都使用 new Date()
,而是使用 Date now = new Date();
然后为每次调用传入 now
不是更有意义吗?
至少,那会在几秒钟内消除损失,不是吗?
编辑:意识到这个问题与反应有关,不幸的是我不熟悉。如果这个答案在某种程度上是正确的,那就太棒了。否则,抱歉浪费您的时间。
尝试在浏览器中实现不同的确切时间不是一个好主意。 setInterval/setTimeout 只能保证您的函数被调用的时间最短。
至于记忆:通常建议使用它 - 将它用于繁重的计算或者如果您将一些变量作为道具传递给另一个组件。
例如:
const memoized = useMemo(() => {....}, [])
return <SomeComponent prop={memoized}/>
除非您处于上述情况之一并且存在明显的性能问题,否则使用不必要的记忆可能最终会降低性能。
我使用定时器,我想问你我应该用 useMemo 和回调包装它吗?
没有:
const [time, setTime] = useState();
const calculateInitialDuration = (endDate: string, today: Date): CountdownResult => {
const futureDate = new Date(endDate)
const days = differenceInDays(futureDate, today)
const hours = differenceInHours(futureDate, today) % 24
const minutes = differenceInMinutes(futureDate, today) % 60
const seconds = differenceInSeconds(futureDate, today) % 60
return { days, hours, minutes, seconds }
}
useEffect(() => {
const timer = setInterval(() =>
setTime(calculateInitialDuration(expire_date, new Date())), 1000);
return () => clearInterval(timer);
})
有备忘录
const calculateInitialDuration = useCallback(() => {
const days = calcDay;
const hours = calcHours;
const minutes = calcMinute;
const seconds = calcSeconds;
return { days, hours, minutes, seconds };
}, [time]);
const calcDay = useMemo(() => (differenceInDays(new Date(expire_date), new Date())), [time]);
const calcHours = useMemo(() => (differenceInHours(new Date(expire_date), new Date()) % 24), [time]);
const calcMinute = useMemo(() => (differenceInMinutes(new Date(expire_date), new Date()) % 60), [time]);
const calcSeconds = useMemo(() => (differenceInSeconds(new Date(expire_date), new Date()) % 60), [time]);
所以是否有必要用 memo 包装所有计算,或者我应该使用简单的而不使用 useMemo?
第二个问题不输1秒,有时会输2秒
如果您正在尝试计算日期差异,您不希望它来自调用该方法的特定实例吗?
I.E.不是每次调用都使用 new Date()
,而是使用 Date now = new Date();
然后为每次调用传入 now
不是更有意义吗?
至少,那会在几秒钟内消除损失,不是吗?
编辑:意识到这个问题与反应有关,不幸的是我不熟悉。如果这个答案在某种程度上是正确的,那就太棒了。否则,抱歉浪费您的时间。
尝试在浏览器中实现不同的确切时间不是一个好主意。 setInterval/setTimeout 只能保证您的函数被调用的时间最短。 至于记忆:通常建议使用它 - 将它用于繁重的计算或者如果您将一些变量作为道具传递给另一个组件。 例如:
const memoized = useMemo(() => {....}, [])
return <SomeComponent prop={memoized}/>
除非您处于上述情况之一并且存在明显的性能问题,否则使用不必要的记忆可能最终会降低性能。