React Domとは?(+水和物を使う理由!)

react 正式な書類を説明し、なぜ水和物を使用するのかを説明した.
TL;DR►renderは、水和物ではなくレンダリングを引き起こします.そのため、公式文書ではSSRに水和物を書くことを教えてくれます.

reactDOMとは?

If you load React from a script tag, these top-level APIs are available on the ReactDOM global. If you use ES6 with npm, you can write import ReactDOM from 'react-dom'. If you use ES5 with npm, you can write var ReactDOM = require('react-dom').
►  script tagから応答をロードすることにより、ReactDOMグローバルにおいてトップレベルAPIを使用することができる.
►ただし RealtDOMはグローバルで使用可能 同じです. react-domをインポートすると.

🤸‍♀️ 概要

The react-dom package provides DOM-specific methods that can be used at the top level of your app and as an escape hatch to get outside of the React model if you need to. Most of your components should not need to use this module.
►このreact-domパッケージは、アプリケーションの最上位レベルで使用できるDOM関連メソッドを提供します.必要であれば、反応モデルの外部から出る出口も提供されています!

🤸‍♀️ ブラウザのサポート

React supports all popular browsers, including Internet Explorer 9 and above,
►IE 9とIE 10の以前のバージョンでは多機能ペンが必要ですが、とにかく使用しないでください 最新のブラウザを使用します.

2.render()関数

ReactDOM.render(element, container[, callback])

Render a React element into the DOM in the supplied container and return a reference to the component (or returns null for stateless components).
► Elementは私たちが書いた反応コードです コンテナ DOMにレンダリングします.次いで、対応する要素の참조が戻される.戻り参照は、構成部品を指す情報を提供するようです.
If the React element was previously rendered into container, this will perform an update on it and only mutate the DOM as necessary to reflect the latest React element.
►React要素が以前にレンダリングされている場合は、必要に応じてDOMを変更して更新を実行し、最新のReact要素を反映します.
If the optional callback is provided, it will be executed after the component is rendered or updated.
►コールバックが指定されている場合は、レンダリングまたは更新後にコンポーネントが実行されることを示します.
🔆 Note!
ReactDOM.render() controls the contents of the container node you pass in. Any existing DOM elements inside are replaced when first called. Later calls use React’s DOM diffing algorithm for efficient updates.
►渡されるコンテナ「ノード」の内容を制御します.最初の呼び出しでは、内部の既存のDOMが置き換えられます.以降の呼び出しは「diffingアルゴリズム」を使用して有効に更新されます.
ReactDOM.render() does not modify the container node (only modifies the children of the container). It may be possible to insert a component to an existing DOM node without overwriting the existing children.
► コンテナノードは変更せずに、コンテナの子のみを変更します.既存のサブアイテムを上書きすることなく、既存のDOMノードにコンポーネントを挿入できます.
ReactDOM.render() currently returns a reference to the root ReactComponent instance. However, using this return value is legacy and should be avoided because future versions of React may render components asynchronously in some cases. If you need a reference to the root ReactComponent instance, the preferred solution is to attach a callback ref to the root element.
►現在のルート構成部品インスタンスへの参照を返します.しかし この戻り値は古いバージョン(以前は実装されていたが、現在は無効になっているようだ)であり、将来のバージョンではコンポーネントが非同期で表示されるため、この戻り値は使用しないでください.
Using ReactDOM.render() to hydrate a server-rendered container is deprecated and will be removed in React 17. Use hydrate() instead.
►►►以降このrender()は使用されなくなり、react 17から削除(!)私はあなたにやらせます.後で水和物()を使います.⭐️

水和物()関数とは?

<この部分は沈沈沈才の多くの文章を抜粋した(リンク)>
水和物の意味は「水化」です.手話は私たちの体に水分を補給する行為です.reactはなぜ水和物という用語を使うのでしょうか.
以上の提示関数は、反応元素を提示する関数である.このrender関数は、反応素子を容器のサブアイテムとして容器に入れます.既存の反応素子がレンダリングされている場合は、再レンダリングではなく更新のみが行われます.
逆に,水和物と呼ばれる方法を見る.

関数の表示

ReactDOM.hydrate(element, container[, callback

コードを確認します.レンダリングと外観はまったく同じです. では、なぜ反応はレンダリングではなく水和物の使用を要求するのでしょうか. 
水和物はレンダリングされず、イベントハンドラのみが貼り付けられます. 
サーバ側のレンダリングに寸法が埋め込まれている場合は、レンダリング方法を使用する必要はありません.SSRを使用する場合は、水和物のみを使用してコールバックすることができます.
クライアント側レンダリング(CSR)を使用する場合は、ターゲットコンテナが応答素子をレンダリングしたことがない可能性があるため、レンダリング方法を使用する必要があります.これは、CSRがJavaScriptコードが到着する前に空白の画面であり、レンダリング後に目的のUIを表示するためです.
ただし、SSRフレームワークとともにレスポンスを使用する場合、 hydrate 使用を検討する.ここでいう水和物は狭義の水和物である.수분 보충で水和物を発現した.以下の画像から水和物とは何かをよりよく理解することができる.

サーバーが完了したHTMLを解放します.このとき De水和物 水分を取るという意味です.言い換えれば 動的静的挙動をDe水和物と呼ぶ.その後JSを実行すると、応答は静的HTMLとstoreを動的応答素子ツリーとstoreに変換し、(Re)水和物と呼ぶ.のように思われる 水分のない静的状態から水分に満ちた動的状態に変化した.
問題はこのように水を補給すると これは、画面が繰り返し描画されることを意味します.リアクターはサーバーからダウンロードしたHTMLなので、画面に正しく表示されているかどうかはわかりませんが、自分のやるべきことをしただけです.サーバ上でHTMLとしてレンダリングされた画面は、1枚の画像にすぎません.この画面は反応器で管理されていません.したがって、SSRを行う場合は、ReactDomのレンダリング方法ではなく水和物法を使用する必要があります.
以上のように、水和物法はレンダリング方法とは異なり、レンダリング方法ではなくイベントハンドラを貼り付ける方法であり、SSRにはこの方法が必要である.reactでrenderの代わりに水和物を採用することは、reactもSSRがreactに進むべき方向であることを意味する.