Add "lazy loading" for mycodes

[Eldenroot]

Use native lazy-loading for web - https://web.dev/native-lazy-loading/#image-loading in mycodes to improve performance.

[euantorano]

Only problem I can see is this:

To prevent the surrounding content from reflowing when a lazy-loaded image is downloaded, make sure to add height and width attributes to the element or specify their values directly in an inline style:

We don't assign width and height attributes as far as I remember, so we would see reflowing. Not a particularly big deal in most cases, but some people might not want that I guess.

I still wish the HTML in the parser was all templates, so that we could easily let people add or remove attributes like loading="lazy" themselves.

[Eldenroot]

Yeah, with custom template it would be much easier to add by users.

[euantorano]

We might get around to that in 1.10 or another big release, it would certainly make life much easier.

[Ben-MyBB]

@euantorano do you want this added in to 1.8?

[euantorano]

Yeah, but not 1.8.23.

[Ben-MyBB]

Thanks, I'll give this one a look when I've got my others finished.

[Ben-MyBB]

Could we not just add the loading="lazy" attribute into the mycode_img template? @euantorano

Just for ease of reference the content of that template being:
<img src="{$url}"{$width}{$height} alt="{$alt}"{$css_align} class="mycode_img" />

[euantorano]

Yes, it should work I believe.

…

On Thu, 28 May 2020, at 14:06, Ben wrote: Could we not just add the loading="lazy" attribute into the mycode_img template? @euantorano <https://github.com/euantorano> Just for ease of reference the content of that template being: `<img src="{$url}"{$width}{$height} alt="{$alt}"{$css_align} class="mycode_img" />` — You are receiving this because you were mentioned. Reply to this email directly, view it on GitHub <#3971 (comment)>, or unsubscribe <https://github.com/notifications/unsubscribe-auth/AAFW24MLFXANIY6UX6HXTM3RTZOTXANCNFSM4MXA6WCA>.