Image Optimization

Summary

The built-in `next/image` component that automatically resizes, lazy-loads, and serves images in modern formats for better performance.

• 1Replace a plain `<img>` tag with `next/image` and compare the network payload.
• 2Learn the `priority` prop for above-the-fold images — it skips lazy loading.
• 3Configure `remotePatterns` in `next.config` to allow external image domains.