next/image component mang lại lợi ích gì?

next/image tự động: resize và optimize images theo viewport, serve WebP/AVIF modern formats, lazy load mặc định, prevent Cumulative Layout Shift (CLS) với width/height hoặc fill.

• Cần cung cấp width và height hoặc fill prop.
• Cấu hình allowed domains trong next.config.
• Tích hợp CDN support sẵn.

next/image automatically: resizes and optimizes images for each viewport, serves modern WebP/AVIF formats, lazy loads by default, and prevents Cumulative Layout Shift (CLS) when you provide width/height or the fill prop.

• Configure allowed remote domains in next.config.
• CDN support is built in.