Skip to content

Instantly share code, notes, and snippets.

Embed
What would you like to do?
performantRetina.js
var performantRetina = {
run : function(){
if(!window.devicePixelRatio || window.devicePixelRatio === 1){return;}
var images = document.getElementsByTagName('img');
for(var i = 0; i < images.length; i++){
var retinaSrc = images[i].getAttribute('data-retina-src');
if(!retinaSrc){continue;}
images[i].setAttribute('src', retinaSrc);
}
}
};
performantRetina.run();
// Why bother with this? Only benefit would be if downloading images were blocking in some way, so downloading initial image would download and be done, other processes could run, and then subsequent image could download. Don't have time to test it out right now, but I suspect we're better off just using srcset.
Sign up for free to join this conversation on GitHub. Already have an account? Sign in to comment