NextJs の安定バージョンが登場 : 新機能は何ですか?-jsチュートリアル-php.cn

NextJs の安定バージョンが登場 : 新機能は何ですか?

Mary-Kate Olsen

リリース： 2024-10-23 06:28:01

オリジナル

332 人が閲覧しました

NextJs Stable Version Is Here : What

Next.js は 状況を一変させる爆弾を投下し、Next.js Conf の前に Next.js 15 の安定版をリリースしました。 –そしてそれはまったく正気の沙汰ではありません！ ?

Next.js 15 に詰め込まれた驚くべき新しい更新と機能の一部を以下に示します。

@next/codemod CLI によるアップグレードの改善: Next.js 15 には、最新の Next.js および React バージョンへのアップグレードが簡単になる新しい codemod CLI が含まれています。 CLI は依存関係を更新し、利用可能な codemod を表示し、それらを適用するためのガイダンスを提供します。
非同期リクエスト API: ヘッダー、Cookie、params、searchParams などのリクエスト固有のデータに依存する API は、非同期に移行しました。この変更は、Cookie、ヘッダー、draftMode、params (さまざまなコンテキスト内)、searchParams などの API に影響します。これは重大な変更ですが、移行に役立つ codemod が利用可能です。
キャッシュセマンティクスの変更: Next.js 15 では、フェッチリクエスト、GET ルートハンドラー、およびクライアントルーターキャッシュのデフォルトのキャッシュ動作が変更されます。これらはデフォルトでキャッシュされなくなりました。必要に応じてキャッシュを選択できます。
- フェッチリクエストでは、デフォルトのキャッシュオプションとして no-store が使用されるようになりました。つまり、デフォルトではキャッシュされません。キャッシュオプションを強制キャッシュに設定することで、キャッシュをオプトインできます。
- GET ルートハンドラーもデフォルトではキャッシュされません。静的ルート構成オプションを使用してキャッシュを選択できます。
- クライアントルーターキャッシュは、デフォルトではページコンポーネントをキャッシュしなくなりました。 next.config.ts で staleTime を設定することで、以前の動作に戻すことができます。
React 19 のサポート: Next.js 15 は、実験的な React コンパイラーを含む React 19 をサポートします。
- App Router は React 19 RC を使用しますが、Pages Router では React 18 との下位互換性が維持されます。同じアプリケーション内で Pages Router に React 18 を使用し、App Router に React 19 を使用することは、潜在的な不一致のため推奨されません。
- React コンパイラーは、手動によるメモ化を減らしてコードを簡素化することを目的としていますが、まだ実験段階にあるため、ビルド時間が遅くなる可能性があります。
安定した Turbopack 開発: 新しい Rust ベースのビルドシステムである Turbopack は、開発モード (next dev --turbo) で安定しました。これにより、サーバーの起動、高速リフレッシュ、および最初のルートコンパイルのパフォーマンスが大幅に向上します。
静的ルートインジケーター: この新しい視覚的なインジケーターは、開発中に静的ルートと動的ルートを識別するのに役立ちます。
unstable_after API:unstable_after API を使用すると、応答のストリーミングが終了した後にコードを実行できます。これは、ログ記録や分析など、ユーザーをブロックする必要のないタスクに特に役立ちます。
instrumentation.js API: この API を使用すると、開発者は Next.js サーバーのライフサイクルイベントを監視でき、パフォーマンスの追跡やエラー分析に役立ちます。
によるフォームの機能強化コンポーネント: 新しいこのコンポーネントは、プリフェッチ、クライアント側ナビゲーション、プログレッシブエンハンスメントなどの機能によりフォーム処理を簡素化します。
next.config.ts での TypeScript のサポート: Next.js 15 は、TypeScript next.config.ts ファイルをサポートし、構成オプションのタイプセーフティとオートコンプリートを提供します。
セルフホスティングの改善: Next.js 15 では、セルフホスティングの Cache-Control ヘッダーの制御が強化され、sharp を自動的に使用することで画像の最適化が簡素化され、セルフホスティングに関するデモとチュートリアルビデオが含まれています。 .
サーバーアクションのセキュリティの強化: Next.js では、ビルドプロセス中に未使用のサーバーアクションが排除され、クライアント側の参照に予測不可能な ID が利用されるようになり、セキュリティが強化されました。
外部パッケージのバンドル: Next.js 15 では、アプリルーターとページルーターの両方で外部パッケージをバンドルするための、より一貫した構成オプションが提供されます。 serverExternalPackages オプションを使用すると、統合管理が可能になります。
ESLint 9 サポート: Next.js 15 では、ESLint 8 との下位互換性を維持しながら ESLint 9 のサポートが導入されています。この更新には、次の lint での非推奨のオプションの削除と eslint-plugin-react- へのアップグレードも含まれています。バージョン 5.0.0.
開発とビルドの改善:
- サーバーコンポーネントのホットモジュール交換 (HMR) が改善され、ローカル開発のパフォーマンスが向上しました。
- 最適化されたレンダリングプロセスとワーカー間でのフェッチキャッシュの共有により、App Router での静的生成が高速化されます。
- 高度なユースケース向けに実験的な静的生成制御を導入しましたが、リソース消費の増加につながる可能性があるため注意が必要です。
その他:
- next/image、ミドルウェア、next/font、キャッシュ、構成オプション、Speed Insights、サイトマップ、動的ルート、再検証など、さまざまな領域にわたる重大な変更と改善。
- メタデータ処理、ツリーシェイキング、並列ルート、エラー処理、プリフェッチ、およびその他のいくつかの側面における全般的な改善。

「Next.js 15 リリースでは、サーバー側の機能が意図せず公開される問題にどのように対処しますか?」という疑問が生じます。

Next.js 15 リリースでは、サーバー側機能、特にサーバーアクションの意図しない公開に対処するための 2 つの機能強化が導入されています。

デッドコードの削除: アプリケーションで使用されていないサーバーアクションは、次のビルドプロセス中に自動的に削除されます。これにより、クライアント側の JavaScript バンドルに ID が公開されたり、パブリックエンドポイントが作成されたりすることがなくなります。
安全なアクション ID: Next.js 15 は、サーバーアクションに対して推測不可能で非決定的な ID を生成するため、攻撃者が推測して直接アクセスすることが困難になります。これらの ID は、セキュリティをさらに強化するためにビルド間で定期的に再計算されます。

これらの対策はサーバーアクションの危険性を完全に排除するものではないことに注意することが重要です。開発者は引き続きサーバーアクションをパブリック HTTP エンドポイントとして扱い、機密データと機能を保護するための適切なセキュリティ対策を実装する必要があります。

以上がNextJs の安定バージョンが登場 : 新機能は何ですか?の詳細内容です。詳細については、PHP 中国語 Web サイトの他の関連記事を参照してください。