Https://Codesandbox.Io/S/Ecstatic-Fire-1zbhz?File=/Src/App.Js Почему при первом клике происходит перерендер - понятно (меняется значение

стейта)
Почему при втором клике - не понятно (ведь я делаю сетСтейт того же значения)
Последующие обновления стейта тем же значением не триггерят обновление

Из-за чего происходит п2?

реакт проверяет на === прев стейт и то что ты пытаешся засетить и игнорит если оно равно

Понимаю, но в пункте 2 я сечу то же, что и в п3

с useEffect всего два рендера, один при рендере, один при клике, без него три

Понятнее не становится :D

как по мне это означает что ререндера не происходит, но почему вызывается console.log лишний раз...

Вызов консоль лога и означает вызов перерендера. Под перерендером я понимаю "выполнение компонента"

Я предположу почему так происходит 1 вызов - инит рендер 2 вызов - сравниваем 0 с 12 - обновляем 3 вызов - сравниваем 0 с 12 - так как в обновление стейта ассинхронно 4 вызов - сравниваем 12 с 12 - который попал после 2 вызова

Ничего не понял. В моём понимании, когда я делаю setState - система хуков 1) Знает, какой компонент зацеплен за этот стейт 2) Знает предыдущее значение 3) Если старое не равно новому - делает рендер компонента (синхронно или нет не так уже важно)

3) Оно не делает ререндер компонента, а отмечает его как dirty, и говорит движку, что надо его перерендерить, что и вызывает подобной прикол, наверное. Поэтому, синхронно или нет-важно

Смысл в том что у нас нет доступа к предидущему значению стейта с которым работает реакт, и вот я подозреваю что туда значение попадает ассинхронно

Ну хорошо, помечен как дёрти. Но если он уже перерендерился, почему в этот момент стейт не знает своего значения и при очередном setState не может их сравнить?

Не знаю 🤷‍♀

Вот и я не понял. У нас Абрамова нет в чате? )

@ fusion1337 Абрамов

Console.log быстрее вызовется асинхронного изменения стейта, компонент не рендерился, чекай в useEffect

Как он может вызваться быстрее асинхроннного изменения стейта, если компонент рендерит верное значение уже новое?

асинхронность внутри реакта != в жс, в этом кроется ответ.

1) Смелое заявление, учитывая, что реакт написан на жс и не имеет никаких других механизмов асинхронности, которых не было бы в жс. 2) Не понимаю, как это меняет суть const Component = () => { const someValue = getSomeValue() ^ console.log(someValue) ^ return <div>{someValue}</div> ^ } Оба someValue, и в консоли и в jsx имеют одинаковое начение и иного быть не может

смелое заявление которое ссылается на Дэна Абрамова, у него спросите)

Можно ссылку?

https://t.me/react_js/1062762 тайминг я вам не назову.

Как по твоему реак узнает изменилось ли значение не вызвав компонент?

По-моему, это работает не так

Я добавлял Даню лет 5 назад, но тут слишком большой поток сообщений 🙂