Reactガイドを読んでいくその80

これは

Reactのガイドを読んでいく記事です。

ガイドのリンク

ja.reactjs.org

差分検出処理

差分アルゴリズム

2つのツリーが異なっている場合Reactは最初に二つのルート要素を比較する。

異なる型の要素

Reactの機能として、ルート要素が異なる型を持つ場合は必ず古いツリーを削除して新しいツリーを構築する。
ツリーが削除されることで古いDOMノードは破棄され、コンポーネントインスタンスはcomponentWillUnmount()を受け取る。名称からもわかる通り破棄するつもりなのでよろしくってことですね。
その後はcomponentWillMount()とcomponentDidMount()を受け取り古いツリーに関連したstateはなくなる。

<div>
  <Counter />
</div>

<span>
  <Counter />
</span>

上のようなコードがあった場合は古いものは削除されて新しいものがマウントされる。

今日はここまで。