Usage Skipping re-rendering of components Updating state from a memoized callback Preventing an Effect from firing too often Optimizing a custom Hook
// components/MetronicHeader.js import Image from 'next/image'; const MetronicHeader = () => ( <header> <Image src="/metronic/images/logo.png" alt="Logo" width={100} height={50} /> </header> ); export default MetronicHeader;