🐛 Bug: Allcontributors table images should have loading=lazy

[JoshuaKGoldberg]

Bug Report Checklist

• [X] I have tried restarting my IDE and the issue persists.
• [X] I have pulled the latest main branch of the repository.
• [X] I have searched for related issues and found none that matched my issue.

Expected

Images in the allcontributors table should have loading="lazy" so that they don't slow down initial page load or render.

Actual

I tried loading https://github.com/JoshuaKGoldberg/create-typescript-app in a throttled network connection and noticed a lot of images loading right away. They even seemed to be blocking first page render Yuck.

Additional Info

This might involve fixing on the allcontributors side?

I also don't know if this is possible in GitHub's markdown renderer... but it really should be. If it isn't, I should find a place to request it / upvote an existing request.

[johnnyreilly]

I very much like this idea (having written about how to do this in Docusaurus and helped make it the default behaviour for Docusaurus I declare an interest 😄 )

Looking at the README.md, it should just work; https://raw.githubusercontent.com/JoshuaKGoldberg/create-typescript-app/main/README.md

However, the proof is in the pudding. I'm going to tweak the README on a branch and see if it works.

[johnnyreilly]

So in tragic news, I don't think this is doable unless the GitHub Markdown rendered changes. Consider:

I tweaked the README.md on the test-loading-lazy branch: https://github.com/JoshuaKGoldberg/create-typescript-app/blob/test-loading-lazy/README.md and hacked in loading="lazy" attributes. Then I went to: https://github.com/JoshuaKGoldberg/create-typescript-app/tree/test-loading-lazy

And as the screenshot of devtools shows, the loading="lazy" were stripped by the GitHub Markdown renderer. So unless that changes, there's not a way forward. How to find out....

[johnnyreilly]

BTW feel free to delete the branch - don't want to clutter. More just wanted to demostrate my findings!

[johnnyreilly]

The library GitHub uses for Markdown rendering seems to be:

https://github.com/gjtorikian/commonmarker

(If I understand https://github.com/github/markup right)

Potential issue:

Please note that only the first step is covered by this gem - the rest happens on http://GitHub.com. In particular, markup itself does no sanitization of the resulting HTML, as it expects that to be covered by whatever pipeline is consuming the HTML

[johnnyreilly]

So commonmarker wraps the rust library https://github.com/kivikakk/comrak

I've had a little dig through that and don't detect any special processing around images. This makes it seem likely that (as per comment above) GitHub itself does the loading attribute stripping. As such, unless we can influence GitHub in some way, I don't think we can do anything about this issue.

[johnnyreilly]

I've raised a request with GitHub support to discuss whether the loading="lazy" attribute could be allowlisted on GitHub.com.

https://support.github.com/ticket/personal/0/2692240

[johnnyreilly]

It's a requested feature, this issue cannot advance unless the following is implemented:

https://github.com/orgs/community/discussions/42558

See also: https://gist.github.com/kivikakk/622b5dcf395e26c49e2334f0eb19e6f9

[JoshuaKGoldberg]

Thanks for the investigation, great finds!