On Tue, Nov 12, 2013 at 11:38 AM, [email protected] <[email protected]> wrote: > On Tue, Nov 12, 2013 at 9:50 AM, Adam Barth <[email protected] > (mailto:[email protected])> wrote: >> We might even be able to make this work without inventing anything: >> >> <style type="text/css"> >> @media (min-width: 480px) { >> .artdirected { >> width: 30px; >> height: 30px; >> background-image: image-set(url(small.png) 1x, url(small-hires.png) 2x); >> } >> } >> @media (min-width: 600px) { >> .artdirected { >> width: 60px; >> height: 60px; >> background-image: image-set(url(large.png) 1x, url(large-hires.png) 2x); >> } >> } >> </style> >> <div class="artdirected"></div> > > Would the <style> element have to reside inline, to reap the performance > benefits?
If you want the preload scanner to be able to load the images, you'll need to put the URLs in a place where the preload scanner can see them, which means inline. Adam
