Reactの仮想DOMを更新する

Reactの仮想DOMを更新する

Reactには仮想DOMという機能があります。この機能はDOMの状態をメモリ上に保持して更新前後の変更箇所の実を更新するという仕組みらいしく、その為、レンダリングが非常に速いという特徴があるようです。

setIntervelメソッドを使用して、1秒ごとにrenderメソッドを呼び出し、再描画してみます。

<div id="koko"></div>
<script type="text/babel">
  setInterval(tm, 1000);

  function tm() {
    const sec = (new Date()).getSeconds();
    const tag = <div>{sec}</div>;
    ReactDOM.render(
      tag,
      document.getElementById("koko")
    )
  }
</script>

サンプル

高橋

KHI入社して退社。今はCONFRAGEで正社員です。関西で140-170/80～120万から受け付けております^^
得意技はJS(ES6),Java,AWSの大体のリソースです
コメントはやさしくお願いいたします^^
座右の銘は、「狭き門より入れ」「願わくは、我に七難八苦を与えたまえ」です^^