Я видел этот ответ:
useMemo vs. useEffect + useState , и он хорошо его подводит useEffect, но в моем случае я хочу выполнить дорогостоящую операцию, которая изменит DOM как можно раньше. Все useMemo()равно будет рекомендовано вместо useLayoutEffect()обновления состояния? Отражает ли двойной рендеринг эффекта -> обновление состояния какое-либо повышение производительности?
useLayoutEffect() сценарий:
useLayoutEffect(() => {
const tokens = expensiveOperationGeneratingClasses(param1)
setTokens(tokens)
},
[param1])
render (
<>
{
tokens.map(token => <span className={token.id}/>)
}
</>
)
useMemo сценарий:
const tokens = useMemo(() => {
return expensiveOperationGeneratingClasses(param1)
},
[param1]
render (
<>
{
tokens.map(token => <span className={token.id}/>)
}
</>
)
На самом деле я понял, что я не делаю DOM-операции, а просто генерирую имена классов перед рендерингом тегов, чтобы избежать мерцания, поэтому я думаю, что мне лучше использовать useMemo, я прав?
