Generating AVIF images is very slow about twelvety HOT 7 CLOSED

Thank you both for your comments! I'll experiment with reducing the quality of both AVIF and WEBP to see how much that improves build times. If it still takes a long time, I'll consider adding a permanent cache or giving the user the option of what image formats to output.

from twelvety.

I think that is a good solution.

from twelvety.

Malte Ubl, over at https://github.com/google/eleventy-high-performance-blog , added a cache option since sharp converting to avif was so slow.

#!/bin/sh

cp _site/img/remote/* img/remote/
cp _site/img/* img/
git status
git add img/
git commit -m "Persist images"

The script is titled .persistimages.sh and it is mentioned while the blog is building if the conversion is running slow.

Just a thought if you wanted to cache the images.

from twelvety.

In my personal code, i've reduced the quality of the avif files to around 35. This has sped up creation times and have created the great looking images at about 50% of the WebP sizes.

from twelvety.

I've also reduced the WebP quality to 60 as it also still maintains a very good quality at that range.

from twelvety.

I've created a pull request which adds image formats to the Twelvety options file .twelvety.js, so that users can easily disable a format and change the quality. Do you think this is a good solution?

from twelvety.

Hi, I think that is a good solution and your implementation is very good! Sorry I didn't get to answer you yesterday!

I would almost recommend updating the twelvity.imageFormats to be more explicit:

 imageFormats {
   avif: {
    extension: "avif",
    quality: 30
  },
   webp: {
    extension: "webp",
    quality: 60
  },
   jpeg: {
    extension: "jpeg",
    quality: 75
  }
}

This way, future users know what the "Numbers" stand for and what they are setting and also enables future properties to be added with minimal work (e.g. set a custom background color for that image while loading in case you don't want to use the generated color: backgroundLoadingColor: "#FEFEFE")

Cheers 🍻

from twelvety.