Using a script to load images on two websites, the image is placed inside a div with the ID div-to-load-external-image
Encountering an issue where PageSpeed Insights advises to preload these images, seeking guidance...
Any assistance will be appreciated.
var imagesvar = [
["/goout/mylink/", "https://picsum.photos/300/145", "Title 1", "tracking-image"],
["/goout/mylink/", "https://picsum.photos/300/145", "Title 2", "tracking-image"],
["/goout/mylink/", "https://picsum.photos/300/145", "Title 3", "tracking-image"],
["/goout/mylink/", "https://picsum.photos/300/145", "Title 4", "tracking-image"],
];
function shuffle(b) {
var j, x, i;
for (i = b.length - 1; i > 0; i--) {
j = Math.floor(Math.random() * (i + 1));
x = b[i];
b[i] = b[j];
b[j] = x;
}
return b;
}
shuffle(imagesvar);
document.getElementById('div-to-load-external-image').innerHTML = '<a href="'+imagesvar[0][0]+'" target="_blank" rel="nofollow"><span class="myclass">New</span><div class="myimage" style="text-align:center;"><img src="'+imagesvar[0][1]+'" width="300px" height="145px" alt="'+imagesvar[0][3]+'" onClick="gtag(\'event\', \'TodNav\', {\'event_category\': \'tod\',\'event_label\': \'tod-'+imagesvar[0][3]+'\'});" /></div><h2 class="title">'+imagesvar[0][2]+'</h2></a>';