В одной из предыдущих статей о композиции React я показал пример того, как можно повысить производительность компонента с тяжелыми операциями с состоянием, передавая ему в качестве дочерних другие компоненты вместо того, чтобы рендерить их напрямую. На эту статью поступил вопрос, который отправил меня в очередное расследование о том, как работает React, что, в свою очередь, в какой-то момент заставило меня усомниться во всем, что я знаю о React, и даже ненадолго усомниться в собственном здравомыслии.
// wrapping MovingComponent in memo to prevent it from re-rendering
const MovingComponentMemo = React.memo(MovingComponent);
const SomeOutsideComponent = () => {
// trigger re-renders here with state
const [state, setState] = useState();
return (
<MovingComponentMemo>
<!-- ChildComponent will re-render when SomeOutsideComponent re-renders -->
<ChildComponent />
</MovingComponentMemo>
)
}
https://www.developerway.com/posts/react-elements-children-parents
✍️ @React_lib