Eleventy
Eleventy is the generator that does least by default and hides least when you add to it. It writes the HTML your templates produce and nothing else, which makes it predictable at scale and means many production concerns — minification, image processing, highlighting, sitemaps — are small pieces of configuration you own. The guides below are mostly those pieces, each measured on real sites from a few hundred to 10,000 pages.
Build speed runs through many of them: incremental mode, caching processed images between CI runs, and where Eleventy is faster or slower than Astro on the same documentation corpus. If you are choosing between the two, start with the comparisons at the top.
Choosing the Right Static Site Generator for Production
- Astro vs Eleventy Build Times at 10,000 PagesComparisonAstro and Eleventy benchmarked on the same docs corpus from 1,000 to 10,000 pages: cold, warm and one-page-edit builds, memory, and where each scales badly.
- Astro vs Eleventy for Large Docs (1000+ Pages)ComparisonA decision guide for documentation sites of 1000+ pages — comparing Astro and Eleventy on build scaling, search, MDX/components, and authoring ergonomics with measured numbers.
- Content Collections vs the Eleventy Data CascadeComparisonTwo ways to model documentation content: a typed schema that fails the build, or a layered cascade that resolves at render. What each buys, and how to get validation in both.
- Dev Server Performance: Astro vs EleventyComparisonMeasure cold start, hot reload and memory for Astro and Eleventy dev servers on a 1,300-page docs site, and the settings that keep writers’ previews fast.
- Eleventy vs Jekyll for Markdown-Heavy BlogsComparisonFor thousands of Markdown files, compare Eleventy and Jekyll on parser config, data cascade, incremental-build reliability, and real build numbers from a 5,000-post corpus.
- Markdown Pipelines: remark vs markdown-itComparisonCompare the remark and rehype pipeline in Astro with markdown-it in Eleventy: plugin models, speed, custom syntax, heading anchors and link rewriting.
- Shortcodes vs Components for Docs AuthorsComparisonEleventy shortcodes and Astro components compared from the writer's chair: syntax, error messages, reuse, JavaScript cost and how to keep the vocabulary small.
- Choosing an SSG for API Reference DocumentationConceptAPI docs are generated, versioned and enormous. Compare Hugo, Astro, Eleventy and Next export on build scale, schema-driven pages, versioning and search.
- Picking an SSG for a Multi-Language Docs SiteConceptCompare i18n in Astro, Hugo, Eleventy, and Jekyll for multi-language documentation — routing, content organization, and build cost — with measured numbers across locales.
- Total Cost of Ownership for Static Site GeneratorsConceptEstimate the three-year cost of running a static site on Hugo, Eleventy, Astro, Next.js export or a docs framework: people time, builds, hosting, upgrades.
- Adding JSON-LD Structured Data at Build TimeHow-toEmit valid JSON-LD from frontmatter in Astro, Eleventy and Hugo: build objects not strings, pick the right schema.org types, and validate every page in CI.
- Building a Lunr Index at Build Time in EleventyHow-toGenerate a prebuilt Lunr search index from Eleventy collections, keep it small with field boosts and stop words, and load it only when readers search.
- Migrating a WordPress Export to EleventyHow-toConvert a WordPress XML export into Eleventy Markdown with front matter, images, categories and comments, keep every URL with redirects and verify parity.
- Multilingual Eleventy Sites With the i18n PluginHow-toBuild a multilingual Eleventy site with the official i18n plugin: per-language folders, locale-aware links and dates, translated strings and a switcher.
- Porting Shortcodes and Includes Between GeneratorsHow-toMap Jekyll includes, Hugo shortcodes, Eleventy shortcodes and MDX components onto each other — with a census-first strategy, stub-then-port order, and a rendering test per component.
- RSS and Atom Feeds for Static BlogsHow-toPublish valid RSS and Atom feeds from Eleventy, Astro or Hugo with full content, absolute URLs, stable IDs and correct headers, then check them in CI.
- Replacing Jekyll Plugins When Migrating to EleventyHow-toMap common Jekyll plugins — jekyll-seo-tag, jekyll-feed, jekyll-paginate, jekyll-picture-tag — to their Eleventy equivalents, with config and measured build impact.
- SEO-Safe Pagination and Tag PagesHow-toGenerate crawlable pagination and useful tag archives in Eleventy and Hugo: plain links, self canonicals, a minimum tag size and no thin date archives.
- Sidebar Navigation in Astro and EleventyHow-toBuild a docs sidebar from content in Astro and Eleventy: ordering, nesting, active state, collapsed sections, page weight, and keeping incremental builds fast.
- Syntax Highlighting with Shiki in Astro and EleventyHow-toHighlight code at build time with Shiki in Astro and Eleventy: dual light and dark themes, line annotations, build-time cost and zero runtime JavaScript.
- Upgrading Eleventy 2 to 3 With ESM ConfigurationHow-toUpgrade an Eleventy 2 site to Eleventy 3, convert config and data files to ESM, fix plugin and filter breakage, and diff the output against the old build.
- hreflang and Language Alternates on Static SitesHow-toGenerate reciprocal hreflang alternates from a translation key at build time in Hugo, Astro or Eleventy, and validate every language group in CI.
- Fixing Duplicate Permalink Errors in EleventyFixFind which templates produce the same output path in Eleventy, fix the usual causes in pagination, slugs and data files, and catch collisions in CI.
- Fixing Eleventy Out-of-Memory Errors on Large CollectionsFixDiagnose "JavaScript heap out of memory" in Eleventy builds of large collections, cut peak memory with data and template fixes, and size the Node heap safely.
Core Web Vitals Optimization for SSGs
- Art Direction with the Picture ElementHow-toServe different crops of a hero image to mobile and desktop with picture and media queries in Astro, Eleventy and Hugo, without hurting LCP or causing layout shift.
- Blur-Up Placeholders with LQIPHow-toGenerate tiny blurred placeholders for images at build time in Astro or Eleventy, inline them without slowing LCP, and decide when a solid colour is better.
- Caching Processed Images Between BuildsHow-toPersist Astro and Eleventy image caches between CI builds so AVIF and WebP variants are generated once, with correct cache keys, pruning and measured build times.
- Generating Open Graph Images at Build TimeHow-toRender a unique social preview image for every page at build time with Satori and resvg, cache the output, and wire og:image tags into Astro, Hugo or Eleventy.
- How to Reduce Bundle Size in Eleventy BuildsHow-toCut JavaScript in Eleventy builds — scope scripts per route, tree-shake and bundle with esbuild, and defer third-party code. Concrete before/after KB numbers.
- Lazy-Loading Images Without Hurting LCPHow-toloading="lazy" saves bytes below the fold but delays the LCP image when applied to it. How to decide per image, per template, in Astro, Hugo and Eleventy.
- Minifying HTML, CSS and JS in EleventyHow-toMinify Eleventy output safely with html-minifier-terser, Lightning CSS and esbuild, keep code blocks intact, and measure what minification saves after brotli.
- Precompressing Assets with Brotli and ZstdHow-toPrecompress static site output at build time with brotli 11 and zstd 19, serve the variants from Caddy, nginx or Cloudflare, and measure the transfer saving.
- Responsive Images with srcset in EleventyHow-toGenerate AVIF, WebP and JPEG widths with @11ty/eleventy-img, emit srcset and sizes that match your layout, and cache the output so builds stay fast.
Production-Ready Deployment & CI/CD for SSGs
- Incremental Rebuild Times Across Astro, Eleventy and HugoComparisonAstro, Eleventy and Hugo measured on the same 5,000-page site for full, cached and single-page rebuilds, in CI and the dev server, with what each skips.
- Vercel ISR vs Static Generation for SSGsComparisonISR rebuilds pages on demand; static generation builds everything upfront. Astro, Eleventy, Hugo, and Jekyll have no ISR — they rebuild and purge at the CDN.
- Automating Eleventy Deployments on Cloudflare PagesHow-toDeploy Eleventy from Git on Cloudflare Pages: connect the repo, set the build command and _site output, pin Node, wire env vars, and ship cache headers — with build times.
- Build Caching on Netlify and VercelHow-toMake Netlify and Vercel reuse dependency, framework and image caches between static site builds, verify cache hits in logs, and measure the savings.
- Configuring Vercel for Hugo and EleventyHow-toDeploy Hugo and Eleventy sites on Vercel with pinned versions, the right output directory, clean URLs, trailing slashes, headers and redirects in vercel.json.
- Enabling Incremental Builds in EleventyHow-toUse Eleventy --incremental and --ignore-initial to rebuild only changed templates. Covers the programmatic API, what gets rebuilt, and measured rebuild times.
Often used with Eleventy
- Astro22 shared guidesIslands, content collections, astro:assets and deployment.
- Hugo15 shared guidesBuild time at scale, image caches, modules and multilingual sites.
- Jekyll5 shared guidesPlugins, reproducible builds, upgrades and migration away.
- Vercel3 shared guidesNon-Next.js generators, the Build Output API and caching.
- Next.js2 shared guidesStatic export for content sites, its limits and alternatives.
- Cloudflare2 shared guidesPages and Workers hosting, cache rules and edge functions.