JSS NextImageコンポーネント
Version:
日本語翻訳に関する免責事項
このページの翻訳はAIによって自動的に行われました。可能な限り正確な翻訳を心掛けていますが、原文と異なる表現や解釈が含まれる場合があります。正確で公式な情報については、必ず英語の原文をご参照ください。
Next.jsには、ページの読み込みとレンダリングのパフォーマンスを向上させるのに役立つ最適化された画像レンダリングコンポーネントであるnext/imageが用意されています。Next.jsが提供するnext/imageコンポーネントをJSSアプリケーションで使用するのを容易にするために、@sitecore-jss/sitecore-jss-nextjsパッケージではバージョン20.1.0でNextImageコンポーネントが導入されています。
NextImageコンポーネントは、JSS Imageコンポーネントやnext/imageコンポーネントと同様に使用できますが、NextImageは追加のプロパティをサポートし、カスタム・ローダーを使用します。
next/imageコンポーネントと同様に、JSS NextImageコンポーネントを正しく使用すると、次のようになります。
-
各デバイスに対して適切なサイズの画像を最新の画像形式で提供します。
-
ページの 視覚的な安定性 を向上させます。
-
遅延読み込みと視覚的に魅力的なプレースホルダーにより、ページの読み込み時間を改善します。
-
イメージがローカルに保存されているかリモートに保存されているかに関係なく、必要に応じてサイズを変更します。
メモ
NextImageコンポーネントを使用するには、@sitecore-jss/sitecore-jss-nextjsをバージョン20.1.0以降に更新する必要があります。