Created attachment 321087 [details] Reduced test case When an image element is created: > const image = document.createElement('img'); > image.setAttribute('srcset', 'https://via.placeholder.com/300x100/0e7f00'); webkit starts preloading the srcset immediately. However, when an image is intended to become part of a picture tag: > const picture = document.createElement('picture'); > const source = document.createElement('source'); > const image = document.createElement('img'); > > source.setAttribute('sizes', '100vw'); > source.setAttribute('media', '(orientation: portrait)'); > > image.setAttribute('sizes', '100vw'); > image.setAttribute('alt', 'Placeholder'); > > source.setAttribute('srcset', 'https://via.placeholder.com/550x900/6600af 550w, https://via.placeholder.com/750x1000/a100af 750w'); > image.setAttribute('srcset', 'https://via.placeholder.com/300x100/0e7f00'); > > picture.appendChild(source); > picture.appendChild(image); I expect either the source or the image to be loaded depending on the media query, not both. # Actual Webkit preloads the image tag, and the source tag when it is added to the picture element. # Expected Only the source tag to be loaded when (orientation: portrait) or only the img to be loaded when (orientation: landscape). Chrome handles this scenario correctly by cancelling the initial request for the image's srcset when it becomes a child of the picture element. Reduced test case: https://s.codepen.io/maximus8891/debug/LzVjNZ/ZorBajwPWeOM Possible duplicates: https://bugs.webkit.org/show_bug.cgi?id=6656 https://bugs.webkit.org/show_bug.cgi?id=35377
<rdar://problem/34500892>
This is the same as bug 159484. They both address the issue of loading multiple resources for the same <picture> element although a single resource will be displayed at the end. *** This bug has been marked as a duplicate of bug 159484 ***