BT

最新技術を追い求めるデベロッパのための情報コミュニティ

寄稿

Topics

地域を選ぶ

InfoQ ホームページ ニュース Next.js 9.5では静的サイト再生成のパフォーマンスが改善

Next.js 9.5では静的サイト再生成のパフォーマンスが改善

原文(投稿日:2020/08/17)へのリンク

Next.jsは、VercelのオープンソースのReactベースのフレームワークであり、Next.js 9.5リリースで静的サイト生成パフォーマンスについてのいくつかの改善があった。このリリースでは、開発者がオプションでWebpack 5ベータ版にオプトインして、より小さくて高速なビルドを行うこともできる。

多くの最新のJavaScriptフレームワークと同様に、Next.jsは9.3リリースで静的サイト生成機能が加わった。Next.jsはバージョン9.5で静的サイト生成についての追加機能があり、いくつかの新しいオプションを提供する。そのオプションの1つに、静的サイト全体を再構築せずに、デプロイ後に静的ページを迅速に再構築するものがある。

このアップデートで導入された技術により、ページがリクエストされたときに既存の静的ページを再レンダリングして、サイト上のページへのアクセスにおいて中断が発生しないようにできる。従来の静的なサイトレンダリングと比較して、待ち時間のスパイクがなく、ページがオフラインになることはなく、データベースとバックエンドのパフォーマンスは効率的となる。

Next.js 9.5で導入されたもう1つの変更グループは、ベースパスの構成、オプションのURL末尾のスラッシュ、および、リライト、リダイレクト、リクエストヘッダーのサポートに関連している。

Next.js 9.5では、ページバンドルの永続キャッシュが導入され、ビルド識別子の代わりにコンテンツハッシュが利用される。このコンテンツハッシュにより、JavaScriptバンドルが変更されていない場合、リリース間でページをキャッシュできる。

9.5リリースは、Next.js 9.4で導入されたホットモジュールローディング向けの高速リフレッシュアプローチに基づいて構築された。9.5リリースでは、エラーメッセージ、コンポーネントの状態、容易にトラブルシューティングのための情報を目的とした優れた開発ツールが提供されている。Next.js 9.5では、React Profiler APIを活用して、本番のパフォーマンス問題を特定することもできる。

webpack 5はベータ版のままだが、Next.js 9.5は、今後のwebpackリリースの改善される機能を活用するオプションのサポートを提供する。例えば、ツリーシェイクの改善版、永続的キャッシング、確定的チャンクとモジュール識別子がある。webpack 5ベータ版を活用するには、ユーザはpackage.jsonを更新し特定のwebpackバージョンを指定する必要がある。Next.js 9.5のいくつかの改良点は、さまざまなwebpackミドルウェアの依存関係の削除など、webpack 5のサポートに役立つ。webpack 5へのアップグレードは簡単だが、カスタムwebpack構成を使っている開発者は、構成の互換性を検証する必要がある。

Next.js 9.5リリースに対するコミュニティの反応非常にポジティブであり、静的サイト生成と増分再レンダリングの改善に対してもである。

Next.jsは、MITライセンスの下で利用可能なオープンソースソフトウェアである。Next.jsのコントリビューションガイドライン行動規範に従って、Next.js GitHubリポジトリから貢献を歓迎する。

この記事に星をつける

おすすめ度
スタイル

BT