Native lazy loading

[joepagan]

Hey, Thanks for your work.

I'm surprised by no reference to native loading in your package which was announced April 2019:
https://web.dev/native-lazy-loading/
https://twitter.com/addyosmani/status/1114777583302799360

Expected Behavior

• Should be able to relatively easily implement native loading="lazy" attribute on all elements

Current Behavior

• easy to implement on everything but a picture element, suggested implementation has no nested img element which means loading="lazy" cannot be applied to it.

<picture class="lozad" style="display: block; min-height: 1rem" data-iesrc="images/thumbs/04.jpg" data-alt="">
    <source srcset="images/thumbs/04.jpg" media="(min-width: 1280px)">
    <source srcset="images/thumbs/05.jpg" media="(min-width: 980px)">
    <source srcset="images/thumbs/06.jpg" media="(min-width: 320px)">
    <!-- NO img element -->
    <!-- instead of img element, there will be the last source with the minimum dimensions -->
    <!-- for disabled JS you can set <noscript><img src="images/thumbs/04.jpg" alt=""></noscript> -->
</picture>

Possible Solution

• rework the plugin so that we can add the nested img element inside of picture (just like you would normally) with the same attributes (as you normally would add to an img element)

<picture>
  <source media="(min-width: 800px)" srcset="large.jpg 1x, larger.jpg 2x">
  <img src="photo.jpg" loading="lazy">
</picture>

[ApoorvSaxena]

fixed by #225