Оставьте каждое состояние у его владельца и мемоизируйте независимые компоненты со стабильными props. Не передавайте новый объект или callback без необходимости.
Как изолировать рендеры App, Parent и Child
Оставьте каждое состояние у его владельца и мемоизируйте независимые компоненты со стабильными props. Не передавайте новый объект или callback без необходимости.
Короткий ответ
Что ответить на собеседовании
Подробный разбор
Ответ с пояснениями
Условие
App хранит счётчик кнопки, Parent — текст input, Child получает только постоянную подпись. Как уменьшить лишние рендеры при клике и вводе, не ломая обновления?
Ответ
Оставьте каждое состояние у его владельца и мемоизируйте независимые компоненты со стабильными props. Не передавайте новый объект или callback без необходимости.
Parent можно мемоизировать, чтобы обновление счётчика App не затрагивало его при неизменных props. Child также можно мемоизировать, чтобы ввод Parent не пересчитывал его. Обновления собственного state или используемого context всё равно должны доходить. Проверяйте результат профилированием; мемоизация — оптимизация, а не гарантия абсолютного отсутствия render.