Почему тэг <picture> загружает изображение дважды?

Question

Я использую элемент изображения в HTML так:

<picture> 
    <source media="(max-width: 375px)" 
     srcset="http://mysite/-/media/Images/picture.ashx?mw=375"> 
    <source media="(max-width: 800px)" 
     srcset="http://mysite/-/media/Images/picture.ashx?mw=800"> 
    <img src="http://mysite/-/media/Images/picture.ashx" 
     alt="responsive image that doesn’t break your layout"> 
</picture> 

Я использую CMS для обработки медиа, таким образом, расширение .ashx. Моя CMS поддерживает динамическое изменение размеров изображений путем добавления строки запроса mw = X для вызова max-width. Мой маг по умолчанию - .png с шириной 1280 пикселей.

похоже, отлично работает в Chrome 46.x. Когда я изменяю размер моего окна просмотра, изображение сжимается соответствующим образом до разных размеров.

В чем я смущен, это когда я просматриваю сетевой трафик (с хромом и скрипачом), я вижу, что мое изображение загружено дважды. Я использовал хром для установки моего окна просмотра на iPhone 6 и выполнил «Пустой кеш и жесткую перезагрузку». То, что я вижу в скрипаче, - picture.ashx? Mw = 800, а затем picture.ashx сразу же.

Снимок экрана из сетевого трафика в Chrome:

Почему мой браузер загрузки изображения в два раза?

Answer 1

Я нашел проблему. При использовании режима устройства в Chrome изображение загружается дважды. Если я просто изменю размер окна браузера на меньший размер, он не будет загружен дважды. Я думаю, что это всего лишь ошибка в Device Viewport.