@react_js - страница 921 - Telegram web archive

Danila

При чём тут this?

Danila

const [memoized, setMemoized] =useState(null); useEffect(()=>{ setMemoized(heavyLoad()) }, [deps]) Меняется на const memoized = useMemo(()=>heavyLoad(), [deps])

Sm•ok

Так, понял

Sm•ok

Ступил, спасибо)

Sm•ok

const [memoized, setMemoized] =useState(null); useEffect(()=>{ setMemoized(heavyLoad()) }, [deps]) Меняется на const memoized = useMemo(()=>heavyLoad(), [deps])

Memoized меняется в зависимости от чего либо зависящего (deps) и меняет значение Далее происходит реднер из-за смены deps?

Danila

Memoized меняется в зависимости от чего либо зависящего (deps) и меняет значение Далее происходит реднер из-за смены deps?

Если у мемо под капотом стейт - то рендер происходит из-за смены стейта

Danila

В исходники его не лазил

Sm•ok

Если у мемо под капотом стейт - то рендер происходит из-за смены стейта

Не нашел такое

Sm•ok

А где написано, что под капотом юсстейт?

Igor

А где написано, что под капотом юсстейт?

В исходниках

Danila

Не нашел такое

Тебя сильно волнует что именно там триггерит рендер?

Sm•ok

Тебя сильно волнует что именно там триггерит рендер?

Ну да

Danila

Работает оно интуитивно и понятно, какая разница за счёт чего, по-большому счёту?

Danila

Изменится значение мемо - получишь перерендер с новыми данными, так или иначе.

Sm•ok

Значит изменение мемо триггерит ререндер? Возник вопрос const [state, setState] = useState(0) Мемо хук зависит от state. При изменении стейта происходит перерендер, а например на расчёт нового значения мемо требуется время

Sm•ok

Будет 2 перерендера или один

Danila

Значит изменение мемо триггерит ререндер? Возник вопрос const [state, setState] = useState(0) Мемо хук зависит от state. При изменении стейта происходит перерендер, а например на расчёт нового значения мемо требуется время

При изменении стейта происходит вызов твоего компонента, соответственно, вызов useState() - игнорируется, уже есть стейт, берётся из имеющегося useMemo() - если изменились deps пересчитывается результат работы функции ( jsx) мапится в вдом и отправляется на рендер Юзмемо работает синхронно и сделан просто для того, чтобы завязать вычисление на депс и делать его (синхронно!) только тогда, когда депс изменились.

Danila

Насколько я понимаю.

artalar

Селекторы в testing-library как бы очень сильно подталкивают писать код семантический код с a11y - круто 🤔

Anonymous

круто круто

Sm•ok

При изменении стейта происходит вызов твоего компонента, соответственно, вызов useState() - игнорируется, уже есть стейт, берётся из имеющегося useMemo() - если изменились deps пересчитывается результат работы функции ( jsx) мапится в вдом и отправляется на рендер Юзмемо работает синхронно и сделан просто для того, чтобы завязать вычисление на депс и делать его (синхронно!) только тогда, когда депс изменились.

В итоге один рендер? Ждём вычисления от usememo и потом уже триггерим рендер

Evghenii

Изменение мемо не тригерит перерендер, мемо избавляет от новых вычислений, если зависимости не изменились

Danila

В итоге один рендер? Ждём вычисления от usememo и потом уже триггерим рендер

Один, да.

Danila

Если ты напишешь const notMemoized = heavyLoad(fromState)

Danila

То получишь то же самое с точки зрения логики "перерендеров"

Danila

То есть, их отстутсвие

Sm•ok

То получишь то же самое с точки зрения логики "перерендеров"

Но функция будет вызываться каждый раз

Danila

Но функция будет вызываться каждый раз

Да. Ты пихаешь это в мемо чтобы каждый раз вызывался useMemo, но из-за механизма хуков, внутренности этого useMemo будут запущены толкьо если депсы изменились

Danila

Сам useMemo будет вызван, просто реакт знает, что делать с очередным вызовом хука

Sm•ok

Ну я понял, что он хранит старое значение и возвращает его