Skip to content
New issue

Have a question about this project? Sign up for a free GitHub account to open an issue and contact its maintainers and the community.

By clicking “Sign up for GitHub”, you agree to our terms of service and privacy statement. We’ll occasionally send you account related emails.

Already on GitHub? Sign in to your account

Progressive jpegs aka. interlace true or -interlace plane #314

Open
jimboolio opened this issue Sep 30, 2024 · 2 comments
Open

Progressive jpegs aka. interlace true or -interlace plane #314

jimboolio opened this issue Sep 30, 2024 · 2 comments

Comments

@jimboolio
Copy link

Hello!

Is it possible to generate progressive jpgs with this library? I did not find any directions in docs or in other git issues here.

According to the libvips git issues, that library supports those with option interlace: true which I tried to set in image_options, but that did not work.

This is what I tried:

picture:
  source: assets/images/
  output: assets/images/
  image_options:
    jpg:
        interlace: true
    jpeg:
        interlace: true

The Jekyll conversion process shows me this: WARNING: The convert command is deprecated in IMv7, use "magick" which suggests me that the library is actually using imagemagic instead of the libvips. If the conversion is using imagemagic, I'd assume the option should be -interlace Plane instead, or something yaml formattable, I do not know what.

I tried this:

picture:
  source: assets/images/
  output: assets/images/
  image_options:
    jpg:
        interlace: Plane
    jpeg:
        interlace: Plane

My assumption of being able to use some custom options probably documented somehow in some upstream library would get me proper custom options and a collection of progressive jpg:s as a result, but I'm not sure about that. I tried to understand the code, it looks like the image_options would be a way to provide custom options to the underlying libvips or imagemagic libraries.

It is my first time trying Jekyll and I have not touched Ruby that many times before so my assumption of this kind of an custom option might be very wrong.

Regardless of what I have so far tried in those image_options I still get pictures, but according to some random website, the results are not progressive jpgs. But honestly I'd be surprised if it would have been this easy.

The reason I'm looking such option is that I'm expecting that my upcoming blog readers would often have very poor internet - because I often have in my area, so I expect that progressive jpg would bring quite some value to the reader experience.

@jimboolio
Copy link
Author

Okay, I realized that first of all, I did not read the docs thoroughly enough. I did not use _data/picture.yml.

I pretty much copypasted some options to there and now the _data/picture.yml looks like this, it does not work

presets:
  default:
    formats: [webp, original]
    widths: [200, 400, 800, 1600]
    link_source: true
    image_options:
      jpg:
        interlace: true
        strip_metadata: false

The issue however seems to be that the options here do not seem to accept these options at all.

But

After the Jekyll render has finished, I have bunch of jpeg images which I can just find with basic bash script and call imagemagic separately for each. It won't be pretty but it will work.

My immediate problem is solved for now so all that remains here is a small feature wish of having progressive jpeg support built in to jekyll_picture_tag, or if it exists already, some pointer to docs how could I begin using that. Thank you for this awesome plugin!

@jimboolio
Copy link
Author

For anybody else wishing for this feature, my workaround/hack goes as follows:

Set jekyll_picture_tag export quality to max, so that we wouldn't lose that much quality:

_data/picture.yml

presets:
  default:
    formats: [jpg, original]
    widths: [200, 400, 800, 1600]
    link_source: true
    format_quality:
        jpg: 100

Place this script to _plugins directory, it requires imagemagic to be installed as well as the identify command:

_plugins/convert-img.sh

#!/bin/bash

echo "Running image conversion script"

for IMG in $(find ./_site -regex '^.+-[0-9]+-.+.jpe*g$' -type f)
do
    QUALITY="$(identify -verbose $IMG | grep Quality | awk '{ print $2 }')"

    if [ 100 -ne $QUALITY ]
    then
        echo "Image quality of $IMG is not 100, potentially unintended image, exiting the script for safety"
        exit 1
    fi

    echo "Converting image $IMG to progressive JPEG"

    magick convert -interlace plane \
        -quality 60 \
        -strip \
        -sampling-factor 4:2:0 \
        $IMG $IMG
done

Then, by adding this to the _plugins directory too:

_plugins/convert-img.rb

Jekyll::Hooks.register :site, :post_write do |page|
    puts `./_plugins/convert-img.sh`
  end

That basically registers it as a jekyll plugin which executes after the whole site has been written. And as a result, the jekyll build command should convert all jekyll_picture_tag images into progressive ones, but skip the originals. Not a clean solution and it completely trashes all the image conversion optimizations made to the conversion libraries by converting twice. Let's forget time complexity and just say that it definitely works.

Sign up for free to join this conversation on GitHub. Already have an account? Sign in to comment
Labels
None yet
Projects
None yet
Development

No branches or pull requests

1 participant