Core Web Vitals の改善

Next.js の機能を使用して、サンプルアプリケーションの Core Web Vitals を改善する方法を見ていきましょう。

このレッスンでは以下の内容を学びます:

• Lighthouse とは何か、そしてその使用方法
• 画像を自動最適化する next/image の使い方
• 初期 JS バンドルサイズを削減するためのライブラリやコンポーネントの動的インポート方法
• サードパーティスクリプトへの事前接続 (preconnect) 方法
• Next.js がデフォルトで行うウェブフォント読み込みの最適化
• 任意のサードパーティスクリプトの読み込み最適化方法