#プログラミング勉強日記
2020年9月13日
JSには色々なフレームワークがあって、開発の用途によって使用するフレームワークが違うと思うので、まとめてみようと思う。ReactについてとAngularについて、Vue.jsまとめたので、今回はNext.jsについてまとめる。
#Next.jsとは
Reactの特徴の記事でも述べているが、Reactはフレームワークではなくライブラリである。Next.js(読み方「ネクストジェイエス」)はZEIT社が開発したJSのフレームワーク。
Reactと組み合わせてWebアプリ開発を強化するフレームワークで、ReactのアプリのJSで行う画面の書き換えの処理をサーバー側で実行させて待機時間を短くするサーバーサイドレンダリングを可能にする。
#サーバーサイドレンダリング(SSR)を実現する
上でも述べたように、JSは基本的にページのレンダリング(表示)時に実行される。なので、ページの大部分をJSに頼っていた李、ReactなどでSPA(Single Page Application)のような状態になっていると、初めてページを開くときに時間がかかってしまう。また、GoogleのクローラはJSを読み込んで結果を評価することもできるが、それもすべてではない。
こういったSEO(検索エンジン最適化)やパフォーマンスの観点からページをレンダリングする前にJSの処理をサーバー側で行うことでユーザの待機時間を短くできる。
#参考文献
Next.jsとは？JavaScriptフレームワークについて解説
Next.jsの環境構築【これからはじめるNext.js】