【Next.js】ハイドレーション & プリレンダリング / 簡単な例、考察を添えて。

import { useState } from "react"; function Hello() { const [count, setCount] = useState(0); return ( <> <div>{count}</div> <button onClick={() => setCount(() => count + 1)}>click here!</button> </> ); } export default Hello; Chromeのネットワークタブを確認します。 レスポンスのHTMLは、以下のようなページを構成しています。 例えば通常のreactアプリケーションにアクセスすると、 以下のHTML要素が返ってきます。返した後に、空のdivの要素内にコンポーネント等の要素が追加されていく流れになります。 では同じSPAアプリケーションなのになぜnext.jsは HT