add loading=lazy to images by default

[jimmywarting]

It would have been nice if images added the lazy loading technic on images.
https://developer.mozilla.org/en-US/docs/Web/Performance/Lazy_loading

example input:

[![Jimmy Wärting](https://github.com/jimmywarting.png?size=100)](https://github.com/jimmywarting) 

Example output:

<img loading="lazy" src="https://github.com/jimmywarting.png?size=100" alt="Jimmy Wärting">

[UziTech]

You could create and extension for that:

// marked-loading-lazy.js

export const loadingLazy = {
  name: 'image',
  level: 'inline',
  renderer(token) {
    const html = this.parser.renderer.image(token.href, token.title, token.text);
		return html.replace(/^<img /, '<img loading="lazy" ');
  },
};

import {marked} from 'marked';
import {loadingLazy} from './marked-loading-lazy.js';

marked.use({extensions: [loadingLazy]});

console.log(marked('![test](test.png)'));

// <p><img loading="lazy" src="test.png" alt="test"></p>

If you wanted to you could create an npm package so anyone who wanted it could use it.

[cestoliv]

As said in the documentation (https://marked.js.org/using_pro#renderer), you can define renderers for different html elements, including images, it looks like this:

marked.use({
	your options,
	renderer: {
		image(href, title, text) {
			return `<img loading="lazy" alt="${text}" title="${title}" src="${href}">`
		}
	}
})