← Knowledge Base • platform

Eleventy (11ty)

A simpler static site generator focused on flexibility and zero client-side JavaScript.

What is Eleventy?

Eleventy (11ty) is a simpler static site generator that transforms templates into HTML. Created by Zach Leatherman in 2018, Eleventy emphasises flexibility and simplicity,it works with your existing workflow rather than imposing its own.

Eleventy is designed for developers who want a straightforward, zero-config static site generator that doesn’t require a specific JavaScript framework. It’s deliberately unopinionated about project structure and template languages.

Open-source under MIT license with a growing community and ecosystem.

Architecture and Technology

Eleventy generates static HTML from templates without runtime JavaScript.

Core Principles

  • Zero client JS: No JavaScript shipped by default
  • Template agnostic: Supports 11 template languages
  • Config optional: Works without configuration
  • Data cascade: Flexible data inheritance system

Template Languages

Eleventy supports:

  • Nunjucks, Liquid, Handlebars
  • Markdown, HTML, JavaScript
  • Pug, EJS, Haml, Mustache
  • Custom template engines

Data Sources

  • Front matter in templates
  • Global data files (JSON, JS)
  • Directory data files
  • Computed data
  • Fetched remote data

Typical Use Cases

Eleventy is commonly used for:

  • Personal blogs: Developer blogs and journals
  • Documentation sites: Simple, fast docs
  • Portfolio sites: Designer and developer showcases
  • Corporate sites: Marketing and brochure sites
  • Newsletters: Static archives
  • Jamstack projects: Content-driven sites

Strengths

  • Simplicity: Easy to understand and use
  • Flexible templates: Use any supported template language
  • Zero client JavaScript: Pure static HTML output
  • Fast builds: Quick generation times
  • No framework lock-in: Not tied to React, Vue, etc.
  • Data cascade: Powerful, intuitive data management
  • Active development: Regular updates and improvements

Limitations and Trade-offs

  • No built-in bundling: Requires external tools for CSS/JS
  • Manual interactivity: JavaScript features require setup
  • Plugin ecosystem: Smaller than larger frameworks
  • Image handling: Plugins needed for optimization
  • Learning resources: Less content than React-based options

SEO, Performance, and Content Governance

SEO

Pure static HTML with complete control over output. Excellent for SEO with proper meta tag implementation.

Performance

Zero JavaScript by default means optimal Core Web Vitals. Image optimization via plugins.

Content Governance

Git-based workflow by default. Integrates with any Git-based CMS.

Tips and Best Practices

  • Start simple and add complexity as needed
  • Use data files for reusable content
  • Leverage the data cascade for DRY templates
  • Add image plugin for responsive images
  • Consider Vite for asset processing
  • Explore plugins in the directory

Who Should (and Should Not) Choose Eleventy

Best Fit For

  • Developers wanting simplicity
  • Projects not needing React/Vue
  • Performance-focused sites
  • Teams with existing template preferences
  • Static content sites

Not Ideal For

  • Complex interactive applications
  • Teams wanting React-like DX
  • Projects needing extensive SSR
  • Non-technical content teams

Common Alternatives

  • Hugo: Faster builds, Go templates
  • Astro: Islands architecture, framework components
  • Jekyll: Ruby-based, GitHub Pages native
  • Gatsby: React-based, more features

Eleventy excels for developers wanting maximum simplicity with minimal overhead.