Why not make the thumbnail image the Image element?

Hi there. Thanks for the best plugin!

I’ve been using it for years and just wanted to let you know something that came to mind recently.

Currently in LYTE, the thumbnail image is specified in the Style’s BackgroundImage, but why not change it to an Image element?

Current output code

<div class="lyte lP" id="WYL_xxx...">
    <div id="lyte_xxx" data-src="xxxxx/wp-content/plugins/wp-youtube-lyte/lyteCache.php?origThumbUrl=https%3A%2F%2Fi.ytimg.com%2xxx.jpg" class="pL">
        <div class="tC">
            <div class="tT"></div>
        </div>
        <div class="play"></div>
        <div class="ctrl">
            <div class="Lctrl"></div>
            <div class="Rctrl"></div>
        </div>
    </div>
</div>
<style>
#lyte_xxx {
    background-image: url(xxxxx/wp-content/plugins/wp-youtube-lyte/lyteCache.php?origThumbUrl=https%3A%2F%2Fi.ytimg.com%2xxx.jpg);
}
</style>

Suggested Code

<div class="lyte lP" id="WYL_xxx...">
    <div id="lyte_xxx..." class="pL">
        <img src="xxxxx/wp-content/plugins/wp-youtube-lyte/lyteCache.php?origThumbUrl=https%3A%2F%2Fi.ytimg.com%2xxx.jpg" alt="" width="1280" height="700" />
        <div class="tC">
            <div class="tT"></div>
        </div>
        <div class="play"></div>
        <div class="ctrl">
            <div class="Lctrl"></div>
            <div class="Rctrl"></div>
        </div>
    </div>
</div>

In the past, there was an advantage in setting an image for BackgroundImage, but now we can use loading=”lazy”, decoding=”async”, etc. and expect to optimize plug-ins, etc.

We hope you will consider this!