11ty / eleventy-img

Utility to perform build-time image transformations.

Home Page:https://www.11ty.dev/docs/plugins/image/

Geek Repo:Geek Repo

Github PK Tool:Github PK Tool

slow initial build time

btrem opened this issue · comments

My initial build time when I use 11th-img with --serve is really slow, even though all the images are already on the disk and I've enabled disk cache:

[11ty] Copied 26 files / Wrote 295 files in 350.65 seconds (1188.6ms each, v1.0.2)

Incremental builds while the server is running are fine:

[11ty] Copied 26 files / Wrote 295 files in 1.61 seconds (5.5ms each, v1.0.2)

If I skip the image processing, the initial build is lightning fast:

[11ty] Copied 26 files / Wrote 295 files in 2.97 seconds (10.1ms each, v1.0.2)

Is that normal? Does 11ty-img need to load every image from disk into memory? If I'm doing something wrong, are there tools to figure out where the bottleneck lies?

Should only be slow on the first ever build. It reads all the images, processes them, and saves the processed images to the output folder.

As long as the processed image exists in the output folder, it will not be processed again. A common pitfall is when you delete the output folder, say maybe in an npm script on build.

If you can make a repository that reproduces this behaviour with minimum code, I'll be happy to help you debug.

I'm not deleting the folder. (I can see images dated weeks or months in the past.)

Thanks for offering to help. I'll pare down my 11ty site folder and create a github repo. Or maybe I'll figure it out when I pare things down, in which case I'll reply here what the problem was.

@zeroby0 : I created a repo of a pared down version of my site, available here:

https://github.com/btrem/11ty_img_test

The repo doesn't include the .jpeg files. Should I add them to the repo? Or would you rather I put them on Dropbox? (I think it is normal to not include binary files like bitmap images in a git repo.)

Edit: clarifies build times:

initial build

Initial build of pared down test site, before any responsive images have been created:

[11ty] Copied 1 file / Wrote 46 files in 562.30 seconds (12223.9ms each, v1.0.2)

The long time here is expected, since 11ty/image is processing and creating many images.

incremental build

Build time for incremental build after modifying a .md file, with 11ty server running:

[11ty] Copied 1 file / Wrote 46 files in 0.20 seconds (4.3ms each, v1.0.2)

rebuild time

Rebuild time, i.e., running the start script when responsive images already exist, and no new images have been added:

[11ty] Copied 1 file / Wrote 46 files in 97.30 seconds (2115.2ms each, v1.0.2)

This time is where there seems to be a problem. It takes more than a minute-and-a-half to write 46 files, even though there are no new images to process.

incremental build

Build time for incremental build after modifying a .md file:

[11ty] Copied 1 file / Wrote 46 files in 0.20 seconds (4.3ms each, v1.0.2)

rebuild time without running 11ty/image

Rebuild time without processing images (by returning from the pictureShortcode function before running image):

[11ty] Copied 1 file / Wrote 46 files in 0.26 seconds (5.7ms each, v1.0.2)

Note the difference between this rebuild and the rebuild time with pictureShortcode running, shown above.

incremental build

Build time for incremental build after modifying a .md file, without processing images:

[11ty] Copied 1 file / Wrote 46 files in 0.17 seconds (3.7ms each, v1.0.2)

PR #172 makes a dramatic difference:

[11ty] Copied 1 file / Wrote 46 files in 6.95 seconds (151.1ms each, v2.0.0-canary.33)

#172 is shipping with Eleventy Image v3.0.0—thank you!