Next.jsとは

NextJS

reactはSEOに弱い

Reactはクライアントサイドでレンダリングされます

クライアントがHTTPリクエストすると、空のHTMLとJSファイルを読み込んで、そのJSがレンダリングするため、クライアントがリクエストする前のHTMLには<div id=”root”></div>しか表示されていません

検索エンジンには中身のない記事だと認識されて検索結果に表示されなります

next.jsはSEOに強い

next.jsはビルド時にサーバーサイトで完全に静的なファイルを生成し、クライアントがHTTPリクエストしたらその静的ファイルを見せます(※この仕組みをStatic Generationといいます)

なので、検索エンジンにも中身のある記事だと認識されます

また、レンダリングしない分だけサイトの読み込み速度が速くなります

また、next/imageにより、ビルド時に画像を自動的に圧縮・リサイズしてくれるので更に速くなります

wordpressはサイトの読み込みが遅い

WordPressはサーバーサイドでレンダリング(PHPからHTMLコードを作成する作業)するため(=SSR)、サイトの読み込みが遅い

BACK