Images with DashImage

import { DashImage } from "dash4devs/react";

<DashImage src={product.main_image} alt={product.name} width={800} />

DashImage builds a srcset from the image's size ladder on cdn.dashfordevs.com, so a phone downloads a small file and a large screen never gets less than the uploaded resolution.

• Paths under the CDN's folders (/content/, /inventory/, /media/, /sites/) are resolved against the CDN.
• Your site's own files (/images/logo.svg) stay on your site.
• cdnImageUrl(path) from dash4devs/utils does the same for your own markup.

If you also use next/image, allow the CDN host:

// next.config.js
images: { remotePatterns: [{ protocol: "https", hostname: "cdn.dashfordevs.com" }] }