Framework Guides· 6 pages

Image optimization guides by framework and CMS

Stack-specific guidance for shipping responsive images, modern formats, and sane delivery defaults without guessing.

These pages target implementation intent. Each guide turns a broad question like “Next.js image optimization” into a concrete stack-specific checklist, example, and failure pattern.

Pages in this section

  1. № 01Framework Guide

    Next.js image optimization guide

    How to ship responsive images in Next.js with sane remote patterns, right-sized assets, and predictable LCP behavior.

    Teams already using next/image
  2. № 02Framework Guide

    Nuxt image optimization guide

    How to use Nuxt Image for responsive formats, predictable widths, and cleaner media delivery in Nuxt 3.

    Nuxt 3 sites with mixed local and CDN media
  3. № 03Framework Guide

    Astro image optimization guide

    How to use Astro assets, responsive layouts, and remote image rules without bloating static builds.

    Content-heavy static or hybrid Astro sites
  4. № 04Framework Guide

    Eleventy image optimization guide

    How to use Eleventy Image for responsive output, controlled widths, and manageable build performance in static publishing workflows.

    Static publishing teams using Eleventy
  5. № 05CMS Guide

    WordPress image optimization guide

    How to improve WordPress image delivery with native responsive images, cleaner source assets, and fewer plugin-induced regressions.

    Content and marketing teams on WordPress
  6. № 06CMS Guide

    Shopify image optimization guide

    How to optimize Shopify storefront images with the platform CDN, responsive Liquid markup, and product-photo discipline.

    Storefront teams running product-heavy Shopify themes

Quick answers

Why group image optimization by framework?

Because the defaults, components, and failure modes differ across stacks. Good framework pages answer implementation intent directly instead of repeating generic advice.

What should a framework image page include?

A stack-specific code example, sizing strategy, format guidance, metrics to watch, and the mistakes teams actually make in that ecosystem.