This seems like a reasonable request and therefore will support it. However, since lazy is a switch, it should be declared as an option.

image::file_name.ext[opts=lazy]

or

[%lazy]
image::file_name.ext[]

The converter would still output the loading attribute, of course.

I will accept a PR to include this in Asciidoctor 2.1.x.

Thank you for accepting the request!

The loading attribute can have the value eager and lazy both (MDN), so the syntax that I had suggested in the original comment (also shown below) makes more sense to me, @mojavelinux. It seems clearer and more understandable to me as well.

The syntax that I had suggested:

image::file_name.ext[loading="lazy", ...]

The loading attribute can have the value eager and lazy

That's true, but eager is the default. So there's no point specifying it. That's what allows us to look at "lazy" as a switch.

That's what allows us to look at "lazy" as a switch.

That might introduce problems in the future if browsers decide to add a third possible value.

At that point, we could introduce an attribute. But since no such value is anywhere in sight, I think we would be overdesigning by trying to accommodate it.

The loading attribute can have the value eager and lazy

That's true, but eager is the default. So there's no point specifying it. That's what allows us to look at "lazy" as a switch.

If this is an attribute, it can also be declared globally as :image-loading: lazy, and then overridden on a case-by-case basis with image::file_name.ext[loading=eager] (or vice-versa).
I don't think there is an easy way to do that with options?

I don't think there is an easy way to do that with options?

Yes there is. It would be image-lazy-option if we were to go that route.

I don't think there is an easy way to do that with options?

Yes there is. It would be image-lazy-option if we were to go that route.

Hmm and how would it be overridden (added/removed) for one instance?

You'd need to unset the attribute using an attribute entry, then set it again below the element. There's currently no way to indicate that an option be turned off on an element. That's something we hope to add to the language in the future.

In that case, I think an attribute will result in cleaner markup?
Additionally, since the HTML spec specifies loading=lazy and loading=eager, I feel it makes more sense to mirror that.
(For what it's worth, there used to be a third non-standard value supported by chromium, loading=auto but that has now been deprecated)

To allow switch-like behaviour, image::file_name.ext[opts=lazy] can be an alias for image::file_name.ext[loading=lazy]

@mojavelinux any update on the issue?
I'll be happy to create a PR for whichever form you think is best.

I'd be open to a PR. This issue is not a priority for me, but I will help push it through if you do the implementation and docs.

While this new feature is being developed, is there a way to add these attributes to images somewhere else before the generation of the HTML file?

@arturo32 for now, we are using a very hacky regex

 # Lazy load images
 sed -i -e 's/<img/<img loading="lazy"/g' "${public_dir}/html/summary/combined-summary.html";

https://github.com/OurTechCommunity/catchup/blob/72783d38e7c7d9f3b5902e4f98c904287183f842/util/build.sh#L101-L102

@arturo32 for now, we are using a very hacky regex

 # Lazy load images
 sed -i -e 's/<img/<img loading="lazy"/g' "${public_dir}/html/summary/combined-summary.html";

https://github.com/OurTechCommunity/catchup/blob/72783d38e7c7d9f3b5902e4f98c904287183f842/util/build.sh#L101-L102

Thank you very much! I think that will do!

Happy to help, but I can't vouch for using that for anything mission critical.
The safest way would be to patch your asciidoctor install based on my PR (#4348)

It would be much cleaner to use a postprocessor extension. See https://docs.asciidoctor.org/asciidoctor/latest/extensions/postprocessor/. You could also extend the converter and override convert_image or convert_inline_image. See https://docs.asciidoctor.org/asciidoctor/latest/convert/custom/

IMHO it would be nice to have a general option to make all images lazy.

We currently use the following slim extension:

= block_with_title({class: 'imageblock', style: (style_value text_align: (attr :align), float: (attr :float))}, :bottom)
  .content
    - if (attr :link)
      a.image href=(attr :link)
        img src=image_uri(attr :target) alt=(attr :alt) width=(attr :width) height=(attr :height) loading="lazy"
    - else
      img src=image_uri(attr :target) alt=(attr :alt) width=(attr :width) height=(attr :height) loading="lazy"

AFAICS this works fine.