kouの技術的メモ

学習した内容の定着やアウトプット用に開設しました

Reactの基本思想

Reactの基本思想でよく取り上げらられるのは3つ

・ 仮想 DOM(Virtual DOM) ・ コンポーネント指向 ・ 単方向データフロー

仮想DOM

React では JavaScript オブジェクトで DOM と同じ構造のノードツリーを再現 しておき、一連の処理結果の最終的な差分だけを元の DOM に書き戻すようにしたことで、開発者が何も考えなくてもそれらのオーバーヘッドを最小限に抑えてくれるようになった。 これを仮想DOMと言う。

コンポーネント指向

Web アプリケーションを構築するための再利用可能なカ プセル化された独自の HTML タグを Web 標準の技術だけで作成できる技術のことね。レゴブロック を組み合わせるように、用意されたものやカスタマイズされた UI タグを HTML の中で組み合わせ ていくことでアプリケーションを作ることを目指す考え。

  単方向データフロー

Vue や Angular はデータバインディングという方法を採用してる。 この方法はコンポーネントの階層がどんどん深くなっ ていくと、人間の頭では何が起こるか予測がつきづらくなってくる。 これを防ぐためにReact では、データは必ず親コンポーネントから子コンポーネン トへ一方通行で渡される。