Oliver's Notesblog.mrakovics.com

Next.js Blog Posts: Bauen mit Next.js

CMS-Bilder in Next.js mit getImageProps optimieren

Next.js

Wenn du Inhalte aus einem CMS wie WordPress renderst, kommen die Bilder womöglich als nackte <img src="..." alt="...">-Tags an: kein srcset, kein Lazy Loading, kein WebP. Next.js kann sie nicht automatisch anfassen, weil sie in einem rohen HTML-String stecken, nicht in einem React-Komponentenbaum. Dieser Beitrag zeigt, wie du Next.js' getImageProps nutzt, um in jedes Bild ein sauberes srcset, WebP-Konvertierung, Lazy Loading und responsive Größenangaben einzuschleusen, bevor es überhaupt im Browser ankommt.

CMS-Bilder in Next.js mit getImageProps optimieren