← All articles

Speeding Up Large 11ty Builds on Netlify

If your Eleventy site is starting to feel heavy on Netlify, a few small changes can make a noticeable difference.

Speeding Up Large 11ty Builds on Netlify

If your Eleventy site is starting to feel heavy on Netlify, a few small changes can make a noticeable difference. The biggest wins usually come from caching expensive work, cutting out deploy-time scans you do not need, and being more intentional about what Eleventy processes.


1. Persist the .cache folder between builds

Eleventy Image and Eleventy Fetch both use the .cache folder to avoid repeating expensive work. On Netlify, each build runs on a fresh machine, so without caching this folder, image processing and remote fetches will run again every time.

Install the plugin

npm install netlify-plugin-cache -D

Add to netlify.toml

[[plugins]]
package = "netlify-plugin-cache"

[plugins.inputs]
paths = [".cache"]

This is one of the biggest wins if you are using @11ty/eleventy-img or @11ty/eleventy-fetch.

Extra image win

Only generate the formats and sizes you actually need. Every extra width and format adds build time.


2. Turn off Netlify form detection

Netlify scans your HTML during deploys to detect forms. On large sites, this can slow things down quite a bit.

If you are not using Netlify Forms, turn this off.

In Netlify:

Forms → Usage and configuration → Form detection

If you are using Netlify Forms, leave it on. If you are using forms, you can actually turn this off providing there's no changes in your form code/inputs. It speeds up large site builds by quite a bit from experience.


3. Keep navigation collections small

The Eleventy Navigation plugin is efficient, but it still has to process every item you give it.

Avoid feeding your entire site into navigation.

Good approach

Only include pages that belong in navigation. You can create a custom 11ty collection that filters out things like blog articles or large data sets. Once again, on large sites I found a big performance improvement here.

This reduces:

  • collection size
  • template work
  • unnecessary processing

4. Cache remote data properly

If your site pulls data from APIs or CMSs, use @11ty/eleventy-fetch to cache responses.

import Fetch from "@11ty/eleventy-fetch";

export default async function () {
return await Fetch("https://example.com/api/posts", {
duration: "1h",
type: "json",
});
}

Combined with the .cache persistence, this avoids repeated network requests on every build.


5. Reduce collection bloat

Large collections can slow down builds, especially if you are tagging everything.

Quick wins

  • avoid catch-all tags unless needed
  • paginate large lists instead of rendering everything at once
  • limit what feeds into global collections

6. Be careful with computed data

Computed data runs across templates, so it can add overhead quickly.

Best practice

  • avoid global computed data doing heavy work
  • scope computed values to specific content types where possible

7. Clean up passthrough copy

Eleventy copies non-template files during builds. Large or messy asset folders can slow this down.

Check

  • remove unused assets
  • avoid copying source files (design files, exports, etc)
  • keep your input directory tidy

Final thoughts

Most performance gains come from small operational changes rather than big rewrites.

Persist your cache, disable what you do not need, keep collections lean, and be strict about what runs at build time.

That is usually enough to significantly reduce build times on larger 11ty projects.